Fix elevationBrushes to match WinUI (#1234)

* Fix elevationBrushes to match WinUI Making the brush not-shared is necessary for it to work properly with content of any height * Fix elevation brush on ToggleButton as well
lepoco · Feb 1, 2025 · b0a38e9 · b0a38e9
1 parent e55d7d7
commit b0a38e9
Show file tree

Hide file tree

Showing 5 changed files with 32 additions and 23 deletions.
diff --git a/src/Wpf.Ui/Controls/NumberBox/NumberBox.xaml b/src/Wpf.Ui/Controls/NumberBox/NumberBox.xaml
@@ -14,7 +14,7 @@
     xmlns:controls="clr-namespace:Wpf.Ui.Controls"
     xmlns:system="clr-namespace:System;assembly=mscorlib">
 
-    <Thickness x:Key="NumberBoxBorderThemeThickness">1,1,1,0</Thickness>
+    <Thickness x:Key="NumberBoxBorderThemeThickness">1,1,1,1</Thickness>
     <Thickness x:Key="NumberBoxAccentBorderThemeThickness">0,0,0,1</Thickness>
     <Thickness x:Key="NumberBoxLeftIconMargin">10,8,0,0</Thickness>
     <Thickness x:Key="NumberBoxRightIconMargin">0,8,10,0</Thickness>

diff --git a/src/Wpf.Ui/Controls/PasswordBox/PasswordBox.xaml b/src/Wpf.Ui/Controls/PasswordBox/PasswordBox.xaml
@@ -14,7 +14,7 @@
     xmlns:controls="clr-namespace:Wpf.Ui.Controls"
     xmlns:system="clr-namespace:System;assembly=mscorlib">
 
-    <Thickness x:Key="PasswordBoxBorderThemeThickness">1,1,1,0</Thickness>
+    <Thickness x:Key="PasswordBoxBorderThemeThickness">1,1,1,1</Thickness>
     <Thickness x:Key="PasswordBoxAccentBorderThemeThickness">0,0,0,1</Thickness>
     <Thickness x:Key="PasswordBoxLeftIconMargin">10,8,0,0</Thickness>
     <Thickness x:Key="PasswordBoxRightIconMargin">0,8,10,0</Thickness>

diff --git a/src/Wpf.Ui/Controls/ToggleButton/ToggleButton.xaml b/src/Wpf.Ui/Controls/ToggleButton/ToggleButton.xaml
@@ -10,7 +10,7 @@
 
 <ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
 
-    <Thickness x:Key="ToggleButtonPadding">11,5,11,6</Thickness>
+    <Thickness x:Key="ToggleButtonPadding">11,5,11,5</Thickness>
     <Thickness x:Key="ToggleButtonBorderThemeThickness">1</Thickness>
     <Thickness x:Key="ToggleButtonIconMargin">0,0,8,0</Thickness>
 
@@ -41,20 +41,23 @@
                         Height="{TemplateBinding Height}"
                         MinWidth="{TemplateBinding MinWidth}"
                         MinHeight="{TemplateBinding MinHeight}"
-                        Padding="{TemplateBinding Padding}"
                         HorizontalAlignment="{TemplateBinding HorizontalAlignment}"
                         VerticalAlignment="{TemplateBinding VerticalAlignment}"
                         Background="{TemplateBinding Background}"
-                        BorderBrush="{TemplateBinding BorderBrush}"
-                        BorderThickness="{TemplateBinding BorderThickness}"
                         CornerRadius="{TemplateBinding Border.CornerRadius}">
-                        <ContentPresenter
-                            x:Name="ContentPresenter"
-                            HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
-                            VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
-                            Content="{TemplateBinding Content}"
-                            TextElement.FontSize="{TemplateBinding FontSize}"
-                            TextElement.Foreground="{TemplateBinding Foreground}" />
+                        <Border
+                            Padding="{TemplateBinding Padding}"
+                            BorderBrush="{TemplateBinding BorderBrush}"
+                            BorderThickness="{TemplateBinding BorderThickness}"
+                            CornerRadius="{TemplateBinding Border.CornerRadius}">
+                            <ContentPresenter
+                                x:Name="ContentPresenter"
+                                HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
+                                VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
+                                Content="{TemplateBinding Content}"
+                                TextElement.FontSize="{TemplateBinding FontSize}"
+                                TextElement.Foreground="{TemplateBinding Foreground}" />
+                        </Border>
                     </Border>
                     <ControlTemplate.Triggers>
                         <MultiTrigger>

diff --git a/src/Wpf.Ui/Resources/Theme/Dark.xaml b/src/Wpf.Ui/Resources/Theme/Dark.xaml
@@ -240,7 +240,7 @@
 
     <!--  Elevation border brushes  -->
 
-    <LinearGradientBrush x:Key="ControlElevationBorderBrush" MappingMode="Absolute" StartPoint="0,0" EndPoint="0,3">
+    <LinearGradientBrush x:Key="ControlElevationBorderBrush" x:Shared="false" MappingMode="Absolute" StartPoint="0,0" EndPoint="0,3">
         <!--<LinearGradientBrush.RelativeTransform>
             <ScaleTransform CenterY="0.5" ScaleY="-1" />
         </LinearGradientBrush.RelativeTransform>-->
@@ -257,7 +257,7 @@
         </LinearGradientBrush.GradientStops>
     </LinearGradientBrush>
 
-    <LinearGradientBrush x:Key="AccentControlElevationBorderBrush" MappingMode="Absolute" StartPoint="0,0" EndPoint="0,3">
+    <LinearGradientBrush x:Key="AccentControlElevationBorderBrush" x:Shared="false" MappingMode="Absolute" StartPoint="0,0" EndPoint="0,3">
         <LinearGradientBrush.RelativeTransform>
             <ScaleTransform CenterY="0.5" ScaleY="-1" />
         </LinearGradientBrush.RelativeTransform>
@@ -267,10 +267,13 @@
         </LinearGradientBrush.GradientStops>
     </LinearGradientBrush>
 
-    <LinearGradientBrush x:Key="TextControlElevationBorderBrush" MappingMode="RelativeToBoundingBox" StartPoint="0,0" EndPoint="0,2">
+    <LinearGradientBrush x:Key="TextControlElevationBorderBrush" x:Shared="false" MappingMode="Absolute" StartPoint="0,0" EndPoint="0,3">
+        <!--<LinearGradientBrush.RelativeTransform>
+            <ScaleTransform CenterY="0.5" ScaleY="-1" />
+        </LinearGradientBrush.RelativeTransform>-->
         <LinearGradientBrush.GradientStops>
-            <GradientStop Offset="0.0" Color="{StaticResource ControlStrokeColorDefault}" />
-            <GradientStop Offset="1.0" Color="{StaticResource ControlStrongStrokeColorDefault}" />
+            <GradientStop Offset="0.33" Color="{StaticResource ControlStrokeColorSecondary}" />
+            <GradientStop Offset="1.0" Color="{StaticResource ControlStrokeColorDefault}" />
         </LinearGradientBrush.GradientStops>
     </LinearGradientBrush>
 

diff --git a/src/Wpf.Ui/Resources/Theme/Light.xaml b/src/Wpf.Ui/Resources/Theme/Light.xaml
@@ -241,7 +241,7 @@
 
     <!--  Elevation border brushes  -->
 
-    <LinearGradientBrush x:Key="ControlElevationBorderBrush" MappingMode="Absolute" StartPoint="0,0" EndPoint="0,3">
+    <LinearGradientBrush x:Key="ControlElevationBorderBrush" x:Shared="false" MappingMode="Absolute" StartPoint="0,0" EndPoint="0,3">
         <LinearGradientBrush.RelativeTransform>
             <ScaleTransform CenterY="0.5" ScaleY="-1" />
         </LinearGradientBrush.RelativeTransform>
@@ -258,7 +258,7 @@
         </LinearGradientBrush.GradientStops>
     </LinearGradientBrush>
 
-    <LinearGradientBrush x:Key="AccentControlElevationBorderBrush" MappingMode="Absolute" StartPoint="0,0" EndPoint="0,3">
+    <LinearGradientBrush x:Key="AccentControlElevationBorderBrush" x:Shared="false" MappingMode="Absolute" StartPoint="0,0" EndPoint="0,3">
         <LinearGradientBrush.RelativeTransform>
             <ScaleTransform CenterY="0.5" ScaleY="-1" />
         </LinearGradientBrush.RelativeTransform>
@@ -268,10 +268,13 @@
         </LinearGradientBrush.GradientStops>
     </LinearGradientBrush>
 
-    <LinearGradientBrush x:Key="TextControlElevationBorderBrush" MappingMode="RelativeToBoundingBox" StartPoint="0,0" EndPoint="0,2">
+    <LinearGradientBrush x:Key="TextControlElevationBorderBrush" x:Shared="false" MappingMode="Absolute" StartPoint="0,0" EndPoint="0,3">
+        <LinearGradientBrush.RelativeTransform>
+            <ScaleTransform CenterY="0.5" ScaleY="-1" />
+        </LinearGradientBrush.RelativeTransform>
         <LinearGradientBrush.GradientStops>
-            <GradientStop Offset="0.0" Color="{StaticResource ControlStrokeColorDefault}" />
-            <GradientStop Offset="1.0" Color="{StaticResource ControlStrongStrokeColorDefault}" />
+            <GradientStop Offset="0.33" Color="{StaticResource ControlStrokeColorSecondary}" />
+            <GradientStop Offset="1.0" Color="{StaticResource ControlStrokeColorDefault}" />
         </LinearGradientBrush.GradientStops>
     </LinearGradientBrush>