【WPF】WPF Slider 控件自定义样式

WPF Slider 控件自定义样式

本文通过改写Slider 控件默认模板，实现自定义样式

一、创建Slider控件

提示：根据需要自行调整大小和位置

<Slider HorizontalAlignment="Left" Margin="0,0,0,0" VerticalAlignment="Top" Width="526" Height="55"/>

二、生成默认模板

1. 选中控件，右击选择“编辑模板”->“编辑副本”，并确定

2. 完成后会生成如下代码

提示：本文只针对水平Slider进行修改，只保留水平部分

    <UserControl.Resources>
        <Style x:Key="RepeatButtonTransparent" TargetType="{x:Type RepeatButton}">
            ...
        </Style>
        ...
        <ControlTemplate x:Key="SliderThumbHorizontalDefault" TargetType="{x:Type Thumb}">
            <Grid HorizontalAlignment="Center" UseLayoutRounding="True" VerticalAlignment="Center">
                <Path x:Name="grip" Data="M 0,0 C0,0 11,0 11,0 11,0 11,18 11,18 11,18 0,18 0,18 0,18 0,0 0,0 z" Fill="{StaticResource SliderThumb.Static.Background}" SnapsToDevicePixels="True" StrokeThickness="1" Stretch="Fill" Stroke="{StaticResource SliderThumb.Static.Border}" UseLayoutRounding="True" VerticalAlignment="Center"/>
            </Grid>
            <ControlTemplate.Triggers>
                <Trigger Property="IsMouseOver" Value="true">
                    <Setter Property="Fill" TargetName="grip" Value="{StaticResource SliderThumb.MouseOver.Background}"/>
                    <Setter Property="Stroke" TargetName="grip" Value="{StaticResource SliderThumb.MouseOver.Border}"/>
                </Trigger>
                <Trigger Property="IsDragging" Value=