绑定模板到背景和前景色？

Question

我正在为一个按钮构建一个简单的ControlTemplate。我想绘制一个两种颜色的渐变，并绑定这两种颜色，这样我就不需要在模板中硬编码它们。但是由于Background和Foreground是Brushes而不仅仅是Colors，我不确定这是否可行。

有人可以告诉我是否有一个好方法来做到这一点吗？这似乎很简单。谢谢。

<ControlTemplate x:Key="ElipseButton" TargetType="Button">
  <Ellipse>
   <Ellipse.Fill>
    <RadialGradientBrush RadiusX="1" RadiusY="1" GradientOrigin="0.7,0.8">
              <GradientStop Color="White" Offset="0"/>
     <GradientStop Color="Black" Offset="1"/>
    </RadialGradientBrush>
   </Ellipse.Fill>
  </Ellipse>
 </ControlTemplate>

我希望用TemplateBindings替换“黑色”和“白色”的颜色。

- TheSean

Answer 1

您可以使用附加属性来添加一些新的颜色属性，以便在按钮上使用：

public class ColorExtensions
{
    public static readonly DependencyProperty ColorFrontProperty = DependencyProperty.RegisterAttached(
        "ColorFront",
        typeof(Color),
        typeof(ColorExtensions),
        new UIPropertyMetadata(Colors.White));

    public static Color GetColorFront(DependencyObject target)
    {
        return (Color)target.GetValue(ColorFrontProperty);
    }

    public static void SetColorFront(DependencyObject target, Color value)
    {
        target.SetValue(ColorFrontProperty, value);
    }

    public static readonly DependencyProperty ColorBackProperty = DependencyProperty.RegisterAttached(
        "ColorBack",
        typeof(Color),
        typeof(ColorExtensions),
        new UIPropertyMetadata(Colors.Black));

    public static Color GetColorBack(DependencyObject target)
    {
        return (Color)target.GetValue(ColorBackProperty);
    }

    public static void SetColorBack(DependencyObject target, Color value)
    {
        target.SetValue(ColorBackProperty, value);
    }
}

然后，您可以在任何实例上设置这些值，并使用普通绑定（TemplateBindings 在此处不起作用）在模板中访问它们：

<Button Content="Click Me" local:ColorExtensions.ColorFront="Red">
    <Button.Template>
        <ControlTemplate TargetType="Button">
            <Ellipse>
                <Ellipse.Fill>
                    <RadialGradientBrush RadiusX="1" RadiusY="1" GradientOrigin="0.7,0.8">
                        <GradientStop Color="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=(local:ColorExtensions.ColorFront)}" Offset="0"/>
                        <GradientStop Color="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=(local:ColorExtensions.ColorBack)}" Offset="1"/>
                    </RadialGradientBrush>
                </Ellipse.Fill>
            </Ellipse>
        </ControlTemplate>
    </Button.Template>
</Button>

- John Bowen

---

为什么“GradientStop”不接受“TemplateBinding”？ - Nicke Manarin

Answer 2

个人而言，我会把整个Brush放进你的模板中。这样可以让你在以后拥有更多的控制权，因为它允许你通过模板更改将画笔从径向渐变变成线性渐变等。

- Reed Copsey