WPF:MVVM框架的简单例程

本文参照于刘铁猛老师“深入浅出WPF”系列视频的一个计算器的例子，并做了相应改进，使其更符合MVVM模式界面和业务分离的核心思想。

以下简单介绍了代码，源码请拉到最后。

1、总体框架 

 

Commands里面放命令

Models里面放建模

ViewModel里面放属性、命令的绑定

2、逻辑简介

 三个文本框绑定ViewModel的三个属性，button绑定ViewModel的一个命令。

xaml文件里的绑定代码：

还需指定DataContext，不然会找不到Binding后面的属性或命令

 

 

点击Button后，执行一个加法命令，将1、2框的值加起来赋给3框。

3、ViewModel代码

using WpfApp3.Commands;
using WpfApp3.Models;

namespace WpfApp3.ViewModel
{
    internal class MainViewModel : NotificationPropertyChanged
    {
        private Calculator _calculator;

        public double Input1
        {
            get => _calculator.Input1;
            set
            {
                _calculator.Input1 = value;
                OnPropertyChanged();
            }
        }

        public double Input2
        {
            get => _calculator.Input2;
            set
            {
                _calculator.Input2 = value;
                OnPropertyChanged();
            }
        }

        public double Output
        {
            get => _calculator.Output;
            set => OnPropertyChanged();
        }

        public DelegateCommand AddCommand { get; set; }

        protected MainViewModel()
        {
            _calculator = new Calculator();
            InitEvent();
            LoadCommand();
        }

        public static MainViewModel Create()
        {
            return new MainViewModel();
        }

        void InitEvent()
        {
            _calculator.SetOutput += SetOutput;
        }

        void LoadCommand()
        {
            AddCommand = new DelegateCommand() { ExecuteAction = AddExecuteAction };
        }

        void AddExecuteAction(object parameter)
        {
            _calculator.Add();
        }

        void SetOutput(double value)
        {
            Output = value;
        }
    }
}

4、核心要点

ViewModel构造时执行了如下操作：

1、实例化了Calculate

2、把SetOutput方法（一个用来给Output属性赋值的方法）绑定在Calculate的实例_calculate的Output属性赋值时触发的事件_calculator.SetOutput上

3、实例化AddCommand命令并绑定其调用的方法

点击Button时程序里发生了什么：

1、button绑定的命令也就是AddCommand被调用，AddCommand绑定了以下方法

void AddExecuteAction(object parameter)
        {
            _calculator.Add();
        }

此方法调用_calculator.Add(),此时开始计算_calculator.Output=_calculator.Input1+_calculator.Input2

给_calculator.Output赋值时会触发_calculator.Output的Set里的_calculator.SetOutput委托

此委托在ViewModel构造时已绑定ViewModel类里的SetOutput方法，所以此时调用以下方法

void SetOutput(double value)
        {
            Output = value;
        }

属性Output被赋值后通知界面文本框变更文本。

5、源码

链接：https://pan.baidu.com/s/1v38MWiAqWRG8vQIz-zErzQ 
提取码：8re9