wpf - 如何更改 Slider 的 Track 模板？

Question

我想将轨道更改为滑块。有没有办法做到这一点？

<Track x:Name="PART_Track" Grid.Row="1">
    <Track.DecreaseRepeatButton>
        <RepeatButton Style="{StaticResource SliderRepeatButtonStyle}" Command="{x:Static Slider.DecreaseLarge}"/>
    </Track.DecreaseRepeatButton>
    <Track.IncreaseRepeatButton>
        <RepeatButton Style="{StaticResource SliderRepeatButtonStyle}" Command="{x:Static Slider.IncreaseLarge}"/>
    </Track.IncreaseRepeatButton>
    <Track.Thumb>
        <Thumb x:Name="Thumb" Style="{StaticResource HorizontalSliderThumbStyle}"/>
    </Track.Thumb>

Answer 1

轨道只处理拇指和重复按钮链接文本的定位。轨道的实际外观在 Slider 的模板中。

要更改“轨道”的外观，请更改控件模板中的以下区域 PART_SelectionRange

<ControlTemplate TargetType="{x:Type Slider}">
<Border SnapsToDevicePixels="true" Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}">
    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto"/>
            <RowDefinition Height="Auto" MinHeight="{TemplateBinding MinHeight}"/>
            <RowDefinition Height="Auto"/>
        </Grid.RowDefinitions>
        <TickBar x:Name="TopTick" Height="4" Visibility="Collapsed" Grid.Row="0" Fill="{TemplateBinding Foreground}" Placement="Top"/>
        <TickBar x:Name="BottomTick" Height="4" Visibility="Collapsed" Grid.Row="2" Fill="{TemplateBinding Foreground}" Placement="Bottom"/>
        <Border Margin="5,0" VerticalAlignment="center" Height="20.0" Grid.Row="1" Background="{StaticResource HorizontalSliderTrackNormalBackground}" BorderBrush="{StaticResource HorizontalSliderTrackNormalBorder}" BorderThickness="1" CornerRadius="1">
            <Canvas Margin="-6,-1">
                <Rectangle x:Name="PART_SelectionRange" Fill="{DynamicResource {x:Static SystemColors.HighlightBrushKey}}" Stroke="{DynamicResource {x:Static SystemColors.ControlDarkDarkBrushKey}}" StrokeThickness="1.0" Height="4.0" Visibility="visible"/>
            </Canvas>
        </Border>
        <Track x:Name="PART_Track" Grid.Row="1">
            <Track.DecreaseRepeatButton>
                <RepeatButton Style="{StaticResource SliderRepeatButtonStyle}" Command="{x:Static Slider.DecreaseLarge}"/>
            </Track.DecreaseRepeatButton>
            <Track.IncreaseRepeatButton>
                <RepeatButton Style="{StaticResource SliderRepeatButtonStyle}" Command="{x:Static Slider.IncreaseLarge}"/>
            </Track.IncreaseRepeatButton>
            <Track.Thumb>
                <Thumb x:Name="Thumb" Style="{StaticResource HorizontalSliderThumbStyle}"/>
            </Track.Thumb>
        </Track>
    </Grid>
</Border>