chore: Style updates

unoplatform · Sep 9, 2021 · ce63c51 · ce63c51
1 parent 9d2755f
commit ce63c51
Show file tree

Hide file tree

Showing 28 changed files with 1,612 additions and 440 deletions.
diff --git a/...lesApp.UnitTests.Shared/Controls/UITests/Presentation/SampleChooserViewMode.Properties.cs b/...lesApp.UnitTests.Shared/Controls/UITests/Presentation/SampleChooserViewMode.Properties.cs
@@ -409,9 +409,11 @@ public bool UseFluentStyles
 				{
 					Application.Current.Resources.MergedDictionaries.Remove(_fluentResources);
 				}
+#if HAS_UNO
 				Application.Current.Resources?.UpdateThemeBindings();
 				Uno.UI.ResourceResolver.UpdateSystemThemeBindings();
 				Application.PropagateThemeChanged(Windows.UI.Xaml.Window.Current.Content);
+#endif
 				RaisePropertyChanged();
 			}
 		}

diff --git a/src/Uno.UI.FluentTheme/Resources/Version1/PriorityDefault/FlipView_themeresources.xaml b/src/Uno.UI.FluentTheme/Resources/Version1/PriorityDefault/FlipView_themeresources.xaml
@@ -365,8 +365,4 @@
         </Setter>
     </Style>
 
-	<!-- UNO TODO Currently only style using native flip view control is supported on Android and iOS-->
-	<wasm:Style TargetType="FlipView" BasedOn="{StaticResource DefaultFlipViewStyle}" />
-	<skia:Style TargetType="FlipView" BasedOn="{StaticResource DefaultFlipViewStyle}" />
-
 </ResourceDictionary>
diff --git a/src/Uno.UI.FluentTheme/Resources/Version1/PriorityDefault/NumberBox.xaml b/src/Uno.UI.FluentTheme/Resources/Version1/PriorityDefault/NumberBox.xaml
@@ -190,6 +190,8 @@
     </Style>
 
     <Style x:Key="NumberBoxTextBoxStyle" TargetType="TextBox" BasedOn="{StaticResource DefaultTextBoxStyle}">
+        <!-- Uno workaround: theme-binding with updates is currently not supported on TargetNullValue -->
+        <Setter Property="PlaceholderForeground" Value="{ThemeResource TextControlPlaceholderForeground}" />
         <Setter Property="Template">
             <Setter.Value>
                 <ControlTemplate TargetType="TextBox">

diff --git a/src/Uno.UI.FluentTheme/Resources/Version2/Priority01/Common_themeresources_any.xaml b/src/Uno.UI.FluentTheme/Resources/Version2/Priority01/Common_themeresources_any.xaml
@@ -54,6 +54,8 @@
 
             <Color x:Key="ControlStrokeColorDefault">#12FFFFFF</Color>
             <Color x:Key="ControlStrokeColorSecondary">#18FFFFFF</Color>
+            <!-- Uno specific: "Average" of Default and Secondary for border purposes -->
+            <Color x:Key="ControlStrokeColorAverage">#15FFFFFF</Color>
             <Color x:Key="ControlStrokeColorOnAccentDefault">#14FFFFFF</Color>
             <Color x:Key="ControlStrokeColorOnAccentSecondary">#23000000</Color>
             <Color x:Key="ControlStrokeColorOnAccentTertiary">#37000000</Color>
@@ -222,8 +224,13 @@
             <SolidColorBrush x:Key="SystemColorGrayTextColorBrush" Color="#FF00FF" />
 
             <!-- Elevation border brushes-->
+            <!-- TODO Uno: LinearGradientBrush as border is not supported well -->
 
-            <LinearGradientBrush x:Key="ControlElevationBorderBrush" MappingMode="Absolute" StartPoint="0,0" EndPoint="0,3">
+            <SolidColorBrush x:Key="ControlElevationBorderBrush" Color="{StaticResource ControlStrokeColorAverage}" />
+            <SolidColorBrush x:Key="CircleElevationBorderBrush" Color="{StaticResource ControlStrokeColorAverage}" />
+            <SolidColorBrush x:Key="AccentControlElevationBorderBrush" Color="{StaticResource ControlStrokeColorOnAccentDefault}" />
+
+            <!-- <LinearGradientBrush x:Key="ControlElevationBorderBrush" MappingMode="Absolute" StartPoint="0,0" EndPoint="0,3">
                 <LinearGradientBrush.GradientStops>
                     <GradientStop Offset="0.33" Color="{StaticResource ControlStrokeColorSecondary}"/>
                     <GradientStop Offset="1.0" Color="{StaticResource ControlStrokeColorDefault}"/>
@@ -245,7 +252,7 @@
                     <GradientStop Offset="0.33" Color="{StaticResource ControlStrokeColorOnAccentSecondary}"/>
                     <GradientStop Offset="1.0" Color="{StaticResource ControlStrokeColorOnAccentDefault}"/>
                 </LinearGradientBrush.GradientStops>
-            </LinearGradientBrush>
+            </LinearGradientBrush> -->
         </ResourceDictionary>
 
         <ResourceDictionary x:Key="Light">
@@ -298,6 +305,8 @@
 
             <Color x:Key="ControlStrokeColorDefault">#0F000000</Color>
             <Color x:Key="ControlStrokeColorSecondary">#29000000</Color>
+            <!-- Uno specific: "Average" of Default and Secondary for border purposes -->
+            <Color x:Key="ControlStrokeColorAverage">#15000000</Color>
             <Color x:Key="ControlStrokeColorOnAccentDefault">#14FFFFFF</Color>
             <Color x:Key="ControlStrokeColorOnAccentSecondary">#66000000</Color>
             <Color x:Key="ControlStrokeColorOnAccentTertiary">#37000000</Color>
@@ -457,6 +466,12 @@
 
             <!-- Elevation border brushes-->
 
+            <!-- TODO Uno: LinearGradientBrush as border is not supported well -->
+            <SolidColorBrush x:Key="ControlElevationBorderBrush" Color="{StaticResource ControlStrokeColorAverage}" />
+            <SolidColorBrush x:Key="CircleElevationBorderBrush" Color="{StaticResource ControlStrokeColorAverage}" />
+            <SolidColorBrush x:Key="AccentControlElevationBorderBrush" Color="{StaticResource ControlStrokeColorOnAccentDefault}" />
+
+            <!-- 
             <LinearGradientBrush x:Key="ControlElevationBorderBrush" MappingMode="Absolute" StartPoint="0,0" EndPoint="0,3">
                 <LinearGradientBrush.RelativeTransform>
                     <ScaleTransform ScaleY="-1" CenterY="0.5"/>
@@ -482,7 +497,7 @@
                     <GradientStop Offset="0.33" Color="{StaticResource ControlStrokeColorOnAccentSecondary}"/>
                     <GradientStop Offset="1.0" Color="{StaticResource ControlStrokeColorOnAccentDefault}"/>
                 </LinearGradientBrush.GradientStops>
-            </LinearGradientBrush>
+            </LinearGradientBrush> -->
 
             <!-- Duplication from HighContrast colors to match keys, set to magenta to show these should not be used  -->
             <SolidColorBrush x:Key="SystemColorWindowTextColorBrush" Color="#FF00FF" />
@@ -645,6 +660,8 @@
             <Color x:Key="ControlOnImageFillColorDisabled">#FF0000</Color>
             <Color x:Key="ControlStrokeColorDefault">#FF0000</Color>
             <Color x:Key="ControlStrokeColorSecondary">#FF0000</Color>
+            <!-- Uno specific: "Average" of Default and Secondary for border purposes -->
+            <Color x:Key="ControlStrokeColorAverage">#FF0000</Color>
             <Color x:Key="ControlStrokeColorOnAccentDefault">#FF0000</Color>
             <Color x:Key="ControlStrokeColorOnAccentSecondary">#FF0000</Color>
             <Color x:Key="ControlStrokeColorOnAccentTertiary">#FF0000</Color>

diff --git a/src/Uno.UI.FluentTheme/Resources/Version2/Priority02/PasswordBox_themeresources.xaml b/src/Uno.UI.FluentTheme/Resources/Version2/Priority02/PasswordBox_themeresources.xaml
@@ -30,7 +30,8 @@
         <Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Hidden" />
         <Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Hidden" />
         <Setter Property="Padding" Value="{ThemeResource TextControlThemePadding}" />
-        <contract7Present:Setter Property="ContextFlyout" Value="{StaticResource TextControlCommandBarContextFlyout}" />
+        <!--UNO TODO: TextCommandBarFlyout isn't implemented but ContextFlyout is mapped to long-press on some platforms, causing an undismissable invisible popup to appear-->
+        <!-- <contract7Present:Setter Property="ContextFlyout" Value="{StaticResource TextControlCommandBarContextFlyout}" /> -->
         <contract7Present:Setter Property="SelectionFlyout" Value="{StaticResource TextControlCommandBarSelectionFlyout}" />
         <contract7Present:Setter Property="CornerRadius" Value="{ThemeResource ControlCornerRadius}" />
         <Setter Property="Template">

diff --git a/src/Uno.UI.FluentTheme/Resources/Version2/Priority02/RevealBrush_rs1_themeresources.xaml b/src/Uno.UI.FluentTheme/Resources/Version2/Priority02/RevealBrush_rs1_themeresources.xaml
@@ -646,7 +646,8 @@
         <Setter Property="Width" Value="Auto" />
     </Style>
     <Style TargetType="ListViewItem" x:Key="ListViewItemRevealStyle" />
-    <Style TargetType="GridViewItem" x:Key="GridViewItemRevealStyle" />
+    <!--UNO TODO: ListViewItemPresenter isn't supported https://github.com/unoplatform/uno/issues/1444-->
+    <!-- <Style TargetType="GridViewItem" x:Key="GridViewItemRevealStyle" /> -->
     <Style TargetType="ComboBoxItem" x:Key="ComboBoxItemRevealStyle" />
     <Style TargetType="SemanticZoom" x:Key="SemanticZoomRevealStyle"/>
     <Style TargetType="controls:DropDownButton" x:Key="DropDownButtonRevealStyle"/>

diff --git a/src/Uno.UI.FluentTheme/Resources/Version2/Priority02/TextBox_themeresources.xaml b/src/Uno.UI.FluentTheme/Resources/Version2/Priority02/TextBox_themeresources.xaml
@@ -56,7 +56,10 @@
             <StaticResource x:Key="TextControlButtonForegroundPointerOver" ResourceKey="TextFillColorSecondaryBrush" />
             <StaticResource x:Key="TextControlButtonForegroundPressed" ResourceKey="TextFillColorTertiaryBrush" />
 
-            <LinearGradientBrush x:Key="TextControlElevationBorderBrush" MappingMode="Absolute" StartPoint="0,0" EndPoint="0,2">
+            <!-- TODO Uno: Cannot use LinearGradientBrush for border -->
+            <SolidColorBrush x:Key="TextControlElevationBorderBrush" Color="#50FFFFFF" />
+            <SolidColorBrush x:Key="TextControlElevationBorderFocusedBrush" Color="{ThemeResource SystemAccentColorLight2}" />
+            <!-- <LinearGradientBrush x:Key="TextControlElevationBorderBrush" MappingMode="Absolute" StartPoint="0,0" EndPoint="0,2">
                 <LinearGradientBrush.RelativeTransform>
                     <ScaleTransform ScaleY="-1" CenterY="0.5"/>
                 </LinearGradientBrush.RelativeTransform>
@@ -74,7 +77,7 @@
                     <GradientStop Offset="1.0" Color="{ThemeResource SystemAccentColorLight2}"/>
                     <GradientStop Offset="1.0" Color="{StaticResource ControlStrokeColorDefault}"/>
                 </LinearGradientBrush.GradientStops>
-            </LinearGradientBrush>
+            </LinearGradientBrush> -->
         </ResourceDictionary>
 
         <ResourceDictionary x:Key="HighContrast">
@@ -106,7 +109,10 @@
             <StaticResource x:Key="TextControlForegroundFocused" ResourceKey="SystemControlForegroundBaseHighBrush" />
             <StaticResource x:Key="TextControlPlaceholderForegroundFocused" ResourceKey="SystemControlForegroundBaseMediumLowBrush" />
 
-            <LinearGradientBrush x:Key="TextControlElevationBorderBrush" MappingMode="Absolute" StartPoint="0,0" EndPoint="0,2">
+            <!-- TODO Uno: Cannot use LinearGradientBrush for border -->
+            <SolidColorBrush x:Key="TextControlElevationBorderBrush" Color="{StaticResource ControlStrokeColorDefault}" />
+            <SolidColorBrush x:Key="TextControlElevationBorderFocusedBrush" Color="{ThemeResource SystemAccentColorLight2}" />
+            <!--<LinearGradientBrush x:Key="TextControlElevationBorderBrush" MappingMode="Absolute" StartPoint="0,0" EndPoint="0,2">
                 <LinearGradientBrush.RelativeTransform>
                     <ScaleTransform ScaleY="-1" CenterY="0.5"/>
                 </LinearGradientBrush.RelativeTransform>
@@ -124,7 +130,7 @@
                     <GradientStop Offset="1.0" Color="{ThemeResource SystemAccentColorLight2}"/>
                     <GradientStop Offset="1.0" Color="{StaticResource ControlStrokeColorDefault}"/>
                 </LinearGradientBrush.GradientStops>
-            </LinearGradientBrush>
+            </LinearGradientBrush>-->
         </ResourceDictionary>
 
         <ResourceDictionary x:Key="Light">
@@ -176,7 +182,10 @@
             <StaticResource x:Key="TextControlButtonForegroundPointerOver" ResourceKey="TextFillColorSecondaryBrush" />
             <StaticResource x:Key="TextControlButtonForegroundPressed" ResourceKey="TextFillColorTertiaryBrush" />
 
-            <LinearGradientBrush x:Key="TextControlElevationBorderBrush" MappingMode="Absolute" StartPoint="0,0" EndPoint="0,2">
+            <!-- TODO Uno: Cannot use LinearGradientBrush for border -->
+            <SolidColorBrush x:Key="TextControlElevationBorderBrush" Color="#50000000" />
+            <SolidColorBrush x:Key="TextControlElevationBorderFocusedBrush" Color="{ThemeResource SystemAccentColorDark1}" />
+            <!--<LinearGradientBrush x:Key="TextControlElevationBorderBrush" MappingMode="Absolute" StartPoint="0,0" EndPoint="0,2">
                 <LinearGradientBrush.RelativeTransform>
                     <ScaleTransform ScaleY="-1" CenterY="0.5"/>
                 </LinearGradientBrush.RelativeTransform>
@@ -194,7 +203,7 @@
                     <GradientStop Offset="1.0" Color="{ThemeResource SystemAccentColorDark1}"/>
                     <GradientStop Offset="1.0" Color="{StaticResource ControlStrokeColorDefault}"/>
                 </LinearGradientBrush.GradientStops>
-            </LinearGradientBrush>
+            </LinearGradientBrush>-->
         </ResourceDictionary>
     </ResourceDictionary.ThemeDictionaries>
 
@@ -205,6 +214,8 @@
     <Style TargetType="TextBox" BasedOn="{StaticResource DefaultTextBoxStyle}" />
 
     <Style x:Key="DefaultTextBoxStyle" TargetType="TextBox">
+        <!-- Uno workaround: theme-binding with updates is currently not supported on TargetNullValue -->
+        <Setter Property="PlaceholderForeground" Value="{ThemeResource TextControlPlaceholderForeground}" />
         <Setter Property="Foreground" Value="{ThemeResource TextControlForeground}" />
         <Setter Property="Background" Value="{ThemeResource TextControlBackground}" />
         <Setter Property="BorderBrush" Value="{ThemeResource TextControlBorderBrush}" />
@@ -220,11 +231,12 @@
         <Setter Property="MinHeight" Value="{ThemeResource TextControlThemeMinHeight}" />
         <Setter Property="MinWidth" Value="{ThemeResource TextControlThemeMinWidth}" />
         <Setter Property="Padding" Value="{ThemeResource TextControlThemePadding}" />
-        <contract6Present:Setter Property="UseSystemFocusVisuals" Value="{ThemeResource IsApplicationFocusVisualKindReveal}" />
-        <contract7Present:Setter Property="ContextFlyout" Value="{StaticResource TextControlCommandBarContextFlyout}" />
-        <contract7Present:Setter Property="SelectionFlyout" Value="{StaticResource TextControlCommandBarSelectionFlyout}" />
-        <contract7Present:Setter Property="CornerRadius" Value="{ThemeResource ControlCornerRadius}" />
-        <contract7Present:Setter Property="BackgroundSizing" Value="InnerBorderEdge" />
+        <Setter Property="UseSystemFocusVisuals" Value="{ThemeResource IsApplicationFocusVisualKindReveal}" />
+        <!--UNO TODO: TextCommandBarFlyout isn't implemented but ContextFlyout is mapped to long-press on some platforms, causing an undismissable invisible popup to appear-->
+        <!--<Setter Property="ContextFlyout" Value="{StaticResource TextControlCommandBarContextFlyout}" />-->        
+        <Setter Property="SelectionFlyout" Value="{StaticResource TextControlCommandBarSelectionFlyout}" />
+        <Setter Property="CornerRadius" Value="{ThemeResource ControlCornerRadius}" />
+        <Setter Property="BackgroundSizing" Value="InnerBorderEdge" />
         <Setter Property="Template">
             <Setter.Value>
                 <ControlTemplate TargetType="TextBox">
@@ -320,8 +332,9 @@
                                             <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource TextControlForegroundDisabled}" />
                                         </ObjectAnimationUsingKeyFrames>
                                         <ObjectAnimationUsingKeyFrames Storyboard.TargetName="PlaceholderTextContentPresenter" Storyboard.TargetProperty="Foreground">
-                                            <contract5NotPresent:DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource TextControlPlaceholderForegroundDisabled}" />
-                                            <contract5Present:DiscreteObjectKeyFrame KeyTime="0" Value="{Binding PlaceholderForeground, RelativeSource={RelativeSource TemplatedParent}, TargetNullValue={ThemeResource TextControlPlaceholderForegroundDisabled}}" />
+                                            <!-- Uno workaround: theme-binding with updates is currently not supported on TargetNullValue -->
+                                            <!-- <DiscreteObjectKeyFrame KeyTime="0" Value="{Binding PlaceholderForeground, RelativeSource={RelativeSource TemplatedParent}, TargetNullValue={ThemeResource TextControlPlaceholderForegroundDisabled}}" /> -->
+                                            <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource TextControlPlaceholderForegroundDisabled}" />                                            
                                         </ObjectAnimationUsingKeyFrames>
                                     </Storyboard>
                                 </VisualState>
@@ -336,8 +349,9 @@
                                             <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource TextControlBackgroundPointerOver}" />
                                         </ObjectAnimationUsingKeyFrames>
                                         <ObjectAnimationUsingKeyFrames Storyboard.TargetName="PlaceholderTextContentPresenter" Storyboard.TargetProperty="Foreground">
-                                            <contract5NotPresent:DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource TextControlPlaceholderForegroundPointerOver}" />
-                                            <contract5Present:DiscreteObjectKeyFrame KeyTime="0" Value="{Binding PlaceholderForeground, RelativeSource={RelativeSource TemplatedParent}, TargetNullValue={ThemeResource TextControlPlaceholderForegroundPointerOver}}" />
+                                            <!-- Uno workaround: theme-binding with updates is currently not supported on TargetNullValue -->
+                                            <!-- <DiscreteObjectKeyFrame KeyTime="0" Value="{Binding PlaceholderForeground, RelativeSource={RelativeSource TemplatedParent}, TargetNullValue={ThemeResource TextControlPlaceholderForegroundPointerOver}}" /> -->
+                                            <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource TextControlPlaceholderForegroundPointerOver}" />
                                         </ObjectAnimationUsingKeyFrames>
                                         <ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentElement" Storyboard.TargetProperty="Foreground">
                                             <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource TextControlForegroundPointerOver}" />
@@ -348,8 +362,9 @@
 
                                     <Storyboard>
                                         <ObjectAnimationUsingKeyFrames Storyboard.TargetName="PlaceholderTextContentPresenter" Storyboard.TargetProperty="Foreground">
-                                            <contract5NotPresent:DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource TextControlPlaceholderForegroundFocused}" />
-                                            <contract5Present:DiscreteObjectKeyFrame KeyTime="0" Value="{Binding PlaceholderForeground, RelativeSource={RelativeSource TemplatedParent}, TargetNullValue={ThemeResource TextControlPlaceholderForegroundFocused}}" />
+                                            <!-- Uno workaround: theme-binding with updates is currently not supported on TargetNullValue -->
+                                            <!-- <DiscreteObjectKeyFrame KeyTime="0" Value="{Binding PlaceholderForeground, RelativeSource={RelativeSource TemplatedParent}, TargetNullValue={ThemeResource TextControlPlaceholderForegroundFocused}}" /> -->
+                                            <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource TextControlPlaceholderForegroundFocused}" />                                            
                                         </ObjectAnimationUsingKeyFrames>
                                         <ObjectAnimationUsingKeyFrames Storyboard.TargetName="BorderElement" Storyboard.TargetProperty="Background">
                                             <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource TextControlBackgroundFocused}" />

diff --git a/src/Uno.UI.FluentTheme/Resources/Version2/PriorityDefault/Button_themeresources.xaml b/src/Uno.UI.FluentTheme/Resources/Version2/PriorityDefault/Button_themeresources.xaml
@@ -152,6 +152,7 @@
         <Setter Property="Template">
             <Setter.Value>
                 <ControlTemplate TargetType="Button">
+                    <!-- Uno workaround: template-bind ContentTemplateSelector because it's not automatically propagated from the ContentControl -->
                     <ContentPresenter
                         x:Name="ContentPresenter"
                         Background="{TemplateBinding Background}"
@@ -160,6 +161,7 @@
                         BorderThickness="{TemplateBinding BorderThickness}"
                         Content="{TemplateBinding Content}"
                         ContentTemplate="{TemplateBinding ContentTemplate}"
+                        ContentTemplateSelector="{TemplateBinding ContentTemplateSelector}"
                         ContentTransitions="{TemplateBinding ContentTransitions}"
                         contract7Present:CornerRadius="{TemplateBinding CornerRadius}"
                         contract7NotPresent:CornerRadius="{ThemeResource ControlCornerRadius}"