将可绑定属性添加到UserControl

Question

目的

控件的目的是以6x2网格的形式显示12个按钮。单击按钮应将VM的ActiveLayer属性设置为单击按钮的索引（1到12）。 UserControl应通过将按钮的Background更改为SkyBlue来突出显示当前图层。

步骤

以下是我采取的步骤：

1. 在我的UserControl中添加了一个名为DependencyProperty的{​​{1}}。此依赖项属性的ActiveLayer更新按钮的PropertyChangedCallBack（参见底部）。

2. 在XAML中添加了Background（6列，2行）和12个Grid控件。按钮的Button属性设置为它们的索引，即1到12.所有按钮都附加到同一个事件处理程序Tag，它具有以下简单的主体：

   Button_Click

3. 在我的Window中，使用了UserControl，我有以下XAML：

   SetValue(ActiveLayerProperty, CInt(DirectCast(sender, Button).Tag))

这是<local:LayerSelector ActiveLayer="{Binding ActiveDrawing.ActiveLayer}" />处理程序：

PropertyChangedCallBack

问题

上述设置似乎不会更改我的VM的Sub(sender As DependencyObject, e As DependencyPropertyChangedEventArgs) Dim Ctl = DirectCast(sender, LayerSelector) Dim WH = New SolidColorBrush(System.Windows.Media.Colors.White) For i = 0 To 11 DirectCast(Ctl.FindName("btn" + i.ToString()), Button).Background = WH Next DirectCast(Ctl.FindName("btn" + e.NewValue.ToString()), Button).Background = New SolidColorBrush(System.Windows.Media.Colors.SkyBlue) End Sub 属性。按钮背景和UserControl的ActiveLayer属性似乎已更新。我做错了什么？

Answer 1

您尚未为DataContext设置UserControl，这是正确的，但是，在此方案中，绑定到依赖项属性略有不同。您需要直接绑定到UserControl元素。

您可以使用RelativeSource绑定，如下所示：

ActiveLayer="{Binding ActiveDrawing.ActiveLayer, RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=UserControl}}"

或者，提供UserControl和x:Name并使用以下内容：

ActiveLayer="{Binding ActiveDrawing.ActiveLayer, ElementName=yourUserControlName}"

Answer 2

为Buttons创建一个辅助ViewModel，并设置并拥有一个布尔属性（IsActive）。

在Main ViewModel中创建一个ViewModel集合，并将每个按钮上的DataContext设置为集合中不同的索引ViewModel。

单击该按钮时，您可以将单击按钮上的IsActive属性设置为true，将所有其他按钮设置为False。 将每个按钮上的BackgroundColor绑定到IsActive属性，并使用IValueConverter将布尔值转换为背景颜色。

为此，您需要在按钮ViewModel上实现INotifyPropertyChanged。