之前一篇《工欲善其事,必先利其器。VS2013全攻略(安裝,技巧,快捷鍵,插件)!》 看到很多朋友回復和支持,非常感謝,尤其是一些拍磚的噴油,感謝你們的批評,受益良多。
我第一份工作便是WPF的開發,一直到現在都非常喜歡這門技術,從懵懵懂懂到現在有一些WPF開發資歷,也算是經歷了一段坎坷的過程。我的朋友看到我寫了VS2013的全攻略,他就推薦我寫一個WPF篇,我想了下,的確很多朋友初接觸WPF的時候難免會覺得WPF開發十分困難,歸其原因,很多時候是出錯后並不知道如何調試毫無頭緒。下面我便順着我的開發歷程來分享一些有利於WPF開發的小工具們。
[小九的學堂,致力於以平凡的語言描述不平凡的技術。如要轉載,請注明來源:小九的學堂。cnblogs.com/xfuture]
目錄:
入門學習階段:KAXAML
UI布局階段:Snoop, SilverlightSpy
改寫樣式,寫控件庫階段:Reflactor, Blend
測試性能階段:Wpf performance Suite, Red Gate ANTS Performance Profiler 8
寫正篇之前先說Visual Studio. VS我就不介紹了,不管風雨如何,VS永遠是.NET 開發的第一選擇。
入門學習階段:KAXAML
初次接觸WPF的時候一定會想嘗試各種控件的屬性,能夠改動的同時實時的看出效果。或者有些朋友機器不夠給力或者說不想每次學習WPF都要打開VS,那KXAML一定適合您。
下載鏈接:KAXAML官網 ,源碼 這個是完全free的,源代碼也公開了,在此我也非常感謝作者Robby Ingebretsen,非常偉大的一款軟件。
介紹: KaXaml是一個輕量級的XAML編輯器,可是實現在編輯的同時展現UI效果。界面如下:
左邊是功能欄,右邊分為上下兩側,上面是UI,下面則是代碼。實時顯示
當你需要一些示例代碼或者當你需要改寫控件的時候,你可以點擊Snippets。其中包含很多作者的善意(代碼段):
左側的功能還包括find, color picker(取色值,很有用), snapshot, xaml scrubber(XAML格式的配置), settings等。
UI布局階段:Snoop, SilverlightSpy
當渡過了學習階段后,開始做一些實際的項目了。逐漸接觸到WPF的邏輯樹和視覺樹。這個時候很需要當項目運行時進行查看視覺樹的結構評測自己xaml是否正確或者進行運行時改變觀察效果。這個時候snoop和siverlightspy就很需要了。Snoop for WPF, silverlightSpy for silverlight。
下載鏈接: Snoop,源碼, SilverlightSpy Snoop是開源的,完全免費。silverlightspy是需要purchase的。
介紹:
Snoop是一個WPF運行時對Visual UI調試的一個工具, 可以查看其視覺樹以及對其進行更改。
運行后會出現工作條:下拉框中顯示的運行的WPF應用程序,點擊刷新獲得當前WPF應用程序列表,選擇相應程序后點擊望遠鏡圖標即可進行監測。也可以點擊望遠鏡后的瞄准圖標拖動到相應程序上來完成此操作,打開后
如圖,Snoop檢測了左邊的WPF應用程序,snoop左側是可視化樹列表,選中元素,可以進行縮略瀏覽,右邊是其屬性。選中的元素會有紅框出現。也可以使用Ctrl+Shift來進行選中。下面一張圖是對左側各種數據的說明:
你可以在運行時對snoop監視到的元素屬性進行修改來實時查看效果:
SilverlightSpy 則是類似snoop的工具,用來對顯示Silverlight 內容的網頁進行詳細的監測。這個工具使用它自己內嵌的瀏覽器,可以幫助用戶瀏覽任何網站,並監測Silverlight:
在網址欄輸入你自己開發的SL的頁面。即可進行檢測。使用方法類似SNOOP,用Ctrl+shift來進行選擇,可以進行實時改動:
改寫樣式,寫控件庫階段:Reflactor, Blend
隨着在項目中資歷和技術成長,逐漸搭建UI的任務慢慢已經分給新來的同事們了,這個時候就開始了充滿艱辛的寫控件階段。用戶需要更好的用戶體驗,UX以自己的理解設計出想要的體驗和交互,這個時候苦的就是開發了。“我天,這XX也可以?!”每次看到UX新設計出來的畫面,很多開發噴油一定都有這樣的感慨。但是為了更好的產品,我們也只能努力去完成UX的要求。所以慢慢改寫控件模板和樣式,以及實現更多控件層次交互的需求甚至動畫則成了我的任務,這個時候就需要blend和reflactor來幫助了。
Blend for Visual Studio 2013 提供了豐富的以設計為中心的環境,以便於開發針對 Windows 應用商店、Windows Phone、WPF 和 Silverlight 的應用。
而Reflactor反編譯dll則是為了探索控件實現的內部機制以方便改寫,比如當你需要更改一個datagrid來實現一個可以切換行的時候緩動的效果,或者更加變態的比如點擊一個column產生一個可以自我定位的grid等。這個時候你就要先去探索datagrid內部的實現機制,繼承並改寫它內部的邏輯,而不僅是樣式和模板。所以WPF依然需要reflactor。
下載:Blend,VS2013安裝時可以選擇blend一起安裝,Reflactor
Blend打開solution后效果如下圖:
黑白色調,工具欄和視覺欄。是不是很相似與PS。對的!這就是一款飽含設計向的WPF工具。可以在其中對控件樣式和動畫進行可視的操作。
只不過需要注意的事,它自動生成的代碼是非常混亂的。推薦繪制動畫或者改寫樣式時先使用blend來構造,在vs里再對xaml代碼進行優化。
Reflactor:反編譯dll,拿到其內部實現機制邏輯代碼。比如當我需要改寫datagrid:
這樣就可以拿到其反編譯的結果,得到其內部實現機制。便可以對具體的實現進行override來改寫。
測試性能階段:Wpf performance Suite, Red Gate ANTS Performance Profiler 8
項目即將結束,這個時候就需要測試了。作為一個嚴謹的開發,我們應該減輕QA MM們的壓力,自己先把自己埋的大坑填了,這樣才不會在最后時候各種加班修bug,悲慘世界啊。
這里就介紹兩款能夠避免這種事情出現的軟件:Wpf performance Suite, Red Gate ANTS Performance Profiler 8
Wpf performance Suite 是一款WPF效能分析工具,可讓您分析應用程式的執行階段行為,並判斷可套用的效能最佳化類型。Red Gate ANTS Performance Profiler 8 是判斷.net 在內存中的占用情況,測試內存泄漏和是否釋放的工具, RED GATE也是一個很有名的測試性能的廠家,reflactor其實就是該廠家出產,它還有其他類似sql,azure等測試的產品。
下載:WPF PERFORMANCE SUITE, Red Gate ANTS Performance Profiler 8
介紹:WPF PERFORMANCE SUITE 性能分析工具功能非常多 官網和博客園均有詳細介紹,這邊我就貼上鏈接,大家如可以點進去觀看:官網,博客園鏈接
着重來介紹 Red Gate ANTS Performance Profiler 8:首先打開該軟件,可以進行15天試用:
點擊continue,會彈出主界面。可以選擇來開始新的監視。
在相應PATH中選擇自己要測試的application 點擊 下方start profiling可以開始監視。也可以通過attach to process來進行監視
在其中會有很多元素進行監視和測試,比如class list,instance的數量等。從這些屬性上可以看的出自己application所占據的內存和具體一些class所占據的內存和實例數量。
多次點擊take snap shot 可以把當前的記錄下來 來進行比對,可以導出report。
這兩款軟件都是用處非常大的。假如大家需要的話,可以留言,假如必要的話我會盡量寫關於這兩個軟件詳細的使用方法的博客的。
總之,希望大家能夠支持。我希望能夠分享給所有的朋友心得和技巧,彎路一個人走就夠了。
非常喜愛博客園的環境,分享才是我們程序員的武器啊!