WPF之路——從HelloWorld到WPF World

文章目錄

• 什麼是Hello World
• Hello World有什麼
• 發現Xaml
• 元素樹
• 基元素
• 屬性
• 樣式和模板
• 資源
• 學到了什麼
• 如何學習
• 下一步該做什麼

前言

　　有人說到，學習任何一種編程最困難的部分是“Hello World”。這一看似乎很可笑，仔細想來卻未必。平時很多我們自認為很簡單的東西也許恰恰是最困難的東西，比如C#中的一些基本概念，我們天天都在用，可你真的都理解他們嗎？！對很多人來說恐怕要打個問號了。

　　最近開始學習使用WPF，WPF是什嗎？網上有很多文章，在此就不贅述了。

　　一切還是從“Hello World”開始，然而因為有了上面的經曆，一切真的都變得不同了。

Hello World

　　如題，在優秀的IDE環境中，做一個簡單的Hello World應用程式是如此的簡單，僅僅用滑鼠拖一個控制項，在屬性欄中輸入“Hello World”，然後F5，OK，一切都完成了。　　

這一切真的太簡單了，就跟當年學習VB或C#一樣，看起來沒有任何不同，然而現在你還會說VB的Hello World與C#的Hello World是一回事嗎？！答案很顯然。

什麼是Hello World

　　有個笑話講到，一個退休的程式員，退休後練習書法，提筆一揮，紙上赫然出現一行字——Hello World。第一個寫“Hello World”的人也許是個天才。一粒沙中看世界，這個簡單到一行代碼甚至沒有代碼就能實現的程式向初學編程的人開啟了一道便捷之門，給初學者足夠的空間去思考有限的問題，一窺其後萬千變化的世界。

Hello World有什麼　　Shift+F5，停止程式運行，讓我們一起看看這個程式中有什麼。先看檔案結構：

在方案總管中，我們不難發現與WinForm相比，WPF程式多出了一種檔案Xaml。先開啟我們熟知的.cs代碼檔案，發現裡面空無一物， 甚至看不到承載Hello World的控制項，結合Asp.Net的經驗，我們在Xaml中發現了 <Grid> <TextBlock Text="Hello World" /> </Grid> 由此我們可以認為微軟通過結合Asp.Net與WinForm的優點打造了全新的，而相比二者，WPF最核心的部分便是Xaml。

發現Xaml

　　那麼什麼是Xaml呢？MSDN中解釋到：可擴充應用程式標記語言 (XAML) 是宣告式應用程式編程標記語言，WPF提供對可擴充應用程式標記語言 (XAML) 語言支援，使WPF得以實現，這個解釋有點抽象。事實上，如果有Asp.Net基礎，我們則可以簡單的認為WPF是以Asp.Net方式開發WinForm；如果有標記語言的基礎，則可以簡單認為Xmal以標記語言的方式實現WPF中的UI，然後由微軟把UI和代碼聯絡起來；如果什麼都沒有，那就把看到的網頁關了，好好學習吧^_^。

開啟WPF World元素樹

　　我們知道，WPF的核心是Xaml。Xaml想做網頁一樣，將UI分割為不同大小的塊，以一定方式組合，便成了我們看到UI基本架構，然後在通過美工的合作，成為最終呈現在我們面前的使用者互動介面。Xaml中的每種元素代表UI上的一個基本元素，那麼Xaml是以何種方式組織這些元素，並最終構成向使用者交付的UI呢？看。

，WPF以有序的方式按樹形結構組合每個介面元素。介面中每個元素都有唯一的父節點，並可能有多個子節點。圖中第3部分就是Hello World樣本的樹結構。當然，WPF文檔結構遠比例子中複雜的多，不過作為入門，這些不在今天的討論範圍呢。

基元素

　　現在改動一下程式，我們添加一個按鈕，點擊該按鈕，顯示一個訊息框。

在上面我們瞭解到WPF中Xaml負責UI，cs負責實現邏輯(顯示訊息框)。那麼它們是如何關聯起來的呢(請注意圖中藍線)？原來在WPF中，凡是與UI元素類均從一個基元素繼承—— DependencyObject而來，這些類分別在cs和xaml中有相同簽名的實現。我們在開發過程中只需要取相同的名字，WPF會自動替我們完成關聯工作。

注意：如果在C#代碼中將button1_Click改為OnBtnClick，Xaml中不會自動改

屬性

　　現在仔細觀察一下IDE自動產生的程式碼，如果Asp或HtmlXml一樣，我們會發現每個元素標籤，除了標籤名外都包含一些屬性。除了在C#中我們熟知的Text="Hello World"，Name="button1"外還包含Asp.NET中常見的Margin屬性(用於說明Button在父容器中與其他元素的間隔距離)。前者與C#中的屬相相同，後者則不屬於對象本身，依賴於父元素，在WPF中成為附加屬性(比如，如果Button不在一個父元素(Grid)中，那麼它與其他元素就無所謂相對距離了)。

　　在上小節中，我們知道WPF負責將Xaml元素與C#中的類一一對應起來，在Xmal中改變Button.Height的值時，cs中同樣會做相應的改動，那麼它們是如何?的呢？原來WPF提供了一套屬性系統，該系統提供一種方法來基於其他輸入的值計算屬性值。有了這套系統，我們在Xmal與cs之間訪問屬性時WPF會自動通知彼此，支援這些服務的屬性通常稱為相依性屬性。

樣式和模板

　　想象一下我們繼續修改Hello World程式，如果需要添加10個或100個相同Button，這些Button針對不同的使用者有不同的樣式。那麼我們該如何支援這些樣式呢？是在xmal中一個一個的寫嗎？當然不可能。既然Xaml類似於Asp.Net，那麼我們不難想到網頁中常用的CSS，在WPF中同樣有屬於Xaml的Css，並且更強大，那就是樣式和模板。

　　WPF樣式設定和模板提供了一套功能（樣式、模板、觸發器和示範圖板），讓我們能夠使用這些功能建立更好的視覺效果，也可以為建立統一外觀，並且能夠在應用程式內部和應用程式之間共用這些樣式和模板，從而提供工作效率。

資源

　　在上小節中，我們提到了樣式和模板，這些在WPF中屬於資源。除此之外，WPF中的資源也包括C#中我們通常理解的檔案，多媒體，資料等。只是在WPF中資源可分為靜態資源和動態資源。從名字上很好理解它們的區別，一個效能好點，一個更靈活。做為入門，在使用時，是否需要即時更新資源可作為我們選擇靜態資源和動態資源的依據。

總結學到了什麼

　　通過上面一系列描述，我們發現了WPF中的一些基本概念：Xaml，元素樹，基元素，屬性，樣式和模板，資源。這些都是初學WPF時最早接觸到的內容。因篇幅所限，只能對這些內容做一個大概的介紹，使得我們能夠從中一窺WPF的樣貌。但做為初學者，充分理解把握這些內容是進一步學好WPF的關鍵。

如何學習

　　在上面的學習過程中，我們不難發現，學習任何一門技術都要從最簡單的地方開始，然後通過仔細觀察，發現問題，思考問題，並最終解決問題。其中最重要的是要勤于思考，而不是浮於表面。

下一步該做什麼

　　今天我們從整體上對WPF有個粗略的瞭解，並發現了一些基本概念。雖然還有很多重要的內容如資料繫結，事件路由，執行緒模式等沒有涉及到，但是本著貪多嚼不爛的原則，下一步我們應該對今天所涉及到的每個概念做深入的學習，然後經過反覆的聯絡，最終能真正瞭解它們。