如何将Fill属性绑定到控件模板中的自定义属性

Question

我有一个按钮控件，它的模板仍在外部资源Theme.xaml中。在控件模板定义下面：

    <ControlTemplate x:Key="ButtonTemplate" TargetType="{x:Type Button}">
     <Grid x:Name="Grid">
       <Border x:Name="Background" Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="2,2,2,2" CornerRadius="2,2,2,2">
       <Border x:Name="Hover" Background="{StaticResource HoverBrush}" CornerRadius="1,1,1,1" Height="Auto" Width="Auto" Opacity="0"/>
       </Border>
       <StackPanel Orientation="Horizontal" Margin="2,2,2,2">
          <ContentPresenter HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}" RecognizesAccessKey="True" />
       </StackPanel>
...

现在我添加了一个项目，它是一个椭圆，必须用红色或绿色填充（作为信号灯），这取决于在我的用户控件中定义的自定义属性：

<UserControl.Resources>
    <ResourceDictionary Source="Themes/theme.xaml"/>
</UserControl.Resources>
<Grid>
    <Button Click="Button_Click"></Button>
    <Ellipse x:Name="ellipse1" Width="20" Height="20"  Margin="5,40,45,5"></Ellipse>
</Grid>

在后面的代码中我有：

private SolidColorBrush ButtonValue_;
public SolidColorBrush ButtonValue {
    get { return ButtonValue_; }
    set {
        ButtonValue_ = value;
    }
}

我正试图将此椭圆项放入CONTROLTEMPLATE中，但在如何将椭圆的Fill属性与ButtonValue自定义属性绑定到CONTROLTEMPLATE中方面，我遇到了一些问题。

有什么提示吗？？提前感谢

Answer 1

你可以去几个方向：

1. 实现自定义控件，这是从现有控件派生的您自己的类（在您的情况下为Button）。添加依赖属性（例如ButtonValue）。注意，依赖属性不是标准的.NET属性，它们有更多的依赖属性。检查以下样本：http://msdn.microsoft.com/en-us/library/cc295235（v=expression.30）.aspx（自定义按钮），或此处：http://wpftutorial.net/HowToCreateACustomControl.html（一个更简单的样本，但没有属性。

2. 具有控件的数据上下文。通常，数据上下文是一个单独的类（也称为"视图模型"），但如果您不遵循mvvm范式，那么数据上下文是self也是可以的。无论您使用什么数据上下文，它都必须派生自INotifyPropertyChanged，并且必须归档PropertyChanged事件。

3. （推荐！）为复选框创建一个控制模板。仔细想想，逻辑上您的控件实际上是一个具有二进制状态的按钮。在您的情况下为红色/绿色，复选框为选中/未选中。因此，从逻辑上讲，您正在寻找一个复选框，但您只想以不同的方式呈现它。

因此，在您的控制模板中，绘制椭圆，并为IsChecked属性添加一个触发器：

<ControlTemplate x:Key="ButtonTemplate" TargetType="{x:Type CheckBox}">
    <Grid>
        ... everything else in the control ...
        <Ellipse x:Name="ellipse1" Width="20" Height="20"  Margin="5,40,45,5" />
    </Grid>
    <ControlTemplate.Triggers>
        <Trigger Property="IsChecked" Value="True">
            <Setter TargetName="ellipse1" Property="Fill" Value="Red" />
        </Trigger>
        <Trigger Property="IsChecked" Value="False">
            <Setter TargetName="ellipse1" Property="Fill" Value="Green" />
        </Trigger>
    </ControlTemplate.Triggers>
</ControlTemplate>

这是一个很好的例子，说明了WPF的行为和表示之间的差异。虽然您的控件可能看起来像一个按钮，但它的行为就像一个复选框，因为它有两种状态。

EDIT：使用ToggleButton-这是CheckBox（和RadioButton）的基类，它具有您所需的功能，包括IsChecked属性。

Answer 2

您有几个选项：

1.最简单的方法是重新使用未使用的画笔或颜色（带转换器）按钮现有属性：

 <Window.Resources>
      <ControlTemplate x:Key="repurposedProperty" TargetType="Button">
        <Border Background="{TemplateBinding BorderBrush}">
          <ContentPresenter/>
        </Border>
       </ControlTemplate>
    </Window.Resources>

<Button Template="{StaticResource repurposedProperty}">Button</Button>

2.另一种选择是定义附加属性并在ControlTemplate中使用它。在你应用模板的任何按钮上，你都必须设置附加的属性：

public static readonly DependencyProperty AttachedBackgroundProperty =
            DependencyProperty.RegisterAttached("AttachedBackground", typeof (Brush), typeof (MainWindow), 
            new PropertyMetadata(default(Brush)));
        public static void SetAttachedBackground(UIElement element, Brush value)
        {
            element.SetValue(AttachedBackgroundProperty, value);
        }
        public static Brush GetAttachedBackground(UIElement element)
        {
            return (Brush) element.GetValue(AttachedBackgroundProperty);
        }

<

Window.Resources>
        <ControlTemplate x:Key="attachedProperty" TargetType="Button">
            <Border Background="{TemplateBinding WpfApplication1:MainWindow.AttachedBackground}">
                <ContentPresenter/>
            </Border>
        </ControlTemplate>
    </Window.Resources>

<Button Template="{StaticResource attachedProperty}">
            <WpfApplication1:MainWindow.AttachedBackground>
                <SolidColorBrush Color="Pink"></SolidColorBrush>
            </WpfApplication1:MainWindow.AttachedBackground>
  Button</Button>

PS：您可以使用绑定来设置附加属性的值。