MVVM模式原理分析

http://www.cpiso.cn/jsyj/ghxx/2012/5/18/373.shtml

摘要:为解决适用于RIA应用系统开发的设计模式的问题,提出引出MVVM模式。该模式由视图、视图模型、模型三部分组成,通过实现INotifyPropertyChanged接口,解决模型到视图模型的数据传导问题,使模型独立于视图模型,通过实现ICommand接口,解决视图中的事件绑定问题,结合数据绑定,使视图模型独立于视图。通过实现 Mediator模式(中介者模式)完成模型与模型之间的交互,并在一定程度上减少模型与模型之间的耦合度。

  关键词 RIA Silverlight Model-View-ViewModel 中介者模式

  

1引言

  RIA(Rich Internet Application)技术是近年来发展较快的实现Web2.0应用开发的技术,与传统的Web应用相比,RIA技术更加追求更丰富的用户体验。适应这种变化,RIA应用系统开发过程的分工要求更加细致,一部分人负责界面设计,一部分人负责业务逻辑设计。这种分工写作给软件设计模式带来新的要求,一方面要保持系统易于理解和维护、良好的扩展性和低耦合度,另外一方面要追求业务逻辑、呈现逻辑和UI逻辑的分离,使得界面设计和程序控制开发可以同步进行。目前在RIA应用系统中开发使用比较多的有MVC(Model-View-Controller)、MVP(Model-View-Presenter)等设计模式,但是这些模式并不能完全将UI设计分离。为此将呈现逻辑从视图中独立出来,同时将界面数据从模型中独立出来,组成视图模型(ViewModel)模块,形成了MVVM(Model-View-ViewModel)模型,我们可以认为MVVM是MVC的变种。MVVM模式不但能够实现UI设计的分离,而且能充分发挥RIA技术中的数据绑定的技术和特点,提高软件的复用性。

  

2.Silverlight简介

  Silverligh是由微软推出的跨浏览器、跨平台的Web前段应用开发解决方案,是微软RIA策略的主要应用开发平台之一,以浏览器的外挂组件方式,提供Web应用程序中多媒体与高度交互性前端应用程序的解决方案,同时也是微软UX(用户体验)策略中的一环,也是微软视图将美术设计和程序开发人员的工作明确切分与协调合作的发展应用程序的尝试之一。

  

3.MVVM简介

  MVVM模式是Model-View-ViewMode模式的简称。由视图(View)、视图模型(ViewModel)、模型(Model)三部分组成,结构如下图。通过这三部分实现UI逻辑、呈现逻辑和状态控制、数据与业务逻辑的分离。

  


图1 MVVM模式架构图

  使用MVVM模式有几大好处:

  1. 低耦合。View可以独立于Model变化和修改,一个ViewModel可以绑定到不同的View上,当View变化的时候Model可以不变,当Model变化的时候View也可以不变。

  2. 可重用性。可以把一些视图的逻辑放在ViewModel里面,让很多View重用这段视图逻辑。

  3. 独立开发。开发人员可以专注与业务逻辑和数据的开发(ViewModel)。设计人员可以专注于界面(View)的设计。

  4. 可测试性。可以针对ViewModel来对界面(View)进行测试

  

4. 模型、视图、视图模型的分工

  1. 视图(View)

  视图负责界面和显示。它通过DataContext(数据上下文)和ViewModel进行数据绑定,不直接与Model交互。 可以绑定Behavior/Comand来调用ViewModel的方法,Command是View到ViewModel的单向通行,通过实现Silverlight提供的IComand接口来实现绑定,让View触发事件,ViewModel来处理事件,以解决事件绑定功能。

  2. 视图模型(ViewModel)

  视图模型主要包括界面逻辑和模型数据封装,Behavior/Command事件响应处理,绑定属性定义和集合等。它是View和Model的桥梁,是对Model的抽象,比如:Model中数据格式是“年月日”,可以在ViewModel中转换Model的数据为“日月年”供View显示。

  实现视图模型需要实现Silverlight提供的接口INotifyPropertyChanged, INotifyPropertyChanged接口用于实现属性和集合的变更通知(Change Notifications)。使得在用户在视图上所做的操作都可以实时通知到视图模型,从而让视图模型对象有的模型进行正确的业务操作。

  View的代码隐藏(Code-Behind)部分可能包含界面逻辑或者应用逻辑的代码,这些代码会很难进行单元测试,应根据具体情况尽量避免。

  

  图2 View、ViewModel和Model的交互图

  

  Mediator模式

  对不同View、ViewModel之间的参数传递,一般通过事件实现数据传递,也可以定义全局静态变量来进行数据共享,在MVVM里,我们可以使用Mediator模式(中介者模式)进行跟优雅的处理。可以简单得理解为不同的ViewModel或者View需要进行了操作之后,需要其他ViewModel或者View进行相应的其他操作或者数据更新,而中介类可以准确得将更新准确得通知到正确的ViewModel,同时中介者并不关心ViewModel或者View的任何操作或者数据更新。

  

  图3 ViewModel通过Mediator模式与其他ViewModel的交互图

  

  3. 模型(Model)

  Model与MVC模式一样,Model用于封装与应用程序的业务逻辑相关的数据以及对数据的处理方法。它具有对数据直接访问的权利,例如对数据库的访问,Model不依赖于View和ViewModel,也就是说,模型不关心会被如何显示或是如何被操作,模型也不能包含任何用户使用的与界面相关的逻辑。Model在实际开发中根据实际情况可以进行细分。比如在广州市城乡规划资源平台就将Model将Service和Reposiroty结合为WCF服务由ViewModel进行调用。

  

  图4 Model的细分层次关系

  

  为了更好的说明MVVM模式,图5是广州市城乡规划资源平台实现MVVM模式设计的类结构图。

  


图5 MVVM模式类结构图

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值