1

这是我的自定义拇指，用于滑块：

 <Style x:Key="SliderThumbStyle" TargetType="Thumb">
    <Setter Property="SnapsToDevicePixels" Value="true"/>
    <Setter Property="OverridesDefaultStyle" Value="false"/>
    <Setter Property="Height" Value="18"/>
    <Setter Property="Width" Value="18"/>
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="Thumb">
                <Grid>
                    <Border x:Name="thumbBorder" 
                        CornerRadius="9,0,0,9"
                            Background="DimGray"/>

                    <Ellipse x:Name="thumbEllipse"  
                              Fill="Orange"></Ellipse>
                </Grid>


            </ControlTemplate>

        </Setter.Value>
    </Setter>      
</Style>

这就是我在滑块自定义控件中使用它的方式：

 <Style TargetType="Slider">
<Setter Property="OverridesDefaultStyle" Value="true"/>
 <Setter Property="Value" Value="5"></Setter>
   <Setter Property="Template">
    <Setter.Value>
        <ControlTemplate TargetType="Slider">
            <Grid>   
                    <Border Name="PART_Border" 
                        CornerRadius="9" 
                        Width="{TemplateBinding Width}" 
                        Height="18"
                        Background="Red"
                        HorizontalAlignment="Stretch"  
                        VerticalAlignment="Center" />

                    <Track Name="PART_Track" 
                           HorizontalAlignment="Stretch" 
                           VerticalAlignment="Center"   
                           Width="{TemplateBinding Width}" 
                           Height="{TemplateBinding Height}">
                    <Track.DecreaseRepeatButton>
                        <RepeatButton Command="Slider.DecreaseLarge" 
                                      Style="{StaticResource SliderButtonStyle}" />
                    </Track.DecreaseRepeatButton>
                    <Track.Thumb>
                        <Thumb x:Name="myThumb"
                            Style="{StaticResource SliderThumbStyle}" />
                    </Track.Thumb>
                        <Track.IncreaseRepeatButton>
                            <RepeatButton Command="Slider.IncreaseLarge" 
                                       Style="{StaticResource DecreaseSliderButtonStyle}"/>
                    </Track.IncreaseRepeatButton>
                </Track>                   
            </Grid>   

            <!-- this is the part I would like to change, so I can modify myThumb's border / ellipse: -->
            <ControlTemplate.Triggers>
                <Trigger SourceName="PART_Track" Property="Value" Value="10">
                        <Setter TargetName="myThumb" Property="Width" Value="50"></Setter>
                </Trigger>
            </ControlTemplate.Triggers>

        </ControlTemplate>
    </Setter.Value>
</Setter>

在评论部分，当达到最大值时，我设法通过触发器修改拇指：有什么办法可以修改自定义拇指的部分，比如它的边框（x：thumbBorder）或椭圆（x：thumbEllipse )?

4

1 回答 1

0

您可以在这里做的是在 Slider 的 ControlTemplate.Triggers 中设置 Thumb 上的 Tag 属性，然后在 Thumb 的 ControlTemplate 中，您可以将触发器放在 Tag 属性上，以更改您想要对其 ControlTemplate 内容（如边框或椭圆）执行的操作。

即在 Slider 的 ControlTemplate.Triggers

        <ControlTemplate.Triggers>
            <Trigger SourceName="PART_Track" Property="Value" Value="10">
                    <Setter TargetName="myThumb" Property="Tag" Value="50"></Setter>
            </Trigger>
        </ControlTemplate.Triggers>

和拇指控制模板里面

         <ControlTemplate.Triggers>
            <DataTrigger Binding="{Binding Tag, RelativeSource={RelativeSource TemplatedParent}}" Value="50">
                    <Setter TargetName="thumbEllipse" Property="Fill" Value="Red"></Setter>
            </DataTrigger>
        </ControlTemplate.Triggers>
于 2013-09-29T18:18:17.260 回答