c# – WPF自定义滑块PART_SelectionRange落后于拇指

发布时间：2020-12-15 22:47:33 所属栏目：百科来源：网络整理

导读：我为我的应用创建了自定义滑块和缩略图模板.除了PART_SelectionRange Rectangle之外,它正如预期的那样工作,它稍微在拇指后面开始,到达最大值的时间远远落后于它. 我不知道如何修复它,因为看起来问题在于控制PART_SelectionRange Rectangle大小的任何类的行为

我为我的应用创建了自定义滑块和缩略图模板.除了PART_SelectionRange Rectangle之外,它正如预期的那样工作,它稍微在拇指后面开始,到达最大值的时间远远落后于它.

我不知道如何修复它,因为看起来问题在于控制PART_SelectionRange Rectangle大小的任何类的行为.

This video illustrates the problem

(对不起,我不知道如何内联).

<ControlTemplate x:Key="SliderThumbHorizontalDefault" TargetType="{x:Type Thumb}">
    <Grid>
        <!-- SliderThumb -->
        <Path x:Name="grip" Data="M-0.4,6.4 C1.2,1 9,1 10.5,6.5 12,11.787571 5.0267407,18.175417 5.0267407,18.175417 -2,11.8 -0.4,6.4 z"
            Fill="White" Stretch="Fill" SnapsToDevicePixels="True"
            Stroke="Black" StrokeThickness="1" UseLayoutRounding="True" />
        <ContentPresenter Margin="0 4 0 0"  Content="{Binding Value,RelativeSource={RelativeSource AncestorType={x:Type Slider}}}" TextBlock.Foreground="Black" TextBlock.FontSize="20" TextBlock.TextAlignment="Center" />
    </Grid>
</ControlTemplate>

<ControlTemplate x:Key="SliderHorizontal" TargetType="{x:Type Slider}">
    <ControlTemplate.Resources>
        <vc:TickConverter x:Key="TickConverter" />
    </ControlTemplate.Resources>
    <Grid Height="{StaticResource SliderHeight}">
        <Border x:Name="TrackBackground" BorderBrush="{StaticResource SliderThumb.Track.Border}" BorderThickness="0"
                Background="White"
                CornerRadius="{Binding ActualHeight,Converter={StaticResource HalvingConverter},ElementName=TrackBackground}">
            <!-- This rectangle is what lags behind! -->
            <Rectangle x:Name="PART_SelectionRange" Fill="SlateBlue"
                        HorizontalAlignment="Left" RadiusY="3" RadiusX="3" />
        </Border>
        <Track x:Name="PART_Track" >
            <Track.Thumb>
                <Thumb x:Name="Thumb" Focusable="False" Width="35" Height="47" OverridesDefaultStyle="True"
                            Template="{StaticResource SliderThumbHorizontalDefault}" Margin="-14.65,-55,-16,12"/>
            </Track.Thumb>
        </Track>
    </Grid>
    <ControlTemplate.Triggers>
        <Trigger Property="IsSelectionRangeEnabled" Value="true">
            <Setter Property="Visibility" TargetName="PART_SelectionRange" Value="Visible" />
        </Trigger>
        <Trigger Property="IsKeyboardFocused" Value="true">
            <Setter Property="Foreground" TargetName="Thumb" Value="Blue" />
        </Trigger>
    </ControlTemplate.Triggers>
</ControlTemplate>

<Style TargetType="{x:Type Slider}">
    <Setter Property="MinHeight" Value="{StaticResource SliderHeight}" />
    <Setter Property="MaxHeight" Value="{StaticResource SliderHeight}" />
    <Setter Property="Stylus.IsPressAndHoldEnabled" Value="false" />
    <Setter Property="IsSelectionRangeEnabled" Value="True" />
    <Setter Property="Background" Value="Transparent" />
    <Setter Property="BorderBrush" Value="Transparent" />
    <Setter Property="Foreground" Value="{StaticResource SliderThumb.Static.Foreground}" />
    <Setter Property="SelectionStart" Value="{Binding Minimum,RelativeSource={RelativeSource Self}}" />
    <Setter Property="SelectionEnd" Value="{Binding Value,RelativeSource={RelativeSource Self}}" />
    <Setter Property="Template" Value="{StaticResource SliderHorizontal}" />
</Style>

在这一点上,我不知道我应该尝试修改什么.我相信我已经尝试过改变xaml中有意义的每一个属性,所以我认为问题出在Slider类中,但无法理解.

解决方法

遗憾的是,您无法仅使用自定义样式和ControlTemplates更改Slider的此行为.

原因是Slider控件根据Thumb的宽度调整选择范围的宽度.当您将滑块位置移向其最大值时,这会使选择范围栏“挂起”.如果您希望选择范围完全遵循值,则需要将Thumb宽度设置为0.但是,显然,您将无法移动拇指,因为将不再进行命中测试.

这是current implementation相应的选择范围大小和位置调整：

if (DoubleUtil.AreClose(range,0d) || (DoubleUtil.AreClose(trackSize.Width,thumbSize.Width)))
{
    valueToSize = 0d;
}
else
{
    valueToSize = Math.Max(0.0,(trackSize.Width - thumbSize.Width) / range);
}

rangeElement.Width = ((SelectionEnd - SelectionStart) * valueToSize);
if (IsDirectionReversed)
{
    Canvas.SetLeft(rangeElement,(thumbSize.Width * 0.5) + Math.Max(Maximum - SelectionEnd,0) * valueToSize);
}
else
{
    Canvas.SetLeft(rangeElement,(thumbSize.Width * 0.5) + Math.Max(SelectionStart - Minimum,0) * valueToSize);
}

你现在有两个选择：

>实现自己的滑块控件,不会根据Thumb宽度调整其选择范围>或从ControlTemplate中的选择矩形中删除“PART_SelectionRange”名称,并使用带有IValueConverters(或行为或附加属性)的Bindings来手动控制外观

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!