c# - 自定义按钮中的 WPF 绑定(bind)边框颜色

Question

我有一个应用程序，其中许多自定义按钮是在 WrapPanel 中动态生成的。一切正常，我可以在代码中生成按钮时分配边框粗细、ImageSource、Content 等。客户现在有一个要求，允许他们为各个按钮选择边框颜色，并尽可能尝试我无法找出正确的绑定(bind)方案。我在这里处于陡峭的 WPF 学习曲线上，因此我的初始设计可能有些不合时宜。

在我的 Generic.XAML 中，我有这样指定的按钮:

<Style TargetType="{x:Type local:LauncherButton}">
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type local:LauncherButton}">
                        <Border Name="LauncherButtonBorder" BorderThickness="{TemplateBinding BThickness}"
                                CornerRadius="10" Background="White" >

                            <Border.Style>
                                <Style TargetType="{x:Type Border}">
                                    <Setter Property="BorderBrush" Value="SteelBlue" />

                                    <Style.Triggers>
                                        <Trigger Property="IsMouseOver" Value="True">
                                            <Setter Property="BorderBrush" Value="PaleGoldenrod" />
                                        </Trigger>
                                    </Style.Triggers>

                                </Style>
                            </Border.Style>
                            <DockPanel LastChildFill="True" Background="White" Margin="3">
                                <TextBlock Text="{TemplateBinding Content}" HorizontalAlignment="Center"
                                           Foreground="{DynamicResource TaskButtonTextBrush}" FontWeight="Bold"
                                           Margin="5,0,0,0" VerticalAlignment="Center" FontSize="10"
                                           Background="Transparent" DockPanel.Dock="Bottom" TextWrapping="Wrap" />
                                <Image Source="{TemplateBinding ImageSource}" Stretch="Uniform" />
                            </DockPanel>
                        </Border>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>

我想在 C# 中动态更改当前设置为静态 SteelBlue 和 PaleGoldenrod 的边框颜色。

按钮类是这样定义的:

public class LauncherButton : ButtonBase
    {
        static LauncherButton()
        {
            DefaultStyleKeyProperty.OverrideMetadata(typeof(LauncherButton), new FrameworkPropertyMetadata(typeof(LauncherButton)));
        }

        public ImageSource ImageSource
        {
            get { return (ImageSource)GetValue(ImageSourceProperty); }
            set { SetValue(ImageSourceProperty, value); }

        }

        public Thickness BThickness
        {
            get { return (Thickness) GetValue(BThicknessProperty); }
            set { SetValue(BThicknessProperty,value);}
        }



                public static readonly DependencyProperty ImageSourceProperty =
            DependencyProperty.Register("ImageSource", typeof(ImageSource), typeof(LauncherButton), new UIPropertyMetadata(null));

        public static readonly DependencyProperty BThicknessProperty =
             DependencyProperty.Register("BThickness", typeof(Thickness), typeof(LauncherButton), new UIPropertyMetadata(null));


    }

并且我将一些属性绑定(bind)到以下类的实例:

public class CustomButton:INotifyPropertyChanged
{
    private string _type;
    private string _buttonId;
    private string _name;
    private string _image;
    private string _link;
    private string _parent;
    private List<CustomButton> _children;
    private bool _isExpanded;
    private bool _isSelected;


    public string ButtonId
    {
        get { return _buttonId; }
        set
        {
            if (value == _buttonId) return;
            _buttonId = value;
            OnPropertyChanged("ButtonId");
        }
    }

    public string Type
    {
        get { return _type; }
        set
        {
            if (value == _type) return;
            _type = value;
            OnPropertyChanged("Type");
        }
    }

    public string Name
    {
        get { return _name; }
        set
        {
            if (value == _name) return;
            _name = value;
            OnPropertyChanged("Name");
        }
    }

    public string Image
    {
        get { return _image; }
        set
        {
            if (value == _image) return;
            _image = value;
            OnPropertyChanged("Image");
        }
    }

    public string Link
    {
        get { return _link; }
        set
        {
            if (value == _link) return;
            _link = value;
            OnPropertyChanged("Link");
        }
    }

    public string Parent
    {
        get { return _parent; }
        set
        {
            if (value == _parent) return;
            _parent = value;
            OnPropertyChanged("Parent");
        }
    }

    public List<CustomButton> Children
    {
        get { return _children; }
        set
        {
            if (Equals(value, _children)) return;
            _children = value;
            OnPropertyChanged("Children");
        }
    }

    public bool IsExpanded
    {
        get { return _isExpanded; }
        set
        {
            if (value.Equals(_isExpanded)) return;
            _isExpanded = value;
            OnPropertyChanged("IsExpanded");
        }
    }

    public bool IsSelected
    {
        get { return _isSelected; }
        set
        {
            if (value.Equals(_isSelected)) return;
            _isSelected = value;
            OnPropertyChanged("IsSelected");
        }
    }


    public event PropertyChangedEventHandler PropertyChanged;

    [NotifyPropertyChangedInvocator]
    protected virtual void OnPropertyChanged(string propertyName)
    {
        PropertyChangedEventHandler handler = PropertyChanged;
        if (handler != null) handler(this, new PropertyChangedEventArgs(propertyName));
    }
}

Answer 1

您是否正在尝试使用于 Border.BorderBrush 的两个画笔动态化？

如果是这样，您可以通过几种方式解决它。

• 向 LauncherButton 添加两个依赖属性，例如 NormalBorderBrush 和 MouseOverBorderBrush，然后在使用 Button 时根据需要进行设置。现在要让 Border 使用它，在您设置 SteelBlue 或 PaleGoldenRod 的样式中，应用 RelativeSource FindAncestor 与 AncestorType 绑定(bind)为 local:LauncherButton 并指向相应的 Brush(NormalBorderBrush 或 MouseOverBorderBrush)<

例子:

public class LauncherButton : ButtonBase {
  ...

  public static readonly DependencyProperty NormalBorderBrushProperty =
    DependencyProperty.Register("NormalBorderBrush", typeof(Brush), typeof(LauncherButton),
      new UIPropertyMetadata(Brushes.Blue));

  public static readonly DependencyProperty MouseOverBorderBrushProperty =
    DependencyProperty.Register("MouseOverBorderBrush", typeof(Brush), typeof(LauncherButton),
      new UIPropertyMetadata(Brushes.Red));

  public Brush NormalBorderBrush
  {
    get { return (Brush)GetValue(NormalBorderBrushProperty); }
    set { SetValue(NormalBorderBrushProperty, value); }
  }

  public Brush MouseOverBorderBrush
  {
    get { return (Brush)GetValue(MouseOverBorderBrushProperty); }
    set { SetValue(MouseOverBorderBrushProperty, value); }
  }
}

在 xaml 中:

<Border.Style>
  <Style TargetType="{x:Type Border}">
    <Setter Property="BorderBrush"
            Value="{Binding RelativeSource={RelativeSource FindAncestor,
                                                            AncestorType={x:Type local:LauncherButton}},
                            Path=NormalBorderBrush}" />
    <Style.Triggers>
      <Trigger Property="IsMouseOver"
                Value="True">
        <Setter Property="BorderBrush"
                Value="{Binding RelativeSource={RelativeSource FindAncestor,
                                                                AncestorType={x:Type local:LauncherButton}},
                                Path=MouseOverBorderBrush}" />
      </Trigger>
    </Style.Triggers>
  </Style>
</Border.Style>

和用法:

<local:LauncherButton BThickness="5"
                      Content="Hellooooo"
                      MouseOverBorderBrush="Green"
                      NormalBorderBrush="Aqua" />

Sample Download - 这不包含用于 Brush 使用的转换器，应该很容易实现。

• 或您可以将两个画笔定义为动态资源，并在需要时从您的代码中覆盖它们的颜色。
• 或 您可以使用按钮已有的BorderBrush 属性，并使用TemplateBinding BorderBrush 将其应用于边框。现在这意味着您需要在 IsMouseOver 状态发生变化时相应地切换 BorderBrush。
• 或者您甚至可以检索按钮的 Style 并通过它的名称找到 Border 元素的引用然后在运行时对其进行调整。

就我个人而言，我会选择选项 1。最后在绑定(bind)中使用转换器或类似方式使其对 MVVM 友好。