style<Slider>: customize slider style

This commit is contained in:
leo 2023-08-25 17:08:50 +08:00
parent ef894d81b4
commit 5c411f6258
3 changed files with 131 additions and 6 deletions

View file

@ -13,6 +13,7 @@
<ResourceDictionary Source="pack://application:,,,/Resources/Styles/RadioButton.xaml"/> <ResourceDictionary Source="pack://application:,,,/Resources/Styles/RadioButton.xaml"/>
<ResourceDictionary Source="pack://application:,,,/Resources/Styles/ScrollBar.xaml"/> <ResourceDictionary Source="pack://application:,,,/Resources/Styles/ScrollBar.xaml"/>
<ResourceDictionary Source="pack://application:,,,/Resources/Styles/ScrollViewer.xaml"/> <ResourceDictionary Source="pack://application:,,,/Resources/Styles/ScrollViewer.xaml"/>
<ResourceDictionary Source="pack://application:,,,/Resources/Styles/Slider.xaml"/>
<ResourceDictionary Source="pack://application:,,,/Resources/Styles/TabControl.xaml"/> <ResourceDictionary Source="pack://application:,,,/Resources/Styles/TabControl.xaml"/>
<ResourceDictionary Source="pack://application:,,,/Resources/Styles/TextBlock.xaml"/> <ResourceDictionary Source="pack://application:,,,/Resources/Styles/TextBlock.xaml"/>
<ResourceDictionary Source="pack://application:,,,/Resources/Styles/TextBox.xaml"/> <ResourceDictionary Source="pack://application:,,,/Resources/Styles/TextBox.xaml"/>

View file

@ -0,0 +1,125 @@
<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
<Style x:Key="Style.Slider.RepeatButton" TargetType="{x:Type RepeatButton}">
<Setter Property="SnapsToDevicePixels" Value="true" />
<Setter Property="OverridesDefaultStyle" Value="true" />
<Setter Property="IsTabStop" Value="false" />
<Setter Property="Focusable" Value="false" />
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type RepeatButton}">
<Border Background="Transparent">
<Border Background="{TemplateBinding Background}" Height="2"/>
</Border>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
<Style x:Key="Style.Slider.Thumb" TargetType="{x:Type Thumb}">
<Setter Property="SnapsToDevicePixels" Value="true" />
<Setter Property="OverridesDefaultStyle" Value="true" />
<Setter Property="Height" Value="12" />
<Setter Property="Width" Value="12" />
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type Thumb}">
<Ellipse x:Name="Ellipse" StrokeThickness="1" Fill="{DynamicResource Brush.Accent1}"/>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
<ControlTemplate x:Key="Slider.Horizontal" TargetType="{x:Type Slider}">
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" MinHeight="{TemplateBinding MinHeight}" />
<RowDefinition Height="Auto" />
</Grid.RowDefinitions>
<TickBar Grid.Row="0" x:Name="TopTick" SnapsToDevicePixels="True" Fill="{DynamicResource Brush.FG2}" Placement="Top" Height="4" Visibility="Collapsed"/>
<Track Grid.Row="1" x:Name="PART_Track">
<Track.DecreaseRepeatButton>
<RepeatButton Style="{StaticResource Style.Slider.RepeatButton}" Command="Slider.DecreaseLarge" Background="{DynamicResource Brush.Accent1}"/>
</Track.DecreaseRepeatButton>
<Track.Thumb>
<Thumb Style="{StaticResource Style.Slider.Thumb}" />
</Track.Thumb>
<Track.IncreaseRepeatButton>
<RepeatButton Style="{StaticResource Style.Slider.RepeatButton}" Command="Slider.IncreaseLarge" Background="Gray" />
</Track.IncreaseRepeatButton>
</Track>
<TickBar Grid.Row="2" x:Name="BottomTick" SnapsToDevicePixels="True" Fill="{DynamicResource Brush.FG2}" Placement="Bottom" Height="4" Visibility="Collapsed" />
</Grid>
<ControlTemplate.Triggers>
<Trigger Property="TickPlacement" Value="TopLeft">
<Setter TargetName="TopTick" Property="Visibility" Value="Visible" />
</Trigger>
<Trigger Property="TickPlacement" Value="BottomRight">
<Setter TargetName="BottomTick" Property="Visibility" Value="Visible" />
</Trigger>
<Trigger Property="TickPlacement" Value="Both">
<Setter TargetName="TopTick" Property="Visibility" Value="Visible" />
<Setter TargetName="BottomTick" Property="Visibility" Value="Visible" />
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
<ControlTemplate x:Key="Slider.Vertical" TargetType="{x:Type Slider}">
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto" />
<ColumnDefinition Width="Auto" MinWidth="{TemplateBinding MinWidth}" />
<ColumnDefinition Width="Auto" />
</Grid.ColumnDefinitions>
<TickBar Grid.Column="0" x:Name="TopTick" SnapsToDevicePixels="True" Fill="{DynamicResource Brush.FG2}" Placement="Left" Width="4" Visibility="Collapsed"/>
<Track Grid.Column="1" x:Name="PART_Track">
<Track.DecreaseRepeatButton>
<RepeatButton Style="{StaticResource Style.Slider.RepeatButton}" Command="Slider.DecreaseLarge" Background="{DynamicResource Brush.Accent1}"/>
</Track.DecreaseRepeatButton>
<Track.Thumb>
<Thumb Style="{StaticResource Style.Slider.Thumb}" />
</Track.Thumb>
<Track.IncreaseRepeatButton>
<RepeatButton Style="{StaticResource Style.Slider.RepeatButton}" Command="Slider.IncreaseLarge" Background="Gray" />
</Track.IncreaseRepeatButton>
</Track>
<TickBar Grid.Column="2" x:Name="BottomTick" SnapsToDevicePixels="True" Fill="{DynamicResource Brush.FG2}" Placement="Right" Width="4" Visibility="Collapsed" />
</Grid>
<ControlTemplate.Triggers>
<Trigger Property="TickPlacement" Value="TopLeft">
<Setter TargetName="TopTick" Property="Visibility" Value="Visible" />
</Trigger>
<Trigger Property="TickPlacement" Value="BottomRight">
<Setter TargetName="BottomTick" Property="Visibility" Value="Visible" />
</Trigger>
<Trigger Property="TickPlacement" Value="Both">
<Setter TargetName="TopTick" Property="Visibility" Value="Visible" />
<Setter TargetName="BottomTick" Property="Visibility" Value="Visible" />
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
<Style TargetType="{x:Type Slider}">
<Setter Property="SnapsToDevicePixels" Value="true" />
<Setter Property="OverridesDefaultStyle" Value="true" />
<Style.Triggers>
<Trigger Property="Orientation" Value="Horizontal">
<Setter Property="MinWidth" Value="104" />
<Setter Property="MinHeight" Value="21" />
<Setter Property="Template" Value="{StaticResource Slider.Horizontal}" />
</Trigger>
<Trigger Property="Orientation" Value="Vertical">
<Setter Property="MinWidth" Value="21" />
<Setter Property="MinHeight" Value="104" />
<Setter Property="Template" Value="{StaticResource Slider.Vertical}" />
</Trigger>
</Style.Triggers>
</Style>
</ResourceDictionary>

View file

@ -140,8 +140,7 @@
<Grid Grid.Row="3" Grid.Column="1"> <Grid Grid.Row="3" Grid.Column="1">
<Grid.ColumnDefinitions> <Grid.ColumnDefinitions>
<ColumnDefinition Width="*"/> <ColumnDefinition Width="*"/>
<ColumnDefinition Width="4"/> <ColumnDefinition Width="48"/>
<ColumnDefinition Width="56"/>
</Grid.ColumnDefinitions> </Grid.ColumnDefinitions>
<Slider <Slider
@ -152,10 +151,10 @@
Value="{Binding Source={x:Static models:Preference.Instance}, Path=General.MaxHistoryCommits, Mode=TwoWay}"> Value="{Binding Source={x:Static models:Preference.Instance}, Path=General.MaxHistoryCommits, Mode=TwoWay}">
</Slider> </Slider>
<controls:TextEdit <TextBlock
Grid.Column="2" Grid.Column="1"
Height="24" HorizontalAlignment="Right" VerticalAlignment="Center"
IsReadOnly="True" Foreground="{DynamicResource Brush.FG1}"
Text="{Binding Source={x:Static models:Preference.Instance}, Path=General.MaxHistoryCommits}"/> Text="{Binding Source={x:Static models:Preference.Instance}, Path=General.MaxHistoryCommits}"/>
</Grid> </Grid>