feat: update ScrollBar visual styles.
This commit is contained in:
rabbitism
parent
8bdfe2b7de
commit
14c2ff6c02
@ -21,6 +21,22 @@
|
||||
<dialog:ManagedFileChooser />
|
||||
</StackPanel>
|
||||
</Design.PreviewWith>
|
||||
<ControlTheme x:Key="ScrollBarRepeatButton" TargetType="{x:Type RepeatButton}">
|
||||
<Setter Property="Background" Value="Transparent" />
|
||||
<Setter Property="Foreground" Value="Gray" />
|
||||
<Setter Property="Template">
|
||||
<ControlTemplate>
|
||||
<Border Padding="{TemplateBinding Padding}" Background="{TemplateBinding Background}">
|
||||
<ContentPresenter
|
||||
HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
|
||||
VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
|
||||
Content="{TemplateBinding Content}"
|
||||
Foreground="{TemplateBinding Foreground}" />
|
||||
</Border>
|
||||
</ControlTemplate>
|
||||
</Setter>
|
||||
</ControlTheme>
|
||||
|
||||
<ControlTheme x:Key="{x:Type ScrollBar}" TargetType="ScrollBar">
|
||||
<Setter Property="Cursor" Value="Arrow" />
|
||||
<Style Selector="^:horizontal">
|
||||
@ -34,11 +50,14 @@
|
||||
Grid.Row="0"
|
||||
Grid.Column="0"
|
||||
MinWidth="{DynamicResource ScrollBarThickness}"
|
||||
Padding="4,0"
|
||||
VerticalAlignment="Center"
|
||||
Classes="repeat"
|
||||
CornerRadius="0"
|
||||
Focusable="False">
|
||||
<Path Data="M 4 0 L 4 8 L 0 4 Z" />
|
||||
Focusable="False"
|
||||
Theme="{DynamicResource ScrollBarRepeatButton}">
|
||||
<PathIcon
|
||||
Width="10"
|
||||
Height="10"
|
||||
Data="{DynamicResource ScrollBarLeftGlyph}" />
|
||||
</RepeatButton>
|
||||
<Track
|
||||
Grid.Column="1"
|
||||
@ -54,9 +73,9 @@
|
||||
MinWidth="0"
|
||||
HorizontalAlignment="Stretch"
|
||||
VerticalAlignment="Stretch"
|
||||
Classes="repeattrack"
|
||||
CornerRadius="0"
|
||||
Focusable="False" />
|
||||
Focusable="False"
|
||||
Theme="{DynamicResource ScrollBarRepeatButton}" />
|
||||
</Track.DecreaseButton>
|
||||
<Track.IncreaseButton>
|
||||
<RepeatButton
|
||||
@ -64,9 +83,9 @@
|
||||
MinWidth="0"
|
||||
HorizontalAlignment="Stretch"
|
||||
VerticalAlignment="Stretch"
|
||||
Classes="repeattrack"
|
||||
CornerRadius="0"
|
||||
Focusable="False" />
|
||||
Focusable="False"
|
||||
Theme="{DynamicResource ScrollBarRepeatButton}" />
|
||||
</Track.IncreaseButton>
|
||||
<Thumb Name="thumb" />
|
||||
</Track>
|
||||
@ -74,11 +93,15 @@
|
||||
Name="PART_LineDownButton"
|
||||
Grid.Column="2"
|
||||
MinWidth="{DynamicResource ScrollBarThickness}"
|
||||
Padding="4,0"
|
||||
VerticalAlignment="Center"
|
||||
Classes="repeat"
|
||||
CornerRadius="0"
|
||||
Focusable="False">
|
||||
<Path Data="M 0 0 L 4 4 L 0 8 Z" />
|
||||
VerticalContentAlignment="Center"
|
||||
Focusable="False"
|
||||
Theme="{DynamicResource ScrollBarRepeatButton}">
|
||||
<PathIcon
|
||||
Width="10"
|
||||
Height="10"
|
||||
Data="{DynamicResource ScrollBarRightGlyph}" />
|
||||
</RepeatButton>
|
||||
</Grid>
|
||||
</Border>
|
||||
@ -95,11 +118,16 @@
|
||||
Name="PART_LineUpButton"
|
||||
Grid.Row="0"
|
||||
MinHeight="{DynamicResource ScrollBarThickness}"
|
||||
HorizontalAlignment="Center"
|
||||
Classes="repeat"
|
||||
CornerRadius="0"
|
||||
Focusable="False">
|
||||
<Path Data="M 0 4 L 8 4 L 4 0 Z" />
|
||||
Padding="0,4"
|
||||
VerticalAlignment="Center"
|
||||
HorizontalContentAlignment="Center"
|
||||
VerticalContentAlignment="Center"
|
||||
Focusable="False"
|
||||
Theme="{DynamicResource ScrollBarRepeatButton}">
|
||||
<PathIcon
|
||||
Width="10"
|
||||
Height="10"
|
||||
Data="{DynamicResource ScrollBarUpGlyph}" />
|
||||
</RepeatButton>
|
||||
<Track
|
||||
Grid.Row="1"
|
||||
@ -116,9 +144,9 @@
|
||||
MinHeight="0"
|
||||
HorizontalAlignment="Stretch"
|
||||
VerticalAlignment="Stretch"
|
||||
Classes="repeattrack"
|
||||
CornerRadius="0"
|
||||
Focusable="False" />
|
||||
Focusable="False"
|
||||
Theme="{DynamicResource ScrollBarRepeatButton}" />
|
||||
</Track.DecreaseButton>
|
||||
<Track.IncreaseButton>
|
||||
<RepeatButton
|
||||
@ -126,9 +154,9 @@
|
||||
MinHeight="0"
|
||||
HorizontalAlignment="Stretch"
|
||||
VerticalAlignment="Stretch"
|
||||
Classes="repeattrack"
|
||||
CornerRadius="0"
|
||||
Focusable="False" />
|
||||
Focusable="False"
|
||||
Theme="{DynamicResource ScrollBarRepeatButton}" />
|
||||
</Track.IncreaseButton>
|
||||
<Thumb Name="thumb" />
|
||||
</Track>
|
||||
@ -136,11 +164,15 @@
|
||||
Name="PART_LineDownButton"
|
||||
Grid.Row="2"
|
||||
MinHeight="{DynamicResource ScrollBarThickness}"
|
||||
HorizontalAlignment="Center"
|
||||
Classes="repeat"
|
||||
CornerRadius="0"
|
||||
Focusable="False">
|
||||
<Path Data="M 0 0 L 4 4 L 8 0 Z" />
|
||||
Padding="0,4"
|
||||
HorizontalContentAlignment="Center"
|
||||
VerticalContentAlignment="Center"
|
||||
Focusable="False"
|
||||
Theme="{DynamicResource ScrollBarRepeatButton}">
|
||||
<PathIcon
|
||||
Width="10"
|
||||
Height="10"
|
||||
Data="{DynamicResource ScrollBarDownGlyph}" />
|
||||
</RepeatButton>
|
||||
</Grid>
|
||||
</Border>
|
||||
@ -174,30 +206,11 @@
|
||||
<Setter Property="MinHeight" Value="{DynamicResource ScrollBarThickness}" />
|
||||
<Setter Property="Width" Value="{DynamicResource ScrollBarThumbThickness}" />
|
||||
</Style>
|
||||
<Style Selector="^ /template/ RepeatButton.repeat">
|
||||
<Setter Property="Padding" Value="2" />
|
||||
<Setter Property="BorderThickness" Value="0" />
|
||||
<Style Selector="^ /template/ RepeatButton > PathIcon">
|
||||
<Setter Property="Foreground" Value="{DynamicResource ScrollBarButtonDefaultForeground}" />
|
||||
</Style>
|
||||
<Style Selector="^ /template/ RepeatButton.repeattrack">
|
||||
<Setter Property="Background" Value="Transparent" />
|
||||
<Setter Property="Template">
|
||||
<ControlTemplate TargetType="RepeatButton">
|
||||
<Border Background="{TemplateBinding Background}" />
|
||||
</ControlTemplate>
|
||||
</Setter>
|
||||
<Style Selector="^:pointerover">
|
||||
<Setter Property="Background" Value="{DynamicResource ButtonDefaultPointeroverBackground}" />
|
||||
</Style>
|
||||
<Style Selector="^:pressed">
|
||||
<Setter Property="Background" Value="{DynamicResource ButtonDefaultPressedBackground}" />
|
||||
</Style>
|
||||
</Style>
|
||||
|
||||
<Style Selector="^ /template/ RepeatButton > Path">
|
||||
<Setter Property="Fill" Value="{DynamicResource ScrollBarButtonDefaultForeground}" />
|
||||
</Style>
|
||||
<Style Selector="^ /template/ RepeatButton:pointerover > Path">
|
||||
<Setter Property="Fill" Value="{DynamicResource ScrollBarButtonPointeroverForeground}" />
|
||||
<Style Selector="^ /template/ RepeatButton:pointerover > PathIcon">
|
||||
<Setter Property="Foreground" Value="{DynamicResource ScrollBarButtonPointeroverForeground}" />
|
||||
</Style>
|
||||
|
||||
</ControlTheme>
|
||||
|
||||
@ -2,11 +2,16 @@
|
||||
xmlns="https://github.com/avaloniaui"
|
||||
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
|
||||
xmlns:sys="clr-namespace:System;assembly=System.Runtime">
|
||||
<sys:Double x:Key="ScrollBarThickness">12</sys:Double>
|
||||
<sys:Double x:Key="ScrollBarThumbThickness">8</sys:Double>
|
||||
<sys:Double x:Key="ScrollBarThickness">14</sys:Double>
|
||||
<sys:Double x:Key="ScrollBarThumbThickness">10</sys:Double>
|
||||
<SolidColorBrush x:Key="ScrollBarButtonDefaultBackground" Color="Transparent" />
|
||||
<SolidColorBrush x:Key="ScrollBarButtonDefaultForeground" Opacity="0.62" Color="#F9F9F9" />
|
||||
<SolidColorBrush x:Key="ScrollBarButtonPointeroverForeground" Color="#F9F9F9" />
|
||||
<SolidColorBrush x:Key="ScrollBarThumbForeground" Opacity="0.35" Color="#F9F9F9" />
|
||||
<SolidColorBrush x:Key="ScrollBarBackground" Opacity="0.12" Color="White" />
|
||||
<SolidColorBrush x:Key="ScrollBarThumbForeground" Opacity="0.62" Color="#F9F9F9" />
|
||||
<SolidColorBrush x:Key="ScrollBarBackground" Color="Transparent" />
|
||||
<PathGeometry x:Key="ScrollBarLeftGlyph">M16.3176 6.95628V17.0878C16.3176 17.4871 15.8725 17.7253 15.5402 17.5038L7.94161 12.438C7.64474 12.2401 7.64474 11.8039 7.94161 11.606L15.5402 6.54025C15.8725 6.31873 16.3176 6.55693 16.3176 6.95628Z</PathGeometry>
|
||||
<PathGeometry x:Key="ScrollBarRightGlyph">M9 17.0657V6.93425C9 6.5349 9.44507 6.29671 9.77735 6.51823L17.376 11.584C17.6728 11.7819 17.6728 12.2181 17.376 12.416L9.77735 17.4818C9.44507 17.7033 9 17.4651 9 17.0657Z</PathGeometry>
|
||||
<PathGeometry x:Key="ScrollBarUpGlyph">M17.0839 16.3212H6.9524C6.55305 16.3212 6.31486 15.8761 6.53638 15.5438L11.6021 7.94521C11.8 7.64834 12.2363 7.64834 12.4342 7.94521L17.4999 15.5438C17.7214 15.8761 17.4832 16.3212 17.0839 16.3212Z</PathGeometry>
|
||||
<PathGeometry x:Key="ScrollBarDownGlyph">M6.95249 7.72265L17.084 7.72265C17.4833 7.72265 17.7215 8.16772 17.5 8.5L12.4343 16.0986C12.2363 16.3955 11.8001 16.3955 11.6022 16.0986L6.53647 8.5C6.31495 8.16772 6.55315 7.72265 6.95249 7.72265Z</PathGeometry>
|
||||
|
||||
</ResourceDictionary>
|
||||
|
||||
@ -2,11 +2,15 @@
|
||||
xmlns="https://github.com/avaloniaui"
|
||||
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
|
||||
xmlns:sys="clr-namespace:System;assembly=System.Runtime">
|
||||
<sys:Double x:Key="ScrollBarThickness">12</sys:Double>
|
||||
<sys:Double x:Key="ScrollBarThumbThickness">8</sys:Double>
|
||||
<sys:Double x:Key="ScrollBarThickness">14</sys:Double>
|
||||
<sys:Double x:Key="ScrollBarThumbThickness">10</sys:Double>
|
||||
<SolidColorBrush x:Key="ScrollBarButtonDefaultBackground" Color="Transparent" />
|
||||
<SolidColorBrush x:Key="ScrollBarButtonDefaultForeground" Opacity="0.62" Color="#1C1F23" />
|
||||
<SolidColorBrush x:Key="ScrollBarButtonPointeroverForeground" Color="#1C1F23" />
|
||||
<SolidColorBrush x:Key="ScrollBarThumbForeground" Opacity="0.35" Color="#1C1F23" />
|
||||
<SolidColorBrush x:Key="ScrollBarBackground" Opacity="0.05" Color="#2E3238" />
|
||||
<SolidColorBrush x:Key="ScrollBarThumbForeground" Opacity="0.62" Color="#1C1F23" />
|
||||
<SolidColorBrush x:Key="ScrollBarBackground" Color="Transparent" />
|
||||
<PathGeometry x:Key="ScrollBarLeftGlyph">M16.3176 6.95628V17.0878C16.3176 17.4871 15.8725 17.7253 15.5402 17.5038L7.94161 12.438C7.64474 12.2401 7.64474 11.8039 7.94161 11.606L15.5402 6.54025C15.8725 6.31873 16.3176 6.55693 16.3176 6.95628Z</PathGeometry>
|
||||
<PathGeometry x:Key="ScrollBarRightGlyph">M9 17.0657V6.93425C9 6.5349 9.44507 6.29671 9.77735 6.51823L17.376 11.584C17.6728 11.7819 17.6728 12.2181 17.376 12.416L9.77735 17.4818C9.44507 17.7033 9 17.4651 9 17.0657Z</PathGeometry>
|
||||
<PathGeometry x:Key="ScrollBarUpGlyph">M17.0839 16.3212H6.9524C6.55305 16.3212 6.31486 15.8761 6.53638 15.5438L11.6021 7.94521C11.8 7.64834 12.2363 7.64834 12.4342 7.94521L17.4999 15.5438C17.7214 15.8761 17.4832 16.3212 17.0839 16.3212Z</PathGeometry>
|
||||
<PathGeometry x:Key="ScrollBarDownGlyph">M6.95249 7.72265L17.084 7.72265C17.4833 7.72265 17.7215 8.16772 17.5 8.5L12.4343 16.0986C12.2363 16.3955 11.8001 16.3955 11.6022 16.0986L6.53647 8.5C6.31495 8.16772 6.55315 7.72265 6.95249 7.72265Z</PathGeometry>
|
||||
</ResourceDictionary>
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user