基于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