绑定 WPF UserControl 以查看模型和代码

Question

我试图了解连接自定义控件以使用依赖属性和视图模型的最佳方式。实现依赖属性以公开可在 XAML 中用于初始化视图模型中的属性的属性。例如，在自定义控件的代码中，我可以定义以下依赖属性：

public static readonly DependencyProperty MyPropertyProperty = DependencyProperty.Register(
         "MyProperty", typeof(string), typeof(MyControl), new PropertyMetadata(null));

public string MyProperty
{
  get { return (string)GetValue(MyPropertyProperty); }
  set { SetValue(MyPropertyProperty, value); }
}

视图模型定义为

public class MyControlViewModel : INotifyPropertyChanged
   {
      public MyControlViewModel()
      {
         _myProperty = "Default View Model string";
      }

      private string _myProperty;

      public string MyProperty
      {
         get
         {
            return _myProperty;
         }
         set
         {
            _myProperty = value;
            OnPropertyChanged("MyProperty");
         }
      }

      public event PropertyChangedEventHandler PropertyChanged;

      protected virtual void OnPropertyChanged(string propertyName = null)
      {
         var handler = PropertyChanged;
         if (handler != null) handler(this, new PropertyChangedEventArgs(propertyName));

      }
   }

自定义控件绑定到 View Model MyProperty 如下

<UserControl x:Class="MyProject.MyControlView"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:local="clr-namespace:MyProject">

    <UserControl.DataContext>
        <local:MyControlViewModel/>
    </UserControl.DataContext>

    <Grid>
        <TextBlock Text="{Binding MyProperty}"/>                
    </Grid>

</UserControl>

现在，由于我已经在自定义控件的代码中定义了依赖属性 MyProperty，我希望能够使用它来初始化 ViewModel 中的 MyProperty。所以像这样的

 <Window x:Class="MyProject.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:local="clr-namespace:MyProject"
        Title="MainWindow" Height="350" Width="525">
    <Grid>
        <local:MyControlView MyProperty="This was set in XAML"/>
    </Grid>
</Window>

运行上述将显示在视图模型的构造函数中设置的字符串“默认视图模型字符串”。如何连接依赖属性值，以便正确初始化视图模型中的字符串？即它应该显示“这是在 XAML 中设置的”。

更新

我可以在后面的代码中设置属性更改回调，并在视图模型中设置值，即

public static readonly DependencyProperty MyPropertyProperty =
          DependencyProperty.Register("MyProperty", typeof(string), typeof(MyControlView), new PropertyMetadata("Default", OnMyPropertyChanged));

      private static void OnMyPropertyChanged(DependencyObject d, DependencyPropertyChangedEventArgs e)
      {
         var view = d as MyControlView;
         if (view != null)
         {
            var viewModel = view.DataContext as MyControlViewModel;
            if (viewModel != null)
            {
               viewModel.MyProperty = e.NewValue as string;
            }
         }
      }

这是正确的，还是有味道？

Answer 1

您已经创建了很好的依赖属性。但是，您已经通过实例化您的视图模型并将其属性使用到后面的代码中来实现紧密耦合。方法不对。

您应该从“Control”继承您的类并为绑定值创建一个DP，如下面的custom control class：

public static readonly DependencyProperty myValueProperty = DependencyProperty.Register(
            "MyProperty", typeof(object), typeof(FieldControl), new FrameworkPropertyMetadata(null, myValueChanged));

那么，

private static void myValueChanged(DependencyObject dependencyObject, DependencyPropertyChangedEventArgs dependencyPropertyChangedEventArgs)
        {
            var fc = dependencyObject as FieldControl;
            if (fc != null)
            {
                fc.SetValue(BindingExpression1Key, fc.GetBindingExpression(ValueProperty));
                fc.RaiseValueChangedEvent(dependencyPropertyChangedEventArgs);
            }
        }

现在，使用它并像下面这样绑定你的属性：

 <local:MyControlView MyProperty="{Binding MyProperty, Mode=TwoWay}"/>

Answer 2

您可以使用混合行为基于视图的依赖属性 (DP) 更新 ViewModel (INPC) 属性。此解决方案避免了在代码隐藏中添加属性更改回调：

<UserControl x:Class="MyProject.MyControlView"
         xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"             
         xmlns:i="clr-namespace:System.Windows.Interactivity;assembly=System.Windows.Interactivity"
         xmlns:ic="clr-namespace:Microsoft.Expression.Interactivity.Core;assembly=Microsoft.Expression.Interactions"
         xmlns:local="clr-namespace:MyProject"
         x:Name="MyControl">

<UserControl.DataContext>
    <local:MyControlViewModel/>
</UserControl.DataContext>

<i:Interaction.Triggers>
    <i:EventTrigger EventName="Loaded">
        <ic:ChangePropertyAction
            TargetObject="{Binding}"
            PropertyName="MyProperty"
            Value="{Binding ElementName=MyControl, Path=MyProperty}" />
    </i:EventTrigger>
</i:Interaction.Triggers>

<Grid>
    <TextBlock Text="{Binding MyProperty}"/>
</Grid>

您必须在项目中添加对 System.Windows.Interactivity 和 Microsoft.Expression.Interactivity.Core 程序集的引用才能使用混合行为（注意我添加的 i 和 ic 命名空间）。

在这种情况下，我使用调用ChangePropertyAction 的EventTrigger 挂钩到UserControl Loaded 事件。通过为TargetObject 指定{Binding}，我通知行为使用绑定DataContext 中的视图模型。 PropertyName 指的是视图模型上的属性。 Value 指的是视图上的 DP。我给你的 UserControl 起了一个名字，这样我在查询 MyProperty 的值时可以很容易地引用它。

这样做的好处是，您可以在 DataContext 中替换您的视图模型（只要新模型也具有 MyProperty 属性），而无需更新代码隐藏。