如何为C# WPF Slider的AutoToolTipPlacement设置自定义样式？

要修改Slider的AutoToolTip结构和文本，核心是重写Slider中Thumb的ControlTemplate（或直接指定AutoToolTipTemplate），以下是两种可行方案：

方案1：完全自定义AutoToolTip结构与样式 #

通过重写Slider的Style，替换Thumb的模板，实现对AutoToolTip的完全控制：

步骤1：添加数值转换类（用于自定义文本） #

在后台代码（如MainWindow.xaml.cs）中定义Converter，实现数值到自定义文本的转换：

using System;
using System.Globalization;
using System.Windows.Data;

namespace YourProjectNamespace
{
    public class SliderValueConverter : IValueConverter
    {
        public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
        {
            if (value is double sliderValue)
            {
                // 自定义文本格式，比如添加单位、保留小数
                return $"当前进度: {sliderValue:F1}%";
            }
            return value;
        }

        public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
        {
            throw new NotImplementedException();
        }
    }
}

步骤2：定义Slider的自定义Style #

在XAML资源中添加自定义Style，替换Thumb模板并修改AutoToolTip：

<Window x:Class="YourProjectNamespace.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:local="clr-namespace:YourProjectNamespace"
        Title="MainWindow" Height="450" Width="800">
    <Window.Resources>
        <local:SliderValueConverter x:Key="SliderValueConverter"/>

        <!-- Slider自定义样式 -->
        <Style x:Key="CustomSliderStyle" TargetType="{x:Type Slider}">
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type Slider}">
                        <Grid>
                            <Grid.RowDefinitions>
                                <RowDefinition Height="Auto"/>
                                <RowDefinition Height="Auto" MinHeight="{TemplateBinding MinHeight}"/>
                                <RowDefinition Height="Auto"/>
                            </Grid.RowDefinitions>
                            <!-- 轨道背景 -->
                            <Border x:Name="TrackBackground" Grid.Row="1" CornerRadius="2" Background="#FFE0E0E0" BorderBrush="#FFAEAEAE" BorderThickness="1" Margin="5,0"/>
                            <!-- 滑动轨道 -->
                            <Track x:Name="PART_Track" Grid.Row="1">
                                <Track.DecreaseRepeatButton>
                                    <RepeatButton Command="{x:Static Slider.DecreaseLarge}" Style="{StaticResource SliderRepeatBtnStyle}"/>
                                </Track.DecreaseRepeatButton>
                                <Track.Thumb>
                                    <Thumb x:Name="Thumb">
                                        <Thumb.Template>
                                            <ControlTemplate TargetType="{x:Type Thumb}">
                                                <Grid>
                                                    <!-- 自定义滑块外观 -->
                                                    <Ellipse Fill="#FF3C7FB1" Stroke="#FF2E6F9B" StrokeThickness="1" Width="18" Height="18"/>
                                                    <!-- 自定义AutoToolTip -->
                                                    <ToolTipService.ToolTip>
                                                        <ToolTip Placement="{TemplateBinding Slider.AutoToolTipPlacement}">
                                                            <Border Background="#FF2C3E50" CornerRadius="4" Padding="6,4">
                                                                <TextBlock Text="{Binding Value, RelativeSource={RelativeSource AncestorType={x:Type Slider}}, Converter={StaticResource SliderValueConverter}}"
                                                                           Foreground="White" FontSize="12" FontWeight="Medium"/>
                                                            </Border>
                                                        </ToolTip>
                                                    </ToolTipService.ToolTip>
                                                </Grid>
                                            </ControlTemplate>
                                        </Thumb.Template>
                                    </Thumb>
                                </Track.Thumb>
                                <Track.IncreaseRepeatButton>
                                    <RepeatButton Command="{x:Static Slider.IncreaseLarge}" Style="{StaticResource SliderRepeatBtnStyle}"/>
                                </Track.IncreaseRepeatButton>
                            </Track>
                        </Grid>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>

        <!-- 轨道按钮的透明样式 -->
        <Style x:Key="SliderRepeatBtnStyle" TargetType="{x:Type RepeatButton}">
            <Setter Property="OverridesDefaultStyle" Value="True"/>
            <Setter Property="IsTabStop" Value="False"/>
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type RepeatButton}">
                        <Rectangle Fill="Transparent"/>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
    </Window.Resources>

    <!-- 使用自定义样式的Slider -->
    <Slider Style="{StaticResource CustomSliderStyle}" 
            AutoToolTipPlacement="Top" 
            Minimum="0" Maximum="100" Value="50" Margin="20"/>
</Window>

方案2：轻量修改仅文本内容 #

如果只需修改AutoToolTip的文本样式或内容，无需改结构，可直接设置AutoToolTipTemplate：

<Slider AutoToolTipPlacement="Top" Minimum="0" Maximum="100" Value="50" Margin="20">
    <Slider.AutoToolTipTemplate>
        <DataTemplate>
            <TextBlock Text="{Binding StringFormat='数值: {0:F0}'}" 
                       Foreground="Red" FontSize="14" FontWeight="Bold"/>
        </DataTemplate>
    </Slider.AutoToolTipTemplate>
</Slider>

关键说明 #

• 文本自定义：可通过IValueConverter实现复杂逻辑转换，或用StringFormat快速格式化数值。
• 结构自定义：在Thumb模板中直接定义ToolTip的内部布局（如添加边框、背景、图标等），完全替换默认样式。
• 位置跟随：确保ToolTip的Placement绑定到Slider的AutoToolTipPlacement属性，拖动滑块时工具提示会自动跟随位置。

内容的提问来源于stack exchange，提问作者Michael