超強 WPF 視覺樹分析工具

  • 699
  • 0
  • 2023-02-26

寫 WPF 的朋友們應該都知道 Visual Studio 本身帶有一個「即時視覺化樹狀結構」 的分析工具,這個分析工具其實已經很好用了。但是有一個第三方的工具也不賴,就是本文要介紹的 Snoop。

安裝

安裝 Snoop 的步驟很簡單,可以透過 Chocolatey 安裝,參考 Chocolatey Snoop。如果未曾安裝過 Chocolatey 請先參考 Chocolatey Install。如果不想用這個工具,也可以有其他方式安裝,可以參考 Snoop github 的說明。

使用

Snoop 的使用非常簡單,執行後會在桌面出現一個功能棒:

可以使用下拉式選單選擇要解析的 WPF 應用程式,或是直接拖曳右方的準星圖樣按鈕至應用程式。這裡使用以前寫過的 [WPF] 製作進度環 (3) 完成控制項 當作範例。

分析畫面的左邊會列出式視覺樹,如果你想看邏輯樹,可以由上方的下拉式選單更改;畫面的右方則是呈現屬性、資料繫結以及方法等等成員。

左方視覺樹的部分有個很有趣的地方,當滑鼠指標移動到某個元素會在畫面上直接顯示預覽,這能有效幫助在複雜視覺樹的狀況下找到想觀察的元素。

選擇分析畫面右方的 Properties 頁籤,可以檢查並更改元素屬性;DataContext 頁籤則可以檢查並更改繫結的資料。另外, Triggers 和 Behaviors 的功能也是我們常用的。

下方有個 Perview 頁籤,也能顯示目前選擇的元素預覽圖。紅色箭頭指向的是打開預覽功能的按鈕。

 

還有一個有用的是這些值的變化會直接反應在分析畫面上,像這個範例按下按鈕後,中間的值會改變,可以直接觀察到。

這是一個非常方便的工具,比原來 Visual Studio 內建式視覺樹工具更強大,如果你有用到第三方控制項會發現在 Visual Studio 內建視覺樹工具看不到的內容都可以在 Snoop 上看到。如果有興趣,就下載來玩玩吧。