第三部分：MVVM中使用指令

指令操作是MVVM（Model-View-ViewModel）设计模式的重要部分，它将UI从业务逻辑中分离开来，WPF版Toolbar支持指令框架并应用于广泛使用的MVVM模式中，在MVVM设计的应用程序中，指令目标常常在ViewModel中完成，其并不是UI元素树的部分，因此，在MVVM中使用RoutedCommand并不是一个好的ICommand实现，您可以使用一个特别的实现如DelegateCommand 或 RelayCommand，可以使您的View 绑定到非UI元素树的对象。

以下步骤介绍如何使用RelayCommand 类和C1Toolbar 创建第二部分相同的自定义指令。

创建一个名为MainViewModel的新类以实现INotifyPropertyChanged 接口，该类将作为我们包含C1Toolbar View的ViewModel。

C#	拷贝代码
class MainViewModel : System.ComponentModel.INotifyPropertyChanged { private string textValue = ""; public string TextValue { get { return textValue; } set { textValue = value; OnPropertyChanged("TextValue"); } } private RelayCommand clearCommand; public ICommand ClearCommand { get { if (clearCommand == null) { clearCommand = new RelayCommand(param => this.Clear(), param => this.CanClear()); } return clearCommand; } } private bool CanClear() { return textValue.Length > 0; } private void Clear() { TextValue = ""; } public event PropertyChangedEventHandler PropertyChanged; protected void OnPropertyChanged(string propertyName) { PropertyChangedEventHandler handler = PropertyChanged; if (handler != null) { handler(this, new PropertyChangedEventArgs(propertyName)); } } }

拷贝代码

class MainViewModel : System.ComponentModel.INotifyPropertyChanged
{
    private string textValue = "";
    public string TextValue
    {
        get
        {
            return textValue;
        }
        set
        {
            textValue = value;
            OnPropertyChanged("TextValue");
        }
    }

    private RelayCommand clearCommand;
    public ICommand ClearCommand
    {
        get
        {
            if (clearCommand == null)
            {
                clearCommand = new RelayCommand(param => this.Clear(), param => this.CanClear());
            }
            return clearCommand;
        }
    }

    private bool CanClear()
    {
        return textValue.Length > 0;
    }

    private void Clear()
    {
        TextValue = "";
    }

    public event PropertyChangedEventHandler PropertyChanged;

    protected void OnPropertyChanged(string propertyName)
    {
        PropertyChangedEventHandler handler = PropertyChanged;

        if (handler != null)
        {
            handler(this, new PropertyChangedEventArgs(propertyName));
        }
    }

}

该类使用RelayCommand，它是DelegateCommand轻量级的变体，两个ICommand的实现允许您将指令逻辑作为参数委托给方法进行传递，指令目标不是UI元素树的部分，RelayCommand 和 DelegateCommand 类不是WPF框架的组成部分，且不能通过MVVM工具箱在线查找。

添加RelayCommand 类到您的项目中。

C#	拷贝代码
/// <summary> /// 该类允许将指令逻辑作为参数委托给方法传递, /// 并使一个View绑定指令到非元素树的对象。 /// </summary> public class RelayCommand : ICommand { #region Fields readonly Action<object> _execute; readonly Predicate<object> _canExecute; #endregion // Fields #region Constructors public RelayCommand(Action<object> execute) : this(execute, null) { } public RelayCommand(Action<object> execute, Predicate<object> canExecute) { if (execute == null) throw new ArgumentNullException("execute"); _execute = execute; _canExecute = canExecute; } #endregion // 构造函数 #region ICommand Members [DebuggerStepThrough] public bool CanExecute(object parameter) { return _canExecute == null ? true : _canExecute(parameter); } public event EventHandler CanExecuteChanged { add { CommandManager.RequerySuggested += value; } remove { CommandManager.RequerySuggested -= value; } } public void Execute(object parameter) { _execute(parameter); } #endregion // ICommand成员 }

拷贝代码

/// <summary>
///     该类允许将指令逻辑作为参数委托给方法传递,
///     并使一个View绑定指令到非元素树的对象。
/// </summary>
public class RelayCommand : ICommand
{
    #region Fields

    readonly Action<object> _execute;
    readonly Predicate<object> _canExecute;

    #endregion // Fields

    #region Constructors

    public RelayCommand(Action<object> execute)
        : this(execute, null)
    {
    }

    public RelayCommand(Action<object> execute, Predicate<object> canExecute)
    {
        if (execute == null)
            throw new ArgumentNullException("execute");

        _execute = execute;
        _canExecute = canExecute;
    }
    #endregion // 构造函数

    #region ICommand Members

    [DebuggerStepThrough]
    public bool CanExecute(object parameter)
    {
        return _canExecute == null ? true : _canExecute(parameter);
    }

    public event EventHandler CanExecuteChanged
    {
        add { CommandManager.RequerySuggested += value; }
        remove { CommandManager.RequerySuggested -= value; }
    }

    public void Execute(object parameter)
    {
        _execute(parameter);
    }

    #endregion // ICommand成员
}

为了绑定到ViewModel，需要添加以下XAML 到您包含C1Toolbar 的View上方:

XAML	拷贝代码
<Window.Resources> <local:MainViewModel x:Key="viewModel" /> </Window.Resources> <Window.DataContext> <Binding Source="{StaticResource viewModel}"/> </Window.DataContext>

添加到您ViewModel 的XAML将作为资源绑定到Window或UserControl的DataContext中。

此时添加以下工具栏分组到您在第一部分创建的C1Toolbar 。

XAML	拷贝代码
<c1:C1ToolbarGroup Header="Application"> <c1:C1ToolbarButton LabelTitle="Clear Text" Command="{Binding ClearCommand}" LargeImageSource="/Resources/delete.png"/> </c1:C1ToolbarGroup>

该工具栏分组包含一个带有Command属性的C1ToolbarButton，Command绑定到ViewModel定义的ClearCommand。

由于指令遵循MVVM优秀的特性，文本框的 Text 属性也应该绑定到ViewModel的值，如果我们希望在上面应用业务逻辑，则需要绑定Text 属性到ViewModel中定义的TextValue。

XAML	拷贝代码
<TextBox Grid.Row="1" Text="{Binding TextValue, UpdateSourceTrigger=PropertyChanged}" Height="23" HorizontalAlignment="Left" Margin="12,17,0,0" Name="textBox1" VerticalAlignment="Top" Width="165" />

通过将UpdateSourceTrigger 设置为 PropertyChanged，在ViewModel中的TextValue属性将可以在任何时刻更新Text值，而不是只有当文本框失去焦点时。

运行应用程序并观察行为中的自定义RelayCommand 。

通过MVVM设计模式来降低UI与业务逻辑之间的耦合度，对于您的应用开发是非常实用的。