基于MVVM模式的水资源公报生成系统设计与开发

宋 杰，陈明明，吴 勇

（安徽大学 计算机科学与技术学院， 安徽 合肥 230601）

基于MVVM模式的水资源公报生成系统设计与开发

宋 杰，陈明明，吴 勇

（安徽大学 计算机科学与技术学院， 安徽 合肥 230601）

为解决水资源公报的生成这一现实问题，文中应用了一种新的设计模式--MVVM，提出了一套基于MVVM模式的系统开发方案.介绍了MVVM模式设计思想，以实际项目为例，给出了具体的实现.实例表明，将MVVM模式应用于系统开发，可以成功地将数据、表示和业务逻辑分离，用户界面设计师和应用程序开发者可以并行工作，从而提高系统的可维护性及开发效率，使系统具有结构清晰、可扩展、易测试的特点.

WPF；MVVM；数据绑定

目前，安徽省防汛抗旱指挥系统、水雨情监测系统等一系列水利信息化工程都已经全面启动，有的已初步建成投入使用，并在相关业务应用中发挥了重要作用.但是，由于需要大量的统计以及计算，作为水资源情况的概览——水资源公报的生成一直是水资源管理部门的难题.现在，水雨情等数据库已经建成投入使用，计算机软件开发技术日益成熟，水资源公报生成系统设计与开发也就被提上日程.尽快开展安徽省水资源公报生成系统建设是实现全面落实水利信息化建设总体部署的现实需要.

本文提出了一套结合了WPF和MVVM等技术的水资源公报生成系统设计与开发.文章以下部分将论述MVVM模式和本系统的设计、实现.

1 WPF简介

WPF(Windows Presentation Foundation)是微软推出的新一代显示系统，运行在.NET Framework 3.0及以上版本，用于生成给用户带来震撼视觉体验的 Windows客户端应用程序和浏览器承载的应用程序（见图1）.WPF的核心是一个与分辨率无关且基于向量的呈现引擎.WPF是 Microsoft.NET Framework的子集 ，它使用 Extensible Application Markup Language(XAML)标记语言，XAML是基于 XML的标记语言，实现应用程序外观，同时又用托管语言（例如 C#或 VB）实现其行为代码[1].这种方式是界面描述与程序代码的分离，降低了耦合度，提高了开发效率，而且可以使用多种工具开发XAML外观.WPF在多媒体服务处理中，几乎涵盖了所有的媒体类型：DirectX3D效果、硬件加速，同时在动画处理上也不逊色于 Adobe Flash，WPF使用的 ClearType技术，可以利用硬件加速来提高性能，以减少 CPU负载和系统内存需求.通过使用像素着色器和图形卡的视频内存，ClearType可以更快的呈现文本.当使用动画时，此优势更为明显.

图1 WPF核心组件

2 MVVM 简介

MVVM（Model-View-ViewModel）框架是MVP（Model -View-Presenter）模式与WPF结合产生的一种新型架构框架，它立足于原有 MVP框架并且把 WPF的数据绑定技术与命令绑定技术等新特性揉合进去，以应对客户日益复杂的需求变化[2-4]（见图2）.

图2 MVVM架构图

MVVM模式的推出则彻底解放了 View层，它使用 WPF特有的绑定技术，使用简单的 XAML绑定属性就能够将ViewModel层的数据与命令双向连接到 View层，如图 3.这样便使得应用程序构建 UI非常的容易[5].

图3 View、ViewModel和 Model的交互图

以下因素是 MVVM模式实现的重要条件:

数据绑定机制.数据绑定机制保障了层次之间的通信.通过 View中用 XAML描述的绑定语句和数据上下文语句建立 View层和 ViewModel层的联系，绑定系统将会构建和实现 View层和 ViewModel层的通信[6].

命令(Command).按照 MVVM模式的设计原则，View层中不应该包含业务逻辑，因此每一个 View类的后台代码文件中，除了类构造器中样板代码 InitializeComponent以外，基本没有什么处理事件的方法.但当用户与 View对象上的控件交互，比如点击 Button控件时，程序要能够处理和满足用户需求.这些控件功能实现的保证归功于建立于 View类中控件(例如 Hyperlink，Button，MenuItem)上 Command属性的绑定.

3 实现及示例应用

3.1 实现及示例应用

本系统前台界面采用 WPF编程实现,采用了.NET Framework 4.0平台架构.界面设计应用两种工具:微软的Expression Blend 4(以下简称 EB4)和 Visual Studio 2010.其中 EB4主要负责界面设计,包括控件的布局,背景色,界面的样式及自定义控件等,有助于设计出更加漂亮的界面与动画;Visual Studio 2010主要完成界面上按钮的响应及界面之间的跳转,完成系统与用户之间的信息交互，如图 4、5.

图4 公报生成系统工程结构图

图5 公报生成系统数据导入界面

本系统主要分为数据导入，数据查看与修改，公报输出（如图 6）三个部分.其中数据库使用的是 MICROSOFT SQL SERVER 2008，公报输出是使用插件 ASPOSE.WORDS，这是一款对 WORD操作性能极佳的插件，提供的方法多且全. MVVM框架使用的是 MVVMLight，这是一个轻量级的框架，相比微软提供的 Prism而言，MVVMLight专注于 MVVM的实现，所以更加灵活[7].

图6 公报生成系统生成界面

3.2 使用 MVVM模式的几大好处

（1）低耦合.View和 Model是相互独立的.

（2）可重用性.一个 ViewModel可以绑定到多个 View上.

（3）独立开发.开发团队可以关注创建健壮的 ViewModel类，而设计团队可以关注设计界面友好的 View.要融合两个团队的输出，只需要在 View的 XAML上进行正确的绑定即可.

（4）可测试性.由于模块与模块之间的联系少了，便于将模块独立出来，放入测试环境进行各种测试.

4 结束语

MVVM模式是随着微软.Net Framework以及 WPF的发展而来的，因此它充分利用了 WPF的 XAML和 Data Binding的特性，使得系统体现了“高内聚、低耦合”的原则.应用结果表明，MVVM模式很好地将数据、表示和业务逻辑分离开来，使得在开发过程中设计师和代码编写员中可以很好地并行工作，有效地提高了系统的可维护性及开发效率，值得应用和推广.

〔1〕Moliliang．WPF_ 百 度 百 科 ［EB/OL］．2008．http://baike. baidu.com/view/292311.htm.

〔2〕Li Changping，Peng Guojun．Chaos in Chen’s system with afractional order ［J］．Chaos， solitons and fractals，2004，22(2):443 － 450．

〔3〕陈明，李猛坤，张强．一种基于扩展 MVVM 模式的 SaaS面向 服务计算 模 型 ［J］．微电子学 与 计算机，2010，27(8)：27－30．

〔4〕Building Enterprise Applications with Windows(R)Presentation Foundation and the Model View ViewModel Pattern-New from Microsoft Press.Targeted News Service(Mar 23,2011),p.n/a.2011.

〔5〕程国雄，胡世湖．数字化图书及英语交互学 习 RIA 平 台的研究［J］．计算机工程与设计，2010，31(13)：3103-3107.

〔6〕J.Sm ith."WPF Apps With The Model-View-View-Model Design Pattern,"in MSDN Magazine,Feb. 2009.

〔7〕Laurent Bugnion．MVVM Light Toolkit［EB/OL］．2009．http://galasoft.ch/mvvm/.

TP311

A

1673-260X（2014）08-0009-02