Skip to content

Commit d08d589

Browse files
committed
fix: ToggleButton WinUI 2.6 border workaround
1 parent 1991964 commit d08d589

File tree

2 files changed

+143
-43
lines changed

2 files changed

+143
-43
lines changed

src/Uno.UI.FluentTheme/Resources/Version2/PriorityDefault/ToggleButton_themeresources.xaml

Lines changed: 86 additions & 30 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,11 @@
33
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
44
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
55
xmlns:contract7Present="http://schemas.microsoft.com/winfx/2006/xaml/presentation?IsApiContractPresent(Windows.Foundation.UniversalApiContract,7)"
6-
xmlns:contract7NotPresent="http://schemas.microsoft.com/winfx/2006/xaml/presentation?IsApiContractNotPresent(Windows.Foundation.UniversalApiContract,7)">
6+
xmlns:contract7NotPresent="http://schemas.microsoft.com/winfx/2006/xaml/presentation?IsApiContractNotPresent(Windows.Foundation.UniversalApiContract,7)"
7+
xmlns:not_win="http://uno.ui/not_win"
8+
xmlns:win="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
9+
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
10+
mc:ignorable="not_win">
711
<ResourceDictionary.ThemeDictionaries>
812
<ResourceDictionary x:Key="Default">
913
<Thickness x:Key="ToggleButtonBorderThemeThickness">1</Thickness>
@@ -190,7 +194,11 @@
190194
<Setter Property="Background" Value="{ThemeResource ToggleButtonBackground}" />
191195
<contract7Present:Setter Property="BackgroundSizing" Value="InnerBorderEdge" />
192196
<Setter Property="Foreground" Value="{ThemeResource ToggleButtonForeground}" />
193-
<Setter Property="BorderBrush" Value="{ThemeResource ToggleButtonBorderBrush}" />
197+
198+
<!-- Uno specific (LinearGradientBrush borders): Use solid border brush -->
199+
<win:Setter Property="BorderBrush" Value="{ThemeResource ToggleButtonBorderBrush}" />
200+
<not_win:Setter Property="BorderBrush" Value="{ThemeResource ControlStrokeColorDefaultBrush}" />
201+
194202
<Setter Property="BorderThickness" Value="{ThemeResource ToggleButtonBorderThemeThickness}" />
195203
<Setter Property="Padding" Value="{StaticResource ButtonPadding}" />
196204
<Setter Property="HorizontalAlignment" Value="Left" />
@@ -204,28 +212,39 @@
204212
<Setter Property="Template">
205213
<Setter.Value>
206214
<ControlTemplate TargetType="ToggleButton">
207-
<!-- Uno workaround: template-bind ContentTemplateSelector because it's not automatically propagated from the ContentControl -->
208-
<ContentPresenter
209-
x:Name="ContentPresenter"
210-
Background="{TemplateBinding Background}"
211-
contract7Present:BackgroundSizing="{TemplateBinding BackgroundSizing}"
212-
BorderBrush="{TemplateBinding BorderBrush}"
213-
BorderThickness="{TemplateBinding BorderThickness}"
214-
Content="{TemplateBinding Content}"
215-
ContentTemplate="{TemplateBinding ContentTemplate}"
216-
ContentTemplateSelector="{TemplateBinding ContentTemplateSelector}"
217-
ContentTransitions="{TemplateBinding ContentTransitions}"
218-
contract7Present:CornerRadius="{TemplateBinding CornerRadius}"
219-
contract7NotPresent:CornerRadius="{ThemeResource ControlCornerRadius}"
220-
Padding="{TemplateBinding Padding}"
221-
HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
222-
VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
223-
AutomationProperties.AccessibilityView="Raw">
215+
<!-- Uno specific (LinearGradientBrush borders): Additional Grid as template root needed -->
216+
<Grid>
217+
<!-- Uno workaround: template-bind ContentTemplateSelector because it's not automatically propagated from the ContentControl -->
218+
<ContentPresenter
219+
x:Name="ContentPresenter"
220+
Background="{TemplateBinding Background}"
221+
contract7Present:BackgroundSizing="{TemplateBinding BackgroundSizing}"
222+
BorderBrush="{TemplateBinding BorderBrush}"
223+
BorderThickness="{TemplateBinding BorderThickness}"
224+
Content="{TemplateBinding Content}"
225+
ContentTemplate="{TemplateBinding ContentTemplate}"
226+
ContentTemplateSelector="{TemplateBinding ContentTemplateSelector}"
227+
ContentTransitions="{TemplateBinding ContentTransitions}"
228+
contract7Present:CornerRadius="{TemplateBinding CornerRadius}"
229+
contract7NotPresent:CornerRadius="{ThemeResource ControlCornerRadius}"
230+
Padding="{TemplateBinding Padding}"
231+
HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
232+
VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
233+
AutomationProperties.AccessibilityView="Raw">
234+
235+
<contract7Present:ContentPresenter.BackgroundTransition>
236+
<contract7Present:BrushTransition Duration="0:0:0.083" />
237+
</contract7Present:ContentPresenter.BackgroundTransition>
238+
239+
</ContentPresenter>
240+
241+
<!-- Uno specific (LinearGradientBrush borders): Simulates bottom border -->
242+
<not_win:Border x:Name="BottomBorderElement"
243+
BorderThickness="0,0,0,1"
244+
contract7Present:CornerRadius="{TemplateBinding CornerRadius}"
245+
contract7NotPresent:CornerRadius="{ThemeResource ControlCornerRadius}"
246+
BorderBrush="{ThemeResource UnoElevationBorderOverlayBrush}" />
224247

225-
<contract7Present:ContentPresenter.BackgroundTransition>
226-
<contract7Present:BrushTransition Duration="0:0:0.083" />
227-
</contract7Present:ContentPresenter.BackgroundTransition>
228-
229248
<VisualStateManager.VisualStateGroups>
230249
<VisualStateGroup x:Name="CommonStates">
231250
<VisualState x:Name="Normal"/>
@@ -235,9 +254,10 @@
235254
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentPresenter" Storyboard.TargetProperty="Background">
236255
<DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource ToggleButtonBackgroundPointerOver}" />
237256
</ObjectAnimationUsingKeyFrames>
238-
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentPresenter" Storyboard.TargetProperty="BorderBrush">
257+
<!-- Uno specific (LinearGradientBrush borders): Keep the same brush -->
258+
<win:ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentPresenter" Storyboard.TargetProperty="BorderBrush">
239259
<DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource ToggleButtonBorderBrushPointerOver}" />
240-
</ObjectAnimationUsingKeyFrames>
260+
</win:ObjectAnimationUsingKeyFrames>
241261
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentPresenter" Storyboard.TargetProperty="Foreground">
242262
<DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource ToggleButtonForegroundPointerOver}" />
243263
</ObjectAnimationUsingKeyFrames>
@@ -251,6 +271,10 @@
251271
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentPresenter" Storyboard.TargetProperty="BorderBrush">
252272
<DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource ToggleButtonBorderBrushPressed}" />
253273
</ObjectAnimationUsingKeyFrames>
274+
<!-- Uno specific (LinearGradientBrush borders): Hide bottom border overlay -->
275+
<not_win:ObjectAnimationUsingKeyFrames Storyboard.TargetName="BottomBorderElement" Storyboard.TargetProperty="Visibility">
276+
<DiscreteObjectKeyFrame KeyTime="0" Value="Collapsed" />
277+
</not_win:ObjectAnimationUsingKeyFrames>
254278
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentPresenter" Storyboard.TargetProperty="Foreground">
255279
<DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource ToggleButtonForegroundPressed}" />
256280
</ObjectAnimationUsingKeyFrames>
@@ -264,6 +288,10 @@
264288
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentPresenter" Storyboard.TargetProperty="Foreground">
265289
<DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource ToggleButtonForegroundDisabled}" />
266290
</ObjectAnimationUsingKeyFrames>
291+
<!-- Uno specific (LinearGradientBrush borders): Hide bottom border overlay -->
292+
<not_win:ObjectAnimationUsingKeyFrames Storyboard.TargetName="BottomBorderElement" Storyboard.TargetProperty="Visibility">
293+
<DiscreteObjectKeyFrame KeyTime="0" Value="Collapsed" />
294+
</not_win:ObjectAnimationUsingKeyFrames>
267295
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentPresenter" Storyboard.TargetProperty="BorderBrush">
268296
<DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource ToggleButtonBorderBrushDisabled}" />
269297
</ObjectAnimationUsingKeyFrames>
@@ -278,8 +306,13 @@
278306
<DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource ToggleButtonForegroundChecked}" />
279307
</ObjectAnimationUsingKeyFrames>
280308
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentPresenter" Storyboard.TargetProperty="BorderBrush">
281-
<DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource ToggleButtonBorderBrushChecked}" />
309+
<!-- Uno specific (LinearGradientBrush borders): Use solid color brush-->
310+
<DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource ControlStrokeColorOnAccentDefaultBrush}" />
282311
</ObjectAnimationUsingKeyFrames>
312+
<!-- Uno specific (LinearGradientBrush borders): Adjust color for accent overlay -->
313+
<not_win:ObjectAnimationUsingKeyFrames Storyboard.TargetName="BottomBorderElement" Storyboard.TargetProperty="BorderBrush">
314+
<DiscreteObjectKeyFrame KeyTime="0" Value="ControlStrokeColorOnAccentSecondaryBrush" />
315+
</not_win:ObjectAnimationUsingKeyFrames>
283316
<contract7Present:ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentPresenter" Storyboard.TargetProperty="BackgroundSizing">
284317
<DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource ToggleButtonCheckedStateBackgroundSizing}" />
285318
</contract7Present:ObjectAnimationUsingKeyFrames>
@@ -291,8 +324,13 @@
291324
<DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource ToggleButtonBackgroundCheckedPointerOver}" />
292325
</ObjectAnimationUsingKeyFrames>
293326
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentPresenter" Storyboard.TargetProperty="BorderBrush">
294-
<DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource ToggleButtonBorderBrushCheckedPointerOver}" />
327+
<!-- Uno specific (LinearGradientBrush borders): Use solid color brush-->
328+
<DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource ControlStrokeColorOnAccentDefaultBrush}" />
295329
</ObjectAnimationUsingKeyFrames>
330+
<!-- Uno specific (LinearGradientBrush borders): Adjust color for accent overlay -->
331+
<not_win:ObjectAnimationUsingKeyFrames Storyboard.TargetName="BottomBorderElement" Storyboard.TargetProperty="BorderBrush">
332+
<DiscreteObjectKeyFrame KeyTime="0" Value="ControlStrokeColorOnAccentSecondaryBrush" />
333+
</not_win:ObjectAnimationUsingKeyFrames>
296334
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentPresenter" Storyboard.TargetProperty="Foreground">
297335
<DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource ToggleButtonForegroundCheckedPointerOver}" />
298336
</ObjectAnimationUsingKeyFrames>
@@ -315,6 +353,10 @@
315353
<contract7Present:ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentPresenter" Storyboard.TargetProperty="BackgroundSizing">
316354
<DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource ToggleButtonCheckedStateBackgroundSizing}" />
317355
</contract7Present:ObjectAnimationUsingKeyFrames>
356+
<!-- Uno specific (LinearGradientBrush borders): Hide bottom border overlay -->
357+
<not_win:ObjectAnimationUsingKeyFrames Storyboard.TargetName="BottomBorderElement" Storyboard.TargetProperty="Visibility">
358+
<DiscreteObjectKeyFrame KeyTime="0" Value="Collapsed" />
359+
</not_win:ObjectAnimationUsingKeyFrames>
318360
</Storyboard>
319361
</VisualState>
320362
<VisualState x:Name="CheckedDisabled">
@@ -328,6 +370,10 @@
328370
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentPresenter" Storyboard.TargetProperty="BorderBrush">
329371
<DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource ToggleButtonBorderBrushCheckedDisabled}" />
330372
</ObjectAnimationUsingKeyFrames>
373+
<!-- Uno specific (LinearGradientBrush borders): Hide bottom border overlay -->
374+
<not_win:ObjectAnimationUsingKeyFrames Storyboard.TargetName="BottomBorderElement" Storyboard.TargetProperty="Visibility">
375+
<DiscreteObjectKeyFrame KeyTime="0" Value="Collapsed" />
376+
</not_win:ObjectAnimationUsingKeyFrames>
331377
</Storyboard>
332378
</VisualState>
333379
<VisualState x:Name="Indeterminate">
@@ -339,7 +385,8 @@
339385
<DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource ToggleButtonForegroundIndeterminate}" />
340386
</ObjectAnimationUsingKeyFrames>
341387
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentPresenter" Storyboard.TargetProperty="BorderBrush">
342-
<DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource ToggleButtonBorderBrushIndeterminate}" />
388+
<!-- Uno specific (LinearGradientBrush borders): Use solid color brush-->
389+
<DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource ControlStrokeColorDefaultBrush}" />
343390
</ObjectAnimationUsingKeyFrames>
344391
</Storyboard>
345392
</VisualState>
@@ -349,7 +396,8 @@
349396
<DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource ToggleButtonBackgroundIndeterminatePointerOver}" />
350397
</ObjectAnimationUsingKeyFrames>
351398
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentPresenter" Storyboard.TargetProperty="BorderBrush">
352-
<DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource ToggleButtonBorderBrushIndeterminatePointerOver}" />
399+
<!-- Uno specific (LinearGradientBrush borders): Use solid color brush-->
400+
<DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource ControlStrokeColorDefaultBrush}" />
353401
</ObjectAnimationUsingKeyFrames>
354402
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentPresenter" Storyboard.TargetProperty="Foreground">
355403
<DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource ToggleButtonForegroundIndeterminatePointerOver}" />
@@ -367,6 +415,10 @@
367415
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentPresenter" Storyboard.TargetProperty="Foreground">
368416
<DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource ToggleButtonForegroundIndeterminatePressed}" />
369417
</ObjectAnimationUsingKeyFrames>
418+
<!-- Uno specific (LinearGradientBrush borders): Hide bottom border overlay -->
419+
<not_win:ObjectAnimationUsingKeyFrames Storyboard.TargetName="BottomBorderElement" Storyboard.TargetProperty="Visibility">
420+
<DiscreteObjectKeyFrame KeyTime="0" Value="Collapsed" />
421+
</not_win:ObjectAnimationUsingKeyFrames>
370422
</Storyboard>
371423
</VisualState>
372424
<VisualState x:Name="IndeterminateDisabled">
@@ -380,11 +432,15 @@
380432
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentPresenter" Storyboard.TargetProperty="BorderBrush">
381433
<DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource ToggleButtonBorderBrushIndeterminateDisabled}" />
382434
</ObjectAnimationUsingKeyFrames>
435+
<!-- Uno specific (LinearGradientBrush borders): Hide bottom border overlay -->
436+
<not_win:ObjectAnimationUsingKeyFrames Storyboard.TargetName="BottomBorderElement" Storyboard.TargetProperty="Visibility">
437+
<DiscreteObjectKeyFrame KeyTime="0" Value="Collapsed" />
438+
</not_win:ObjectAnimationUsingKeyFrames>
383439
</Storyboard>
384440
</VisualState>
385441
</VisualStateGroup>
386442
</VisualStateManager.VisualStateGroups>
387-
</ContentPresenter>
443+
</Grid>
388444
</ControlTemplate>
389445
</Setter.Value>
390446
</Setter>

0 commit comments

Comments
 (0)