基于UC客戶端的MVVM應用與研究

呂磊 楊雪 朱禮鵬 謝俊虎 金元

（1 國網眉山供電公司，四川眉山 511402）（2 國網洪雅供電有限責任公司，四川成都 620365）

基于UC客戶端的MVVM應用與研究

呂磊1楊雪1朱禮鵬1謝俊虎1金元2

（1 國網眉山供電公司，四川眉山 511402）（2 國網洪雅供電有限責任公司，四川成都 620365）

針對統一通信客戶端軟件的界面控制邏輯和通信業務邏輯存在的耦合問題，通過分析MVVM的模式結構和工作原理，提出了應用MVVM模式構建統一通信客戶端軟件的設計思路和解決方法，以實現業務邏輯和界面間的松耦合。重點分析了MVVM的模型、視圖、視圖模型的三層架構，以及數據綁定和命令機制等特性；在對語音業務流程分析的基礎上，應用MVVM模式進行了實現，對各層的實現做了解析和說明。并討論了如何利用視圖模型進行單元測試。

MVVM ViewModel統一通信WPF數據綁定

1 引言

為了支持各種通信業務，統一通信（Unified Communication,UC）客戶端往往將業務封裝成為不同的服務，通過訂閱在通信過程中產生的各種事件完成數據處理和控制邏輯，同時將結果反饋給用戶界面（User Interface,UI）。眾多分散的控制和事件處理邏輯，導致了用戶界面與業務邏輯間具有較強的耦合性，用戶界面的呈現邏輯復雜且難以維護。尤其是當用戶界面進行重構或修改時，往往需要對程序進行多處修改，限制了系統的可維護性和可擴展性。

隨著微軟WPF(Windows Presentation Foundation)技術的出現，其革命性的創建軟件方式和全新的Windows圖形用戶界面技術，使其越來越成為主流的開發選擇[1,2]。同時，MVVM模式（Model View ViewModel,MVVM）利用WPF的新特性和對界面的封裝，更加徹底地實現了業務邏輯和界面的分離，能夠很好解決統一通信系統客戶端的復雜UI邏輯的問題。

2 MVVM模式分析

2.1 MVVM的發展

從出現用戶界面開始，就出現了與之相關的設計模式，目標是實現界面和業務間的松耦合，使設計人員專注于設計良好的界面，開發人員專注于業務邏輯的實現。較早出現的MVP模式[3]（Model View Presenter,MVP）目前已被廣泛使用到UI開發平臺上，由模型Model提供數據，視圖View負責顯示，展示器Presenter負責邏輯處理。由于展示器包含了對視圖的渲染，二者進行頻繁地交互，使得展示器與特定的視圖的聯系過于緊密，一旦視圖變更，那么展示器也往往需要變更。

2004年，Martin Fowler提出了PM模式（Presentation Model，PM），該模式在MVP基礎上分離了視圖中的動作和狀態，并通過對視圖的抽象創建表示模型，使視圖僅僅成為表示模型的一個呈現。但是，該模式的表示模型負責視圖的狀態更新和同步，導致作為表示模型的類比較龐大和復雜，較難維護。

2005年，John Gossman在MVP和PM的基礎上提出了MVVM模式[4,5]。與MVP中的展示器Presenter不同，MVVM中的視圖模型ViewModel并不需要對視圖的引用，也不需要維護視圖與視圖模型的交互。而MVVM與PM不同之處在于，雖然都對視圖做了抽象，但Fowler提出的PM是與UI平臺無關的抽象，而MVVM是利用WPF的核心特性（數據綁定和命令機制）進行了簡化，是專門針對WPF和Silverlight平臺[6]提出的。在MVVM模式中，視圖View不知道模型Model的存在，模型Model也不知道視圖模型ViewModel和視圖View的存在，充分實現了界面與業務邏輯的分離。

視圖模型ViewModel是MVVM模式的核心內容，連接了模型Model和視圖View，實現數據與呈現的同步，并執行來自視圖的動作。視圖模型通過對視圖的抽象，以數據屬性的形式向視圖提供必需的數據，以命令屬性的形式向視圖提供執行的操作。而視圖模型的數據和命令屬性，可以認為是對模型的數據和業務的再次封裝，從而實現了模型和視圖之間的松耦合。

總之，在MVVM模式中視圖僅需考慮良好的數據呈現和友好的交互方式；模型則專注于建立數據和業務模型，實現業務邏輯；視圖模型則承上啟下，實現了簡單有效的數據同步以及靈活的命令操作。

3 MVVM工作原理

2.2 MVVM模式結構

實現MVVM模式的關鍵是利用了WPF的2個重要特性數據綁定以及命令機制。

優數據綁定

數據綁定是在用戶界面和業務數據之間建立連接的過程，而進行數據綁定的關鍵是使用Binding對象，該對象將源屬性和目標屬性粘在一起，并在兩者間建立了合適的通信機制。只需要進行一次綁定，那么在清除綁定前，就會由這個綁定對象負責所有的同步工作，如圖2所示。

MVVM模式由模型（Model）、視圖（View）和視圖模型（ViewModel）三部分組成，其體系結構如圖1所示。

模型Model通過建立數據和業務模型，負責系統中的核心數據和業務處理邏輯。通常該層下面還包括了一個數據訪問層，負責完成對底層數據訪問的封裝，如對數據庫、數據文件的操作等。

圖1 MVVM模式體系結構

視圖View是系統與用戶的圖形接口，即交互界面，在WPF中表現為XAML文件。在視圖上綁定視圖模型的特定屬性，實現數據同步和命令響應，這些屬性是在視圖模型中暴露的模型的數據和業務。視圖和視圖模型屬性間的綁定是通過設置視圖模型對象到視圖的DataContext屬性實現的。如果視圖模型中的屬性值發生變化，新值通過綁定對象自動傳播給視圖。當用戶在界面上點擊按鈕時，一個位于視圖模型上的Command被執行請求的動作。

圖2 屬性間的綁定

目標屬性必須是依賴屬性，利用內建的傳遞變更通知能力實現更新時自動通知源屬性，在WPF的UI控件中大部分的屬性為依賴屬性。源屬性需要實現INotifyPropertyChanged接口來通知更新目標屬性，從而實現數據同步。數據綁定使得屬性間的數據同步更新變得異常簡單，僅需要在XAML文件中將源屬性綁定到對應的控件屬性上即可。

悠命令機制

只使用數據綁定，還無法做到用戶界面的友好交互，因而，需要WPF提供的內建的命令機制支持。命令表示的是與用戶界面分離的動作，相對于控件的事件，更為抽象和松耦合。將實現了ICommand接口的命令屬性綁定到視圖中控件的Command屬性上，當控件的命令被觸發時，命令屬性所表示的操作將被執行；當命令屬性對應的操作失效時，就會禁用該控件，從而自動實現了命令屬性與控件狀態的同步。

4 MVVM模式的應用

在統一通信系統的客戶端，存在著眾多分散的控制和事件處理邏輯，對于用戶界面的顯示和控制邏輯也相對更復雜。為此，使用MVVM模式構建統一通信系統客戶端可以大大簡化對界面的呈現控制，避免將界面呈現控制代碼嵌入到通信業務邏輯中。下面以語音通信為例，分析MVVM模式的應用。

4.1 流程分析

統一通信的客戶端既可以作為語音呼叫者，也可以作為被呼叫者。從一方發起語音呼叫開始，再到語音通話結束，在整個呼叫和通話過程中接收不同命令，呈現出不同的呼叫流程和通話狀態。以發送語音呼叫為例，其流程如圖3所示。在發送出語音呼叫后，還有可能取消呼叫命令；在判斷是否建立通話時，還需要判斷是否接聽、拒接或呼叫超時；在通話中還可能出現保持通話以及恢復通話的命令；在通話完成后還要結束通話。

圖3 語音呼叫流程

4.2 應用設計

對語音呼叫流程進行分析，從呼叫開始到整個過程結束，包括呼叫者、被呼叫者、語音通話等數據模型；發送語音呼叫、取消語音呼叫、保持通話、恢復通話、結束通話等命令；對于界面呈現包括呼叫者身份信息、被呼叫者身份信息、語音通話狀態等。使用MVVM模式實現該業務，其構造的類圖如圖4所示，圖中僅列出了關鍵類、屬性和操作。

在類圖中可以清晰看出MVVM模式的結構，視圖類AudioSessionView、視圖模型類AudioSessionViewModel以及模型類AudioSession。視圖AudioSessionView對應著窗口文件AudioSessionView.xaml，即使用XAML描述的界面，只需要在初始化時完成對AudioSessionViewModel的引用，并在XAML文件中進行數據和命令綁定。視圖模型AudioSessionViewModel引用了AudioSession對象，并將暴露給視圖的數據和命令封裝為屬性，如CallerDisplayName、CalleeDisplayName、DialCallCommand、HangupCommand等，作為視圖模型層還可以引用多個模型對象，以封裝不同的數據和業務邏輯。模型AudioSession是基礎的數據模型，包含了呼叫者AudiaoCaller和被呼叫者AudioCallee，同時包含了業務處理邏輯MakeCall、HangupCall等，可由視圖模型完成調用。

圖4 語音呼叫類圖

4.3 關鍵實現說明

在實現MVVM模式時必須滿足以下條件，才能進行正確的數據同步更新和命令響應。

①視圖模型必須實現INotifyPropertyChanged接口，該接口含有一個PropertyChanged事件。AudioSessionViewModel通過父類實現INotifyPropertyChanged接口，并提供觸發事件的方法OnPropertyChanged；

②在視圖模型AudioSessionViewModel中封裝數據屬性時，在set方法中調用OnPropertyChanged方法，并傳入正確屬性名稱；

③在視圖模型AudioSessionViewModel中封裝命令屬性時，必須返回ICommand對象；在RelayCommand類中實現ICommand接口，AudioSessionViewModel的命令屬性僅需要生成和返回RelayCommand對象，并通過其構造函數傳遞命令執行的代理方法；

④在視圖AudioSessionView中對需要控制顯示的控件綁定數據屬性；

⑤在視圖AudioSessionView中對需要響應命令的控件綁定命令屬性。

5 利用ViewModel實現單元測試

MVVM模式不僅提供了界面和業務邏輯的分離，它的視圖模型ViewModel也非常易于進行單元測試。在使用MVVM模式開發WPF程序時，整個應用程序的交互邏輯在一組ViewModel類中，并且不依賴任何UI對象，通常可以不用考慮界面是否已經實現，就可以完成單元測試。利用Visual Studio提供的單元測試機制，可以輕松編寫測試程序，自動執行完成單元測試，從而提高了開發和測試的效率。

6 結束語

在UC系統客戶端應用MVVM模式，可以使開發人員專注于關鍵的業務實現，而不用關心繁雜的界面邏輯，提高了程序的可測試性和可維護性，充分體現了軟件設計“高內聚，低耦合”的原則。但是，由于MVVM模式過渡依賴WPF的特性，使它的應用范圍受到了嚴格的限制。盡管如此，在合適的場景下應用MVVM模式，將最大程度地提升軟件的質量和擴展性。

[1]琚彬.基于WPF平臺的自定義控件開發[D].西安電子科技大學,2008.

[2]徐滔.WPF控件設計綜述[J].現代計算機(專業版),2009(7): 102-105.

[3]王建平.MVC&MVP集成模式在RIA開發中的應用[J].軟件導刊,2009(7):115-117.

[4]劉立.MVVM模式分析與應用[J].微型電腦應用,2012(12): 57-60.

[5]李猛坤,陳明.一種基于擴展MVVM模式的面向服務軟構件模型[J].科學技術與工程,2011(10):2349-2352.

[6]李龍澍,華驍飛.Silverlight下的MVVM模式的應用[J].計算機技術與發展,2013(12):203-207.

Application and Research on MVVM Based on UC Client

LV Lei1,YANG Xue2,ZHU Li-peng1,XIE Jun-hu1,JIN Yuan2
(1 State Grid Meishan Power Supply Company,Meishan Sichuan 511402,China; 2 State Grid Hongya Power Supply Company,Chengdu Sichuan 620365,China)

Aiming at the coupling problem in the interface control logic and communication service logic of UC client software,the design ideas and solutions for constructing UC client software by MVVM mode are presented on the basis of analyzing the mode structure and operating principle of MVVM,so as to implement the loose coupling between service logic and interface.The features of MVVM such as three-layer architecture-model,view and view model,as well as data binding and command mechanism are analyzed in detail;on the basis of analyzing voice service flow,the implantation is achieved by MVVM mode,and the analysis and explanations for all layers are made.The solution of unit test by using view model is discussed.

MVVM;View Model;UC;WPF;data binding

TP311.1

A

1008-1739（2015）05-55-4

定稿日期：2015-02-12