Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Scrollbar] Fix carat spacing to edges #4889

Merged
merged 10 commits into from
Apr 29, 2021
Merged

[Scrollbar] Fix carat spacing to edges #4889

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
10 commits
Select commit Hold shift + click to select a range
f020866
Update spacing on edges
almedina-ms Apr 22, 2021
e532f3b
Merge branch 'master' into user/almedina-ms/ScrollBar_VisualUpdates
almedina-ms Apr 23, 2021
a50a4e4
Clean code to remove changes
almedina-ms Apr 23, 2021
74a09e4
Small change reverted
almedina-ms Apr 23, 2021
af6633c
Udpate expected result
almedina-ms Apr 26, 2021
462b3ee
Merge branch 'master' into user/almedina-ms/ScrollBar_VisualUpdates
almedina-ms Apr 26, 2021
20983e7
Force failure for expected results
almedina-ms Apr 26, 2021
fbd4241
Fix carat to edge spacing with no test error
almedina-ms Apr 27, 2021
c2813b7
Revert tree view tests failures
almedina-ms Apr 28, 2021
b18c62c
Update verification files
almedina-ms Apr 28, 2021
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
21 changes: 13 additions & 8 deletions dev/CommonStyles/ScrollBar_themeresources.xaml
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -207,6 +207,11 @@
<primitives:CornerRadiusFilterConverter x:Key="TopLeftCornerRadiusDoubleValueConverter2x" Filter="TopLeftValue" Scale="2"/>
<primitives:CornerRadiusFilterConverter x:Key="BottomRightCornerRadiusDoubleValueConverter2x" Filter="BottomRightValue" Scale="2"/>

<Thickness x:Key="ScrollBarHorizontalDecreaseMargin">4,0,0,0</Thickness>
<Thickness x:Key="ScrollBarHorizontalIncreaseMargin">0,0,4,0</Thickness>
<Thickness x:Key="ScrollBarVerticalDecreaseMargin">0,4,0,0</Thickness>
<Thickness x:Key="ScrollBarVerticalIncreaseMargin">0,0,0,4</Thickness>

<Style TargetType="ScrollBar" BasedOn="{StaticResource DefaultScrollBarStyle}" />

<Style x:Key="DefaultScrollBarStyle" TargetType="ScrollBar">
Expand All @@ -232,7 +237,7 @@
</Grid>
</ControlTemplate>
<ControlTemplate x:Key="HorizontalIncrementTemplate" TargetType="RepeatButton">
<Grid x:Name="Root" Background="{ThemeResource ScrollBarButtonBackground}" BorderBrush="{ThemeResource ScrollBarButtonBorderBrush}">
<Grid x:Name="Root" Background="{ThemeResource ScrollBarButtonBackground}" BorderBrush="{ThemeResource ScrollBarButtonBorderBrush}" Padding="{ThemeResource ScrollBarHorizontalIncreaseMargin}">
<VisualStateManager.VisualStateGroups>
<VisualStateGroup x:Name="CommonStates">
<VisualState x:Name="Normal" />
Expand Down Expand Up @@ -263,7 +268,7 @@
</Grid>
</ControlTemplate>
<ControlTemplate x:Key="HorizontalDecrementTemplate" TargetType="RepeatButton">
<Grid x:Name="Root" Background="{ThemeResource ScrollBarButtonBackground}" BorderBrush="{ThemeResource ScrollBarButtonBorderBrush}">
<Grid x:Name="Root" Background="{ThemeResource ScrollBarButtonBackground}" BorderBrush="{ThemeResource ScrollBarButtonBorderBrush}" Padding="{ThemeResource ScrollBarHorizontalDecreaseMargin}">
<VisualStateManager.VisualStateGroups>
<VisualStateGroup x:Name="CommonStates">
<VisualState x:Name="Normal" />
Expand Down Expand Up @@ -294,7 +299,7 @@
</Grid>
</ControlTemplate>
<ControlTemplate x:Key="VerticalIncrementTemplate" TargetType="RepeatButton">
<Grid x:Name="Root" Background="{ThemeResource ScrollBarButtonBackground}" BorderBrush="{ThemeResource ScrollBarButtonBorderBrush}">
<Grid x:Name="Root" Background="{ThemeResource ScrollBarButtonBackground}" BorderBrush="{ThemeResource ScrollBarButtonBorderBrush}" Padding="{ThemeResource ScrollBarVerticalIncreaseMargin}">
<VisualStateManager.VisualStateGroups>
<VisualStateGroup x:Name="CommonStates">
<VisualState x:Name="Normal" />
Expand Down Expand Up @@ -325,7 +330,7 @@
</Grid>
</ControlTemplate>
<ControlTemplate x:Key="VerticalDecrementTemplate" TargetType="RepeatButton">
<Grid x:Name="Root" Background="{ThemeResource ScrollBarButtonBackground}" BorderBrush="{ThemeResource ScrollBarButtonBorderBrush}">
<Grid x:Name="Root" Background="{ThemeResource ScrollBarButtonBackground}" BorderBrush="{ThemeResource ScrollBarButtonBorderBrush}" Padding="{ThemeResource ScrollBarVerticalDecreaseMargin}">
<VisualStateManager.VisualStateGroups>
<VisualStateGroup x:Name="CommonStates">
<VisualState x:Name="Normal" />
Expand Down Expand Up @@ -681,7 +686,7 @@
contract7NotPresent:RadiusX="{Binding Source={ThemeResource ScrollBarCornerRadius}, Converter={StaticResource TopLeftCornerRadiusDoubleValueConverter2x}}"
contract7NotPresent:RadiusY="{Binding Source={ThemeResource ScrollBarCornerRadius}, Converter={StaticResource BottomRightCornerRadiusDoubleValueConverter2x}}"
Opacity="0" Grid.ColumnSpan="5" Margin="0" StrokeThickness="{ThemeResource ScrollBarTrackBorderThemeThickness}" Fill="{ThemeResource ScrollBarTrackFill}" Stroke="{ThemeResource ScrollBarTrackStroke}" />
<RepeatButton x:Name="HorizontalSmallDecrease" Opacity="0" Grid.Column="0" MinHeight="{StaticResource ScrollBarSize}" IsTabStop="False" Interval="50" Margin="0" Template="{StaticResource HorizontalDecrementTemplate}" Width="{StaticResource ScrollBarSize}" AllowFocusOnInteraction="False" VerticalAlignment="Center" />
<RepeatButton x:Name="HorizontalSmallDecrease" Grid.Column="0" Opacity="0" MinHeight="{StaticResource ScrollBarSize}" IsTabStop="False" Interval="50" Padding="{ThemeResource ScrollBarHorizontalDecreaseMargin}" Template="{StaticResource HorizontalDecrementTemplate}" Width="{StaticResource ScrollBarSize}" AllowFocusOnInteraction="False" VerticalAlignment="Center" />
<RepeatButton x:Name="HorizontalLargeDecrease" Opacity="0" Grid.Column="1" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" IsTabStop="False" Interval="50" Template="{StaticResource RepeatButtonTemplate}" Width="0" AllowFocusOnInteraction="False" />
<Thumb x:Name="HorizontalThumb"
Opacity="0"
Expand All @@ -700,7 +705,7 @@
</Thumb>

<RepeatButton x:Name="HorizontalLargeIncrease" Opacity="0" Grid.Column="3" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" IsTabStop="False" Interval="50" AllowFocusOnInteraction="False" Template="{StaticResource RepeatButtonTemplate}" />
<RepeatButton x:Name="HorizontalSmallIncrease" Opacity="0" Grid.Column="4" MinHeight="{StaticResource ScrollBarSize}" IsTabStop="False" Interval="50" Margin="0" Template="{StaticResource HorizontalIncrementTemplate}" Width="{StaticResource ScrollBarSize}" AllowFocusOnInteraction="False" VerticalAlignment="Center" />
<RepeatButton x:Name="HorizontalSmallIncrease" Grid.Column="4" Opacity="0" MinHeight="{StaticResource ScrollBarSize}" IsTabStop="False" Interval="50" Padding="{ThemeResource ScrollBarHorizontalIncreaseMargin}" Template="{StaticResource HorizontalIncrementTemplate}" Width="{StaticResource ScrollBarSize}" AllowFocusOnInteraction="False" VerticalAlignment="Center" />
</Grid>
<Grid x:Name="HorizontalPanningRoot" MinWidth="24" Visibility="Collapsed" Opacity="0" contract7Present:CornerRadius="{TemplateBinding CornerRadius}">
<Border x:Name="HorizontalPanningThumb" VerticalAlignment="Bottom" HorizontalAlignment="Left" Background="{ThemeResource ScrollBarPanningThumbBackground}" BorderThickness="0" Height="2" MinWidth="32" Margin="0,2,0,2"/>
Expand All @@ -720,7 +725,7 @@
contract7NotPresent:RadiusX="{Binding Source={ThemeResource ScrollBarCornerRadius}, Converter={StaticResource TopLeftCornerRadiusDoubleValueConverter2x}}"
contract7NotPresent:RadiusY="{Binding Source={ThemeResource ScrollBarCornerRadius}, Converter={StaticResource BottomRightCornerRadiusDoubleValueConverter2x}}"
Opacity="0" Grid.RowSpan="5" Margin="0" StrokeThickness="{ThemeResource ScrollBarTrackBorderThemeThickness}" Fill="{ThemeResource ScrollBarTrackFill}" Stroke="{ThemeResource ScrollBarTrackStroke}" />
<RepeatButton x:Name="VerticalSmallDecrease" Opacity="0" Height="{StaticResource ScrollBarSize}" MinWidth="{StaticResource ScrollBarSize}" IsTabStop="False" Interval="50" Margin="0" Grid.Row="0" Template="{StaticResource VerticalDecrementTemplate}" HorizontalAlignment="Center" />
<RepeatButton x:Name="VerticalSmallDecrease" Grid.Row="0" Opacity="0" Height="{StaticResource ScrollBarSize}" MinWidth="{StaticResource ScrollBarSize}" IsTabStop="False" Interval="50" Padding="{ThemeResource ScrollBarVerticalDecreaseMargin}" Template="{StaticResource VerticalDecrementTemplate}" HorizontalAlignment="Center" />
<RepeatButton x:Name="VerticalLargeDecrease" Opacity="0" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Height="0" IsTabStop="False" Interval="50" Grid.Row="1" AllowFocusOnInteraction="False" Template="{StaticResource RepeatButtonTemplate}" />
<Thumb x:Name="VerticalThumb"
Opacity="0"
Expand All @@ -739,7 +744,7 @@
</Thumb>

<RepeatButton x:Name="VerticalLargeIncrease" Opacity="0" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" IsTabStop="False" Interval="50" Grid.Row="3" AllowFocusOnInteraction="False" Template="{StaticResource RepeatButtonTemplate}" />
<RepeatButton x:Name="VerticalSmallIncrease" Opacity="0" Height="{StaticResource ScrollBarSize}" MinWidth="{StaticResource ScrollBarSize}" IsTabStop="False" Interval="50" Margin="0" Grid.Row="4" Template="{StaticResource VerticalIncrementTemplate}" HorizontalAlignment="Center" />
<RepeatButton x:Name="VerticalSmallIncrease" Grid.Row="4" Opacity="0" Height="{StaticResource ScrollBarSize}" MinWidth="{StaticResource ScrollBarSize}" IsTabStop="False" Interval="50" Padding="{ThemeResource ScrollBarVerticalIncreaseMargin}" Template="{StaticResource VerticalIncrementTemplate}" HorizontalAlignment="Center" />
</Grid>
<Grid x:Name="VerticalPanningRoot" MinHeight="24" Visibility="Collapsed" Opacity="0" contract7Present:CornerRadius="{TemplateBinding CornerRadius}">
<Border x:Name="VerticalPanningThumb" VerticalAlignment="Top" HorizontalAlignment="Right" Background="{ThemeResource ScrollBarPanningThumbBackground}" BorderThickness="0" Width="2" MinHeight="32" Margin="2,0,2,0" />
Expand Down
12 changes: 6 additions & 6 deletions test/MUXControlsTestApp/verification/NavigationViewAuto-4.xml
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -1507,7 +1507,7 @@
Visibility=Visible
RenderSize=0,0
[Windows.UI.Xaml.Controls.Primitives.RepeatButton]
Padding=11,5,11,5
Padding=4,0,0,0
Foreground=#E4000000
BorderThickness=1,1,1,1
BorderBrush=Windows.UI.Xaml.Media.LinearGradientBrush
Expand Down Expand Up @@ -1568,7 +1568,7 @@
Visibility=Visible
RenderSize=0,0
[Windows.UI.Xaml.Controls.Primitives.RepeatButton]
Padding=11,5,11,5
Padding=0,0,4,0
Foreground=#E4000000
BorderThickness=1,1,1,1
BorderBrush=Windows.UI.Xaml.Media.LinearGradientBrush
Expand Down Expand Up @@ -1639,7 +1639,7 @@
Visibility=Visible
RenderSize=0,0
[Windows.UI.Xaml.Controls.Primitives.RepeatButton]
Padding=11,5,11,5
Padding=0,4,0,0
Foreground=#E4000000
BorderThickness=1,1,1,1
BorderBrush=Windows.UI.Xaml.Media.LinearGradientBrush
Expand All @@ -1655,7 +1655,7 @@
Visibility=Visible
RenderSize=0,0
[Windows.UI.Xaml.Controls.Grid]
Padding=0,0,0,0
Padding=0,4,0,0
CornerRadius=0,0,0,0
BorderThickness=0,0,0,0
BorderBrush=#00FFFFFF
Expand Down Expand Up @@ -1775,7 +1775,7 @@
Visibility=Visible
RenderSize=0,0
[Windows.UI.Xaml.Controls.Primitives.RepeatButton]
Padding=11,5,11,5
Padding=0,0,0,4
Foreground=#E4000000
BorderThickness=1,1,1,1
BorderBrush=Windows.UI.Xaml.Media.LinearGradientBrush
Expand All @@ -1791,7 +1791,7 @@
Visibility=Visible
RenderSize=0,0
[Windows.UI.Xaml.Controls.Grid]
Padding=0,0,0,0
Padding=0,0,0,4
RBrid marked this conversation as resolved.
Show resolved Hide resolved
CornerRadius=0,0,0,0
BorderThickness=0,0,0,0
BorderBrush=#00FFFFFF
Expand Down
12 changes: 6 additions & 6 deletions test/MUXControlsTestApp/verification/NavigationViewAuto-5.xml
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -1507,7 +1507,7 @@
Visibility=Visible
RenderSize=0,0
[Windows.UI.Xaml.Controls.Primitives.RepeatButton]
Padding=11,5,11,5
Padding=4,0,0,0
Foreground=#E4000000
BorderThickness=1,1,1,1
BorderBrush=Windows.UI.Xaml.Media.LinearGradientBrush
Expand Down Expand Up @@ -1568,7 +1568,7 @@
Visibility=Visible
RenderSize=0,0
[Windows.UI.Xaml.Controls.Primitives.RepeatButton]
Padding=11,5,11,5
Padding=0,0,4,0
Foreground=#E4000000
BorderThickness=1,1,1,1
BorderBrush=Windows.UI.Xaml.Media.LinearGradientBrush
Expand Down Expand Up @@ -1639,7 +1639,7 @@
Visibility=Visible
RenderSize=0,0
[Windows.UI.Xaml.Controls.Primitives.RepeatButton]
Padding=11,5,11,5
Padding=0,4,0,0
RBrid marked this conversation as resolved.
Show resolved Hide resolved
Foreground=#E4000000
BorderThickness=1,1,1,1
BorderBrush=Windows.UI.Xaml.Media.LinearGradientBrush
Expand All @@ -1655,7 +1655,7 @@
Visibility=Visible
RenderSize=0,0
[Windows.UI.Xaml.Controls.Grid]
Padding=0,0,0,0
Padding=0,4,0,0
CornerRadius=0,0,0,0
BorderThickness=0,0,0,0
BorderBrush=#00FFFFFF
Expand Down Expand Up @@ -1775,7 +1775,7 @@
Visibility=Visible
RenderSize=0,0
[Windows.UI.Xaml.Controls.Primitives.RepeatButton]
Padding=11,5,11,5
Padding=0,0,0,4
Foreground=#E4000000
BorderThickness=1,1,1,1
BorderBrush=Windows.UI.Xaml.Media.LinearGradientBrush
Expand All @@ -1791,7 +1791,7 @@
Visibility=Visible
RenderSize=0,0
[Windows.UI.Xaml.Controls.Grid]
Padding=0,0,0,0
Padding=0,0,0,4
CornerRadius=0,0,0,0
BorderThickness=0,0,0,0
BorderBrush=#00FFFFFF
Expand Down
12 changes: 6 additions & 6 deletions test/MUXControlsTestApp/verification/NavigationViewAuto-6.xml
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -1507,7 +1507,7 @@
Visibility=Visible
RenderSize=0,0
[Windows.UI.Xaml.Controls.Primitives.RepeatButton]
Padding=11,5,11,5
Padding=4,0,0,0
Foreground=#E4000000
BorderThickness=1,1,1,1
BorderBrush=Windows.UI.Xaml.Media.LinearGradientBrush
Expand Down Expand Up @@ -1568,7 +1568,7 @@
Visibility=Visible
RenderSize=0,0
[Windows.UI.Xaml.Controls.Primitives.RepeatButton]
Padding=11,5,11,5
Padding=0,0,4,0
Foreground=#E4000000
BorderThickness=1,1,1,1
BorderBrush=Windows.UI.Xaml.Media.LinearGradientBrush
Expand Down Expand Up @@ -1639,7 +1639,7 @@
Visibility=Visible
RenderSize=0,0
[Windows.UI.Xaml.Controls.Primitives.RepeatButton]
Padding=11,5,11,5
Padding=0,4,0,0
Foreground=#E4000000
BorderThickness=1,1,1,1
BorderBrush=Windows.UI.Xaml.Media.LinearGradientBrush
Expand All @@ -1655,7 +1655,7 @@
Visibility=Visible
RenderSize=0,0
[Windows.UI.Xaml.Controls.Grid]
Padding=0,0,0,0
Padding=0,4,0,0
CornerRadius=0,0,0,0
BorderThickness=0,0,0,0
BorderBrush=#00FFFFFF
Expand Down Expand Up @@ -1775,7 +1775,7 @@
Visibility=Visible
RenderSize=0,0
[Windows.UI.Xaml.Controls.Primitives.RepeatButton]
Padding=11,5,11,5
Padding=0,0,0,4
Foreground=#E4000000
BorderThickness=1,1,1,1
BorderBrush=Windows.UI.Xaml.Media.LinearGradientBrush
Expand All @@ -1791,7 +1791,7 @@
Visibility=Visible
RenderSize=0,0
[Windows.UI.Xaml.Controls.Grid]
Padding=0,0,0,0
Padding=0,0,0,4
CornerRadius=0,0,0,0
BorderThickness=0,0,0,0
BorderBrush=#00FFFFFF
Expand Down
Loading