写过一篇 发表于 2024-8-21 20:11:50

WPF:MVVM的由来与属性绑定的过程

WPF:MVVM的由来与属性绑定的过程

1、MVVM

(1)MVVM是什么?

​                MVVM(Model-View-ViewModel)是一种软件架构设计模式MVVM模式。有助于分离应用步伐的业务逻辑和用户界面层,使得开辟过程更易于管理,同时也便于单位测试。
https://img2023.cnblogs.com/blog/3267782/202408/3267782-20240821184052777-1402057767.pngModel?
现实天下中对象的抽象效果。
View?
View=UI。
View Model?
ViewModel=Model for View。
View 与 View Model之间的沟通:传递数据:数据属性   传递操纵:下令属性。
(2)为什么要使用MVVM?


[*]可测试性:由于业务逻辑被封装在ViewModel中,这使得编写单位测试变得更容易。
[*]解耦:View和Model之间通过ViewModel间接通信,使得它们彼此独立,易于单独修改和维护。
[*]可维护性:清晰的分层结构使得代码更易于理解和维护。
2、数据绑定

现在我们做一个实行,实现一个简单的加法,通过MVVM去实现。
https://img2023.cnblogs.com/blog/3267782/202408/3267782-20240821185037615-289624595.png从图中可以看出,有3个数据属性和2个下令属性。
先创建好各层文件夹如下:
https://img2023.cnblogs.com/blog/3267782/202408/3267782-20240821185306904-1560257119.png
对于数据属性,我们先创建一个NotificationObject类,去继承INotifyPropertyChanged这个接口,这个接口用来是实现UI与数据属性之间双向绑定的。
   https://img2023.cnblogs.com/blog/3267782/202408/3267782-20240821190222246-1622044677.png对于下令属性,我们先创建一个DelegateCommand类,继承ICommand这个接口。
https://img2023.cnblogs.com/blog/3267782/202408/3267782-20240821190911631-378596340.pngViewModel内里的代码如下:
https://img2023.cnblogs.com/blog/3267782/202408/3267782-20240821191135030-495080663.png效果如下:
https://img2023.cnblogs.com/blog/3267782/202408/3267782-20240821191259925-811181210.png
3、分析

如何执行数据属性呢?(ViewModel与View之间双向交互)

数据绑定的过程,INotifyPropertyChanged内里接口是用来干嘛的?
当我们在UI层内里输入1时(此时对应的值已经传到了Input1了),这个时候会执行属性对应的Set内里的方法
https://img2023.cnblogs.com/blog/3267782/202408/3267782-20240821191525398-1094698079.png
然后执行方法内里的事件,将这个属性名字传递到UI,然后UI绑定的对应的属性就随之改变
https://img2023.cnblogs.com/blog/3267782/202408/3267782-20240821191736284-1876944886.png
也就是说:Input1和Inpu2我们只是通过UI去传值,所以我们并不需要去执行RaisePropertyChanged这个方法。于是,当我注释掉内里的RaisePropertyChanged方法时,经过调试与实行,依然可以体现效果。这个过程是从View到ViewModel的过程。
再来说Input3,这个为什么不可以去掉RaisePropertyChanged这个方法呢?因为当我们去执行下令后,Input3在ViewModel内里的值进行了改变,然后通过事件触发关照UI,传递给相对应的属性名字,这样UI层的值就改变了。这个过程是View Model到View的过程。
如何执行下令属性呢?(View到ViewModel)

我们知道,在MainWindow内里我们需要将xaml的上下文与View Model绑定
https://img2023.cnblogs.com/blog/3267782/202408/3267782-20240821193017166-1403864442.png
然而在创建的ViewModel对象内里,就执行了这个下令属性吗?
https://img2023.cnblogs.com/blog/3267782/202408/3267782-20240821193149252-273726222.png
于是,经过调试,我发现在new完后并没有去触发委托内里的Add方法,这是为什么呢?
在初始化阶段,AddCommand被创建并设置好执行的动作(即Add方法),但这并不意味着Add方法被立即执行。只有当用户与UI进行交互时(比如点击按钮),AddCommand才会被触发,从而执行Add方法。
这里注意,下令属性的绑定方法:
https://img2023.cnblogs.com/blog/3267782/202408/3267782-20240821193628740-1503602985.png
数据属性的绑定方法,比如文中的TextBox:
https://img2023.cnblogs.com/blog/3267782/202408/3267782-20240821193720851-721886641.png

免责声明:如果侵犯了您的权益,请联系站长,我们会及时删除侵权内容,谢谢合作!更多信息从访问主页:qidao123.com:ToB企服之家,中国第一个企服评测及商务社交产业平台。
页: [1]
查看完整版本: WPF:MVVM的由来与属性绑定的过程