wpf - 使 WPF slider 的工具提示在拖动时停留在屏幕上

Question

我正在使用 slider 控件来设置应用程序的缩放级别，并且我想向最终用户显示当前的实时缩放级别。所以我决定在 slider 顶部显示一个工具提示，以便用户可以看到缩放级别的值。

但问题是当用户拖动 slider 的位置时，工具提示消失了，我再也看不到工具提示了。我必须再次更改鼠标的位置我必须将鼠标放在 slider 顶部以查看缩放级别是多少

我用的xaml是这个

<Slider                                        
    VerticalAlignment="Center"                                             
    Minimum="50" Maximum="200" Width="150"  Name="ViewZoomlevel" 
    IsMoveToPointEnabled="True" IsSnapToTickEnabled="True"   
    Thumb.DragStarted="ViewZoomlevel_DragStarted" Thumb.DragCompleted="ViewZoomlevel_DragCompleted"                                         
        >
    <Slider.ToolTip >
        <ToolTip StaysOpen="True" ToolTipService.ShowDuration="12000" Content="{Binding RelativeSource={RelativeSource Self},
                    Path=PlacementTarget.Value}" 
                    ContentStringFormat="Zoom: {0:0} %" />
    </Slider.ToolTip>
</Slider>   

我应用了ToolTipService.ShowDuration="12000"但是好像没有效果。在拖动 slider 拇指的位置时，如何确保 slider 工具提示出现在 slider 顶部

Answer 1

没有“代码隐藏”的解决方案

自定义Popup控件的实现:

public class PopupEx : Popup
{
    protected override void OnOpened(EventArgs e)
    {
        var friend = this.PlacementTarget;
        friend.QueryCursor += friend_QueryCursor;

        base.OnOpened(e);
    }

    protected override void OnClosed(EventArgs e)
    {
        var friend = this.PlacementTarget;
        friend.QueryCursor -= friend_QueryCursor;

        base.OnClosed(e);
    }

    private void friend_QueryCursor(object sender, System.Windows.Input.QueryCursorEventArgs e)
    {
        this.HorizontalOffset += +0.1;
        this.HorizontalOffset += -0.1;
    }
}

XAML:

<Slider Minimum="0" Maximum="100" VerticalAlignment="Center" HorizontalAlignment="Stretch">
        <Slider.Template>
            <ControlTemplate TargetType="{x:Type Slider}">
                <Grid Background="#05000000">
                    <PopupEx x:Name="InfoPopup" Width="Auto" Height="Auto" PlacementTarget="{Binding ElementName=Thumb}" Placement="Top" StaysOpen="False" IsOpen="False" AllowsTransparency="True">
                        <Border Padding="2" CornerRadius="3" Background="#555C5C5C">
                            <TextBlock Foreground="Black" Text="{Binding ElementName=PART_Track, Path=Value, StringFormat=Zoom:{0:0}%}"></TextBlock>
                        </Border>
                    </PopupEx>
                    <Track x:Name="PART_Track">
                        <Track.Thumb>
                            <Thumb x:Name="Thumb" Width="10" Height="20">
                            </Thumb>
                        </Track.Thumb>
                    </Track>
                </Grid>
                <ControlTemplate.Triggers>
                    <Trigger SourceName="Thumb" Property="IsDragging" Value="True">
                        <Setter Value="True" TargetName="InfoPopup" Property="IsOpen" />
                    </Trigger>
                    <Trigger SourceName="Thumb" Property="IsDragging" Value="False">
                        <Setter Value="False" TargetName="InfoPopup" Property="IsOpen" />
                    </Trigger>
                </ControlTemplate.Triggers>
            </ControlTemplate>
        </Slider.Template>
    </Slider>