總結 Visual Studio 2019 發布以來 XAML 工具的改進

不知不覺,Visual Studio 2019 已經出到 16.8 和 16.9 Preview 了。雖然每次更新都林林總總地一大堆新功能和改進,但關於 XAML 的內容總是,always,每次都只有一點點。其實 Xamarin 相關的內容有在使勁地更新,不過和我做的 WPF/UWP 關係又不大。總算是積少成多,隨著 Visual Studio 持續更新,現在 XAML 編輯器的使用體驗已經比去年有了很大的改善。這篇文章就來總結下 Visual Studio 2019 發布後 XAML 工具的各個主要改變。

1.彈出 XAML 編輯器作為設計器的單獨窗口

現在,可以使用 XAML 選項卡旁邊新的”彈出 XAML”按鈕輕鬆地將 XAML 設計器及其基礎 XAML 編輯器拆分為單獨的窗口。這時 XAML 設計器將把原本的 XAML 編輯器最小化,並在新的窗口打開一個 XAML 編輯器(這兩個 XAML 編輯器將保持實時同步)。雖然是一個很簡單的功能,但這個功能對同時使用兩個螢幕的開發者十分友好,因為現在終於可以一個螢幕放設計視圖一個螢幕放 XAML 編輯器。真不能想像居然等了這麼多年才等來這個功能。

2. XAML IntelliSense 改進,以及支援程式碼段

IntelliSense 已經過增強,以支援顯示 XAML 程式碼片段,這將適用於內置程式碼片段以及你手動添加的任何自定義程式碼片段。這還挺好用的,一些很複雜的綁定現在也可以通過定義程式碼段來簡化了。

可並不是所有 IntelliSense 的改進都是好事。寫了十幾年 XAML,我的手指都變成 XAML 的形狀了,現在突然覺得很不適應。例如下面這個例子,我總是習慣盲打輸入 「<Gr空格」來創建一個 Grid 標籤,現在被插進來的推薦項打亂了我的習慣。總的來說改進程度和 C# 編輯器還是查了一大截。

3. 顏色可視化工具

現在可以看到 XAML 所設置的顏色了,不必再依賴第三方插件,這對經常需要設計 UI 的開發人員是一個很大的改進。

4. 擴展了對 WPF 和 UWP 的設計時數據支援

d: 前綴用於設置設計時的屬性值,它隻影響設計視圖,不會編譯到正在運行的應用中。在以前,d: 前綴只支援有限幾個功能,例如 d:DataContext。現在所有內置控制項的每一個屬性都可以用 d: 前綴設置(將來還可能增加對第三杠控制項的支援)。

5. XAML 熱重載/實時可視化樹/實時屬性資源管器

以前意義不明的「編輯並繼續」現在更名為簡單直接的「熱重載」。熱重載、實時可視化樹和實時屬性資源管器是 WPF 開發者不會錯過的重要功能,Visual Studio 2019 一直有逐漸改善它們的體驗,現在這些功能已經支援 WPF、UWP、Xamarin、WInUI 3 等多個平台。在 Visual Studio 2019 中比較顯著的改善是實時可視化樹中的「僅我的 XAML」。XAML 的可視化樹可能很複雜,很難定位到出問題的 XAML(通常來說,出問題的就是自己寫的 XAML)。現在可以通過選項 > 調試 > 熱重載>僅在實時可視化樹啟用「僅限我的 XAML」設置可以選擇是否顯示完整的可視化樹。

另外現在 Visual Studio 可以通過調試>附加到進程調試其它程式的實時可視化樹和實時屬性資源管理器,不過我不記得這是不是 2019 才有的新功能。

其它 UI 上的改善都很明顯,這裡不著重提出。

6 .XAML 綁定失敗診斷

即使經驗豐富到頭髮掉光,XAML 的綁定還是和有可能失敗。一般來說綁定失敗並不會報錯,所以開發者很難會注意到隱藏的綁定失敗,除非主動查看「輸出」窗口的內容。這種情況開發者很可能會忽略這些失敗,直到更嚴重的災難發生。現在 Visual Studio 新增了 XAML 數據綁定故障檢測和診斷功能,如果在調試時遇到綁定失敗,In-app toolbar 會出一個紅色的圖標,點擊後可以打開 「XAML 綁定失敗」窗口查看詳細資訊。

7. XAML 設計器建議的操作

最後一個是 XAML 建議的操作窗口,在 XAML 設計器中選中某個元素後,使用此功能可以輕鬆訪問這個元素的主要屬性。這個功能有點微妙,一來我還沒用慣,而來它支援的 UI 元素也不多(對 WPF 來說也就十幾個)所以它的可用性大打折扣。

8. 最後

Visual Studio 將會持續改善,從它路線圖來看,XAML 的相關內容真的處於「尚未成功,仍需努力」的狀態,可以期待將來 XAML 的開發體驗會更上一層樓(可是完全沒提到可憐的 Blend)。

9. 參考

Visual Studio 2019 當前發行說明:
//docs.microsoft.com/zh-cn/visualstudio/releases/2019/release-notes

Visual Studio 2019 預覽發行說明:
//docs.microsoft.com/zh-cn/visualstudio/releases/2019/release-notes-preview

Visual Studio 2019 開發人員社區:
//developercommunity.visualstudio.com/topics/visual+studio+2019.html

Visual Studio 發行節奏:
//docs.microsoft.com/zh-cn/visualstudio/productinfo/release-rhythm

Visual Studio Roadmap:
//docs.microsoft.com/zh-cn/visualstudio/productinfo/vs-roadmap

DevBlogs – Microsoft Developer Blogs:
//devblogs.microsoft.com