简述

   WPF中Slider分为三部分，滑块类型为Thumb；进度条类型为RepeatButton，其中：位于滑块左侧或下侧部分为DecreaseRepeatButton，位于滑块右侧或上侧部分为IncreaseRepeatButton。
   设置Slider样式时，一般单独设置三部分的样式(Style)，然后在Sldier的样式(Style)中引用它们。

代码示例

<Style TargetType="{x:Type Thumb}" x:Key="SliderThumbStyle"> <Setter Property="Template"> <Setter.Value> <ControlTemplate TargetType="{x:Type Thumb}"> <Ellipse Width="25" Height="25" Fill="Black"/> </ControlTemplate> </Setter.Value> </Setter> </Style> <Style TargetType="RepeatButton" x:Key="Slider_DecreaseRepeatBtnStyle"> <Setter Property="Template"> <Setter.Value> <ControlTemplate TargetType="RepeatButton"> <Border SnapsToDevicePixels="True" Background="DeepSkyBlue" BorderThickness="1" CornerRadius="5" BorderBrush="DeepSkyBlue" Height="10"/> </ControlTemplate> </Setter.Value> </Setter> </Style> <Style TargetType="{x:Type Slider}"> <Setter Property="Template"> <Setter.Value> <ControlTemplate TargetType="Slider"> <Grid> <Border Name="PART_Border" BorderBrush="Black" BorderThickness="1" CornerRadius="5" Padding="2" Width="{TemplateBinding Width}" Height="10" Background="LightGray" HorizontalAlignment="Stretch" VerticalAlignment="Center"> </Border> <Track Name="PART_Track"> <Track.DecreaseRepeatButton> <RepeatButton Style="{StaticResource Slider_DecreaseRepeatBtnStyle}"> </RepeatButton> </Track.DecreaseRepeatButton> <Track.Thumb> <Thumb Style="{StaticResource SliderThumbStyle}" /> </Track.Thumb> </Track> </Grid> </ControlTemplate> </Setter.Value> </Setter> </Style>结果演示

补充Thumb样式可改为图片显示方式，将Ellipse的Fill属性改为使用ImageBrush填充即可；代码中未引用IncreaseRepeatButton样式，在Slider样式中按DecreaseRepeatButton方式添加。