WPF 中的 Slider Trackbar Control 是否可以有多个背景？

Question

我正在尝试创建一个多色滑块。我有红、绿、蓝三种颜色。 我正在尝试设置滑块 Track bar 的 0-33 Red、34-66 Green、67-100 Blue 的颜色

我对如何做到这一点感到困惑。

我能够设置滑块的背景，但我得到了一个渐变，我想要与此类似的东西，但不是纯色的渐变。

var brush = new LinearGradientBrush(new GradientStopCollection() { 
                new GradientStop(Colors.Red, 0.0),
                new GradientStop(Colors.Blue, 0.3),
                new GradientStop(Colors.Green, 0.6),
            });
            TestBar.Background = brush;

我正在尝试做一些动态的事情 就像我有这样的课

class SomeObject {
    public int From;
    public int To;
    public string Color;
}

我可以毫无问题地更改轨迹栏颜色。

Answer 1

我试图在这里做我认为你想要的，使用一个完整的自定义控件。 The code is on GitHub。可能有更简单的方法可以做到这一点，但是因为您希望将控件的背景分成三个并着色，所以我认为合乎逻辑的做法是将三个矩形放入控件模板并为它们着色。

代码包含一个 ColorSlider 控件，具有三种颜色的依赖属性 Color1、Color2、Color3（属于 Brush 类型），以及三种宽度的 Width1、Width2、Width3（双精度值）。

为此，我们设置了一个注册依赖属性的 ColorSlider 类（摘录）：

public class ColorSlider : Slider
{
    public static readonly DependencyProperty Width1Property = DependencyProperty.Register("Width1", typeof(double), typeof(ColorSlider), new UIPropertyMetadata(0.0));
    [TypeConverter(typeof(LengthConverter))]
    public double Width1
    {
        get { return (double)GetValue(Width1Property); }
        set { SetValue(Width1Property, value); }
    }

我们需要一个以 ColorSlider 为目标的滑块控件模板的副本，然后在其网格中使用 Stackpanel，如下所示（摘录清楚）：

                <StackPanel Grid.Row="1" Panel.ZIndex="-1" Orientation="Horizontal">
                    <Rectangle Fill="{TemplateBinding Color1}" Height="{TemplateBinding Height}" Width="{TemplateBinding Width1}" />
                    <Rectangle Fill="{TemplateBinding Color2}" Height="{TemplateBinding Height}" Width="{TemplateBinding Width2}" />
                    <Rectangle Fill="{TemplateBinding Color3}" Height="{TemplateBinding Height}" Width="{TemplateBinding Width3}" />
                </StackPanel>

现在我们可以创建一个颜色滑块并设置这些属性：

<local:ColorSlider x:Name="MyColorSlider" Template="{DynamicResource ColorSliderControlTemplate}" Width="200" Height="50"
Color1="Red" Color2="Green" Color3="Blue" Width1="68" Width2="66" Width3="66"></local:ColorSlider>

我们可以从代码中动态设置它们：

            MyColorSlider.Width3 = 20;
            MyColorSlider.Color1 = new SolidColorBrush(Colors.Orange);

希望有所帮助，这显然有点基础。