WPF【11_4】WPF实战-重构与美化(MVVM 架构)

11-9 【理论】MVVM 架构

在 WPF 项目中，我们主要采用的是一种类似 MVC 的架构，叫做 MVVM。 MVVM 继承了 MVC 的理念，是 Model-View-ViewModel 的缩写，中文意思是模型、视图、视图模型。这三个词分开看我们都能看懂，不过合在一起是什么意思呢？

既然合在一起看不懂，咱们还是分开来解释吧。

什么是MVVM示例图

    首先， View。 
    当我们创建一个新的 WPF 项目的时候，首先打开的是什么呢？是这个界面设计页面， MainWindow.xaml 文件，没错吧？那这个 xaml 是干什么用的呢？它就是用来与 UI， 与用户界面打交道的文件。在这个文件中，所有的设计元素、 UI 组件、代码全部都可以看作视图(View)。
    所以说我们的视图不仅包含 UI 界面，还包含了这个界面中所涉及的代码逻辑。因此在 WPF 项目中， xaml 文件件以及 xaml.cs 文件，都可以被我们称作视图。在一个视图中，我们可以创建文本框、 TextBox、 DatePicker、 Button 等等各种各样的组件。而支撑这个视图的数据则来自数据模型(Model)。 
    比如说我们的 WPF 项目有两个部分的数据，客户的姓名以及预约数据。而这些数据分别对应的也正是我们数据库中的两张表。所有的数据定型和结构化处理都是由这个模型来完成的。在视图中，我们可以根据模型的字段来显示和更新数据。比如说客户模型，我们需要包含他的姓名、身份证、住址等等信息。而预约模型应该包含客户的 ID、 预约时间等等。
    虽然对于一个 WPF 项目来说，仅仅使用 Model 和 View， 甚至只使用 View 也能完成各种各样复杂的功能，比如说上一章我们的实战项目只有 View， 同样也可以完成客户预约系统的开发。但是直接从视图访问数据库是一种比较低级的开发方式，我们无法对数据进行隔离，无法进行复杂的业务开发，甚至无法可持续的维护系统。
    所以我们必须要进行业务与数据的隔离，以及业务与界面的隔离。根据上述的原则，对于业务进行分离后，我们就得到了视图模型。客户视图模型对应的就是客户模型。视图模型可以全部或者部分使用模型的字段。模型的字段通过映射的方式向视图模型提供数据支持。而视图模型与视图则是双向绑定，不仅可以让用户看到数据，还可以通过 UI 交互操作数据。
    而视图模型作为业务逻辑的载体，也会承担与数据库的沟通工作。
    比如说， UI 上面有两个按钮，分别是刷新客户信息和保存客户信息。点击刷新， UI 则会通过发送事件的方式通知视图模型，而视图模型在收到刷新请求以后，就会去数据库提取数据，然后重新把数据提供给视图。如果用户点击了保存信息的按钮，那么视图模型同样会接收到更新事件，然后会把 UI 上用户输入的数据提交给数据库，完成数据的更新。而最后我们的视图模型则会处理一切与 UI 的交互行为。

什么是MVVM示例图2

    所以简单来说， MVVM 架构就是由视图、模型以及视图模型构成。视图模型访问数据库提取数据，通过使用模型来对象化数据，然后把数据绑定给 UI，也就是视图。而视图则处理一切与用户的交互，并且把用户数据反馈给视图模型，由视图模型的业务规则来提供下一步的处理。最后，视图与模型之间由于加入了视图模型，所以产生了系统的分层，而数据也得到了有效的隔离，它们之间则是一个间接引用的关系。

那么 MVVM 架构有什么优点呢？
  ·兼容MVC架构
  ·方便测试
  ·方便维护

第一，我们之前说过 MVVM是一种脱胎于 MVC 的架构，可以说是 MVC 的升级。所以 MVC 架构的项目可以非常轻松移植到 MVVM。 
第二，在 MVVM 里面， Controller 不再与 Model 进行绑定了，而通过 ViewModel 使用 Model 进行数据的对象化处理，所以业务与 UI 逻辑彻底分开，减轻了测试压力。如果有 iOS 开发经历，就会感觉到自从 Xcode 7 开始。 iOS 的测试变得越来越完善了。
第三，因为业务、 UI 数据全部独立，所以不管是未来的维护还是系统升级都是非常舒服的。

当然， MVVM 也不是万金油，它也有缺点。
  ·代码量增加
  ·对象调用复杂度增加

比如说使用它，代码量会有明显的增加，这一点在接下来的课程中就会看到。而且对象的调用也会比较复杂，…… 不用太担心！