MVVM在過程質(zhì)量監(jiān)控系統(tǒng)中的應(yīng)用

郭樹巖

( 遼寧科技學(xué)院 應(yīng)用技術(shù)學(xué)院，遼寧 本溪 117004 )

MVVM在過程質(zhì)量監(jiān)控系統(tǒng)中的應(yīng)用

郭樹巖

( 遼寧科技學(xué)院 應(yīng)用技術(shù)學(xué)院，遼寧 本溪 117004 )

研究了微軟的MVVM(Model-View-ViewModel)特點(diǎn)和優(yōu)勢,并結(jié)合本鋼過程質(zhì)量監(jiān)控系統(tǒng)，通過WPF+WCF開發(fā)的客戶端和服務(wù)器端的應(yīng)用程序，以及MVVM的內(nèi)部結(jié)構(gòu)的模塊設(shè)計(jì)，將其拓展為具有通用功能的自主模塊，使每個(gè)WPF UI(開發(fā)界面)都具有相同的功能，更便于使用中進(jìn)行取舍。

WPF；UI；MVVM；監(jiān)控系統(tǒng)

Model-View-ViewModel是一種類似于MVC架構(gòu)模式，主要在WPF、Silverlight和WP7開發(fā)里使用，它的目標(biāo)是從視圖層移除幾乎所有代碼隱藏(code-behind)。交互界面的設(shè)計(jì)師可以專注于使用XAML表達(dá)用戶對操作界面的需求，然后創(chuàng)建和視圖模型的綁定，而視圖模型則是由具有編寫高級語言的應(yīng)用程序開發(fā)者進(jìn)行開發(fā)和維護(hù)的〔2〕。如圖1所示

圖 1 標(biāo)準(zhǔn)MVVM架構(gòu)

1 MVVM結(jié)構(gòu)

MVVM模式廣泛應(yīng)用在WPF項(xiàng)目開發(fā)中，使用此模式可以把UI和業(yè)務(wù)邏輯分離開，使UI設(shè)計(jì)人員和業(yè)務(wù)邏輯人員能夠分工明確。

MVVM模式是根據(jù)MVP模式來的，可以簡單的說，MVVM模式就是WPF版的MVP模式。MVP模式，MVC模式，這幾個(gè)模式都是為了抽離出UI邏輯和業(yè)務(wù)邏輯〔2〕，如圖2所示。

圖 2 MVVM模式演變

2 本鋼過程質(zhì)量監(jiān)控系統(tǒng)中MVVM的特點(diǎn)

MVVM是WPF(Windows Presentation Foundation)開發(fā)人員的專用語言，因?yàn)樗苓m合WPF平臺，WPF被設(shè)計(jì)使它很容易使用MVVM模式去構(gòu)建應(yīng)用程序。實(shí)際上，微軟內(nèi)部也用MVVM去開發(fā)WPF應(yīng)用程序，如Microsoft Expression Blend，而核心WPF平臺正在建設(shè)中。WPF的很多方面，例如Telerik中的各種控件，利用強(qiáng)壯的從狀態(tài)和行為中分離顯示，我們設(shè)計(jì)的MVVM的主要特點(diǎn)如下：

2.1 WPF使得MVVM成為一個(gè)強(qiáng)大的模式的一個(gè)最重要的方面是數(shù)據(jù)綁定

通過一個(gè)View到Viewmodel的綁定屬性，使兩者之間得到松耦合，完整地移除了在ViewModel里直接寫代碼更新一個(gè)view的需要。數(shù)據(jù)綁定系統(tǒng)也支持輸入驗(yàn)證，提供了傳遞驗(yàn)證錯(cuò)誤到view的標(biāo)準(zhǔn)方式。WPF使得這個(gè)模式如此有用的其他兩個(gè)特征是數(shù)據(jù)模板和資源系統(tǒng)。數(shù)據(jù)模板應(yīng)用View到ViewModel對象顯示在用戶界面。你能在XAML里聲明模板，讓資源系統(tǒng)為你在運(yùn)行時(shí)自動地加載和應(yīng)用這些模板。

2.2 存儲數(shù)據(jù)的集合是ObservableCollection

ObservableCollection做為viewModel的依賴而不是list，也不是dictionary，而是ObservableCollection。ObservableCollection 為WPF窗口提供你的數(shù)據(jù)集合，class T 為Entity Framework生成的數(shù)據(jù)庫中表的實(shí)體和手動創(chuàng)建的某一個(gè)類。因每一個(gè)WPF控件(包括“窗口”)都有一個(gè) DataContext 屬性，集合控件都有一個(gè)“ItemsSource”屬性用于綁定。

2.3 命令綁定依賴屬性，異步執(zhí)行數(shù)據(jù)的存取和更改操作

“INotifyPropertyChanged”接口將被廣泛的的用于GUI和你的代碼之間的通信，當(dāng)數(shù)據(jù)有任何改變的時(shí)候，通過ICommand接口調(diào)用async void OnCommand() 執(zhí)行WCF實(shí)現(xiàn)的異步操作。

2.4 使用計(jì)時(shí)器與進(jìn)度條的步進(jìn)值進(jìn)行捆綁，動態(tài)地顯示數(shù)據(jù)存取進(jìn)度

3 MVVM的代碼實(shí)現(xiàn)步驟

按如下次序創(chuàng)建適用于本鋼過程質(zhì)量監(jiān)控系統(tǒng)中MVVM，其中包括計(jì)時(shí)器、表名、數(shù)值型字段、鋼種、查詢的起止日期、用于各類圖表輸出的X軸和Y軸、進(jìn)度條值、數(shù)據(jù)集等。

3.1 數(shù)據(jù)源的創(chuàng)建

使用SqlServer 2012數(shù)據(jù)庫，使用Entity FrameWork 的Reverser Engineer First Code 創(chuàng)建STL_10_SQLContext和表的實(shí)體，如表名即為實(shí)體名。

3.2 使用Telerik控件的radgridview進(jìn)行數(shù)據(jù)顯示，其關(guān)鍵代碼如下〔1〕：

ItemsSource="{Binding myQueryResult, Source={StaticResource commonData }}" />

3.3 其ViewModel大致的創(chuàng)建過程如下：

以NotificationObject為基類派生一個(gè)BPQM_COMM_ViewModel類。

public class : NotificationObject

初始化時(shí)，生成計(jì)時(shí)器：

this.timer = new DispatcherTimer();

this.timer.Interval = TimeSpan.FromMilliseconds(100.0);

this.timer.Tick += new EventHandler(this.Timer_Tick);

創(chuàng)建依賴屬性如表名：

private string _TableName;

radGridView 的數(shù)據(jù)源是ObservableCollection〈〉

private ObservableCollection _myQueryResult;

執(zhí)行查詢填充網(wǎng)格數(shù)據(jù)代碼〔1〕：

private async void OnDateQuery()

{

try

{

using (Service1Client client = new Service1Client()) //WCF

{

DateTime tmS = new DateTime();

timer.Start();

tmS = DateTime.Now;

string sDate = string.Format("{0:yyyyMMdd}", StartDate);

string str = string.Format("{0},{1},{2},{3},{4}", sDate, eDate, sWorkshop, sGrade, sNumberField);

var aa = await client.getAnyChartDataRangeAsync(sWorkshop, "PONO", sNumberField, sDate, eDate, sGrade, "1");

myQueryResult = new ObservableCollection(aa);

tmE = DateTime.Now;

TimeSpan tm = tmE - tmS;

MyDuration = tm.Seconds;

ResultMsg = "煉鋼轉(zhuǎn)爐數(shù)據(jù)查詢成功";

}

}

catch (Exception ex)

{

Console.WriteLine(ex);

_ResultMsg = "程序出現(xiàn)異常";

}

}

4 結(jié)語

隨著系統(tǒng)的規(guī)模不斷發(fā)展 ，對系統(tǒng)進(jìn)行有效分布式處理使用了WCF技術(shù)，提高資源利用率的要求越來越高，因此從客戶/數(shù)據(jù)庫方案轉(zhuǎn)變到三層客戶/應(yīng)用系統(tǒng)/數(shù)據(jù)服務(wù)器結(jié)構(gòu)是業(yè)界發(fā)展的趨勢。本文討論了MVVM技術(shù)，并分析了MVVM的開發(fā)模式和特點(diǎn)，包括異步請求、WPF、WCF和實(shí)體框架的生成技術(shù)使得代碼簡單化，圖形界面更加美觀。

〔1〕(美)麥克唐納. WPF編程寶典〔M〕 . 北京：清華大學(xué)出版社，2010.

〔2〕劉立．MVVM 模式分析與應(yīng)用〔J〕. 微型電腦應(yīng)用， 2012，28( 12) : 57-60.

ApplicationofMVVMtotheMonitoringSystemofProcessQuality

GUO Shu-yan

(SchoolofAppliedTechnology,LiaoningaianstituteofScienceandTechnology,Benxi,Liaoning, 117004,China)

The paper studies the performance and Superiority of MVVM developed by Microsoft, and expands it to the module with general function on its own initiative, by using the applied program for customer and servicer. So as every WPF UI have the same function, as to conveniently use.

WPF; UI; MVVM; Monitoring system.

1008-3723(2017)04-001-02

10.3969/j.issn.1008-3723.2017.04.001

2017-06-20

郭樹巖(1963-)，男，遼寧本溪人,遼寧科技學(xué)院應(yīng)用技術(shù)學(xué)院副教授，研究方向:自動化技術(shù)。

TB497

：A