司道光

【摘 要】WPF為Windows Presentation Foundation縮寫 ，是微軟新一代圖形系統(tǒng)，運行在.NET Framework 3.0架構(gòu)下，為用戶界面、2D/3D 圖形、文檔和媒體提供統(tǒng)一的描述和操作方法?；赪PF技術(shù)雷達動畫設計，動畫演變時間進度與軟件節(jié)點狀態(tài)同步響應設計，可實現(xiàn)雷達掃描實時性。異步方式節(jié)點狀態(tài)監(jiān)測，利用線程獨立于雷達進程運行，為其提供后臺監(jiān)測服務，完成對雷達節(jié)點數(shù)據(jù)轉(zhuǎn)換要求。

【關(guān)鍵詞】WPF，XAML語言 雷達模型 動畫

1 WPF技術(shù)簡介

基于DirectX 9/10技術(shù)的WPF不僅帶來前所未有的3D界面，且其圖形向量渲染引擎也大大改進傳統(tǒng)2D界面，如Vista中半透明效果窗體等都得益于WPF。 WPF相對于Windows客戶端開發(fā)來說，向前跨出很大一步，它提供了超豐富的.NET UI 框架，集成矢量圖形，豐富流動文字支持flow text support，3D視覺效果和強大無比的控件模型框架。

2 WPF技術(shù)雷達實現(xiàn)

XAML標記語言是WPF技術(shù)特色，設計人員利用它能構(gòu)建絢麗多彩UI界面。實際開發(fā)中，設計人員利用Microsoft Expression Blend 工具來設計界面，并生成XAML用戶界面，下面例子是利用XAML構(gòu)建雷達模型，實現(xiàn)雷達動畫，利用C#語言完成監(jiān)控業(yè)務邏輯，實現(xiàn)C#與XAML語言完美結(jié)合，為用戶創(chuàng)建震撼效果的雷達監(jiān)控功能。本案例使用了Mircosoft Visual Studio.NET 2008開發(fā)工具和Microsoft Expression Blend 2設計工具，采用C/S架構(gòu)模式，使用C#語言和Xaml語言。

2.1 雷達監(jiān)控功能描述

雷達圖的圖形界面分三個區(qū)域：區(qū)一表示業(yè)務系統(tǒng)運行正常；區(qū)二表示業(yè)務系統(tǒng)部分關(guān)鍵指標出現(xiàn)告警，系統(tǒng)運行受到影響；區(qū)三表示業(yè)務系統(tǒng)關(guān)鍵指標不可用，系統(tǒng)運行不可用；各系統(tǒng)監(jiān)測狀態(tài)主要通過探針服務器直接進行可用性探測，并參考各業(yè)務核心關(guān)鍵指標，各系統(tǒng)圖標依據(jù)以上三種狀態(tài)進行顏色變化。當某個系統(tǒng)出現(xiàn)問題后（區(qū)域二或區(qū)域三）進行告警，據(jù)問題嚴重程度排序顯示。并展示各業(yè)務系統(tǒng)運行狀態(tài)統(tǒng)計圖。

2.2 雷達建模

這里主要使用Expression Blend工具來生成XAML語言雷達模型，設計時將Canvas元素作為模型容器，內(nèi)部使用大小不同Ellipse元素，轉(zhuǎn)換成路徑，通過漸變填充構(gòu)建出雷達效果背景。

2.3 雷達動畫驅(qū)動

創(chuàng)建雷達動畫，動畫主要針對上述指針模型，圍繞雷達中心點，周而復始進行360度旋轉(zhuǎn)。下面代碼是雷達動畫故事版代碼，每一圈動畫速率為10秒。

//加載雷達故事板Story = （Storyboard）this.Resources["EllipseAnimation"]；

//觸發(fā)時間線過度事件Story.CurrentTimeInvalidated += new EventHandler（story_CurrentTimeInvalidated）；Story.Begin（）；

2.4 雷達掃描同步

雷達掃描同步是動畫演變時間進度與軟件節(jié)點狀態(tài)同步響應設計，利用Storyboard類中故事板對象CurrentTimeInvalidated事件，實現(xiàn)掃描進度與實際監(jiān)控狀態(tài)響應同步。

///節(jié)點狀態(tài)同步監(jiān)測服務類PCTK.App_Code.SystemSoftAnimation Syssoft；

//時間線事件 void story_CurrentTimeInvalidated（object sender， EventArgs e）{Clock myClock = （Clock）sender； if （myClock.CurrentTime ！= null）

double TotalSeconds =Math.Round（myClock.CurrentTime.Value.TotalMilliseconds， 4）；

CountAnimation = （int）TotalSeconds / 10000；

double NowIndex = Math.Round（（TotalSeconds - CountAnimation * 10000） / avgtime， 4）；Syssoft.SetSoftState（NowIndex）； Syssoft.SetSoftXY（）； }}

2.5 節(jié)點狀態(tài)異步監(jiān)測

節(jié)點狀態(tài)監(jiān)測主要是獨立于雷達動畫進程節(jié)點狀態(tài)監(jiān)測，是雷達中表現(xiàn)的被監(jiān)控對象。在本案例中節(jié)點是各應用系統(tǒng)，用獨立線程從中間庫提取應用系統(tǒng)運行狀態(tài)， Thread DataServiceProcess = new Thread（new ThreadStart（GetState））； // GetState狀態(tài)檢測過程DataServiceProcess.IsBackground = true；DataServiceProcess.Start（）；

在本案例中自定義了節(jié)點狀態(tài)監(jiān)測服務類NodeDataService 主要完成節(jié)點狀態(tài)監(jiān)測和節(jié)點分布變化邏輯，是雷達監(jiān)控業(yè)務核心邏輯，通過動畫演變引發(fā)時間線事件，來調(diào)用內(nèi)部方法，實現(xiàn)雷達掃描狀態(tài)實時變化。本案例中還構(gòu)建一個節(jié)點Model對象類，并在NodeDataService 類中定義了該對象泛型集合，實現(xiàn)監(jiān)控進程與動畫UI進程數(shù)據(jù)通信。

2.6 節(jié)點分布

節(jié)點分布是雷達中為各應用系統(tǒng)生成的標點，即圖標，圖標據(jù)系統(tǒng)狀態(tài)進行顏色變化及區(qū)域跳轉(zhuǎn)，所有標點在雷達圓中按排列規(guī)則計算標點坐標，實現(xiàn)均勻分布。

double iangle = Math.Round（n * angle， 3）；

///采用三角計算公式 勾股定理，角度正弦值求標點的半徑長度

Point p = new Point（）； if （iangle <= 90）{p.X = AVGP + Math.Round（dc * Math.Sin（iangle * （Math.PI / 180））， 2） - widths / 2； p.Y = AVGP - Math.Round（dc * Math.Sin（（90 - iangle） * （Math.PI / 180））， 2） - 12；}

else{if （iangle <= 180）{ p.X = AVGP + Math.Round（dc * Math.Sin（（180 - iangle） * （Math.PI / 180））， 4） - widths / 2； p.Y = AVGP + Math.Round（dc * Math.Sin（（90 - （180 - iangle）） * （Math.PI / 180））， 2） - 12； }

else{if （iangle <= 270）{

p.X = AVGP - Math.Round（dc * Math.Sin（（iangle - 180） * （Math.PI / 180））， 2） - widths / 2；

p.Y = AVGP + Math.Round（dc * Math.Sin（（270 - iangle） * （Math.PI / 180））， 2） - 12； }

else{if （iangle <= 360） {

p.X = AVGP - Math.Round（dc * Math.Sin（（90 - （iangle - 270）） * （Math.PI / 180））， 2） - widths ；

p.Y = AVGP - Math.Round（dc * Math.Sin（（90 - （360 - iangle）） * （Math.PI / 180））， 2） - 12；

}return p；}