MVVM 扫盲

只求简单易懂

 希望能通过一个简单的示例，让大家快速了解MVVM模式

说：我有一个业务逻辑：它记录了一个人的姓名和性别，还可以把这两个信息保存起来（比如数据库中），我管它叫PersonViewModel.代码如下：

public class PersonViewModel : INotifyPropertyChanged
{
    //INotifyPropertyChanged接口的实现
    public event PropertyChangedEventHandler PropertyChanged;
    protected void OnPropertyChanged(string propertyName)
    {
        if (PropertyChanged != null)
        {
            PropertyChanged(this, new PropertyChangedEventArgs(propertyName));
        }
    }

    //个人信息
    private string _name = "";
    private bool _sex = false;

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

    public bool Sex
    {
        get { return _sex; }
        set
        {
            if (_sex != value)
            {
                _sex = value;
                OnPropertyChanged("Sex");
            }
        }
    }

    //保存命令
    private SaveCommand _saveCmd;//SaveCommand是我的一个实现了ICommand接口的类，会WPF都能猜到
    public SaveCommand SaveCmd
    {
        get
        {
            if (_saveCmd == null)
            {
                _saveCmd = new SaveCommand(param => Save());
            }
            return _saveCmd;
        }
    }

    //当SaveCommand被执行时，会调用下面的方法
    private void Save()
    {
        //执行SQL语句把Name、Sex保存到数据库中
    }

业务逻辑完成了，下面设计界面，PersonView是一个UserControl，代码如下：

<UserControl >
    <StackPanel>
        <StackPanel Orientation="Horizontal">
            <TextBlock Text="姓名:"/>
            <TextBox Text="{Binding Path=Name}"/>
        </StackPanel>
        <StackPanel Orientation="Horizontal">
            <TextBlock Text="性别:"/>
            <CheckBox IsChecked="{Binding Path=Sex}"/>
            <TextBlock Text="男"/>
        </StackPanel>
        <Button Content="保存" Command="{Binding Path=SaveCmd}"/>
    </StackPanel>
</UserControl>

PersonView的TextBox和CheckBox绑定到了PersonViewModel的Name和Sex属性上了。

PersonView中的按钮绑定了PersonViewModel的SaveCmd命令。

PersonView和PersonViewModel之间再有没有其他你来我往、互相访问、纠缠不清的代码了。

在数据库与PersonViewModel之间会传递多个个人信息，再设计个Person类会更好，代码如下：

public class Person
{
    public string Name{ get; set; }
    public bool Sex{ get; set; }
}

有了Person类，PersonModelView也该改了，如下：

public class PersonViewModel : INotifyPropertyChanged
{
    //INotifyPropertyChanged接口等：省略

    //个人信息
    private Person _p;

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

    public bool Sex
    {
        get { return _p.Sex; }
        set
        {
            if (_p.Sex != value)
            {
                _p.Sex = value;
                OnPropertyChanged("Sex");
            }
        }
    }

    //当SaveCommand被执行时，会调用下面的方法
    private void Save()
    {
        //执行SQL语句把_p保存到数据库中
    }

到现在为止MVVM的全部元素都已登场：PersonViewModel是ViewModel，PersonView是View，Person是Model。