- XAML Studio 讓您可以即時編輯和預覽 XAML，並在介面上進行真實互動。
- 它包含綁定偵錯器、資料上下文編輯器和視覺化資源管理器等進階工具。
- 它可以從微軟商店下載，也可以根據 MIT 許可證從其開源儲存庫編譯。
- 它提供對遙測資料的控制，旨在減輕 Visual Studio 設計人員的挫折感。
如果您使用XAML 在 Windows 系統中建立介面，您可能遇到過 Visual Studio 設計器帶來的種種問題，例如編譯時間過長或資料綁定錯誤難以定位。 XAML Studio 正是為此而生，它是一款專為快速、輕鬆地測試、調試和實驗 XAML而設計的應用程式。
本文將詳細介紹 XAML Studio 的功能，包括它如何幫助您在幾分鐘內建立 WinUI 和 UWP 介面原型，以及它提供的用於偵錯連結、管理測試資料、瀏覽視覺化樹等諸多工具。您還將了解如何從 Microsoft Store 下載 XAML Studio，如果要從原始程式碼編譯它需要滿足哪些要求，以及所有這些功能如何滿足那些對 Visual Studio 設計器感到有些厭倦的開發人員的需求。
XAML Studio是什麼？它適用於哪些用戶？
XAML Studio 是一款專注於 XAML 開發的 Windows 應用程序，最初是微軟車庫項目，現在作為 .NET 基金會的開源專案發布。它的主要目的是讓您編寫 XAML 程式碼，立即查看其運行效果，並像在自己的應用程式中一樣與介面進行互動。
它特別適用於使用WinUI XAML 和UWP 應用程式的開發人員，但如果您來自 WPF 並且想要嘗試現代 Fluent 設計概念、樣式、模板和視覺狀態，而無需每次都建立完整的解決方案，它也非常有用。
與更專注於完整開發週期的 Visual Studio 不同，XAML Studio 充當了視覺層的創意實驗室：您可以複製 XAML 片段、貼上、調整、立即查看結果、操作資料、檢查綁定，滿意後，即可將程式碼應用到您的實際專案中。
此外，作為一個開源項目，它的發展對社區是開放的：任何開發者都可以透過公共儲存庫審查程式碼、提出更改建議、提交改進意見並參與新功能的討論。
XAML Studio 的主要功能：用於介面原型設計
XAML Studio 的優勢之一在於它將一系列工具整合到一個應用程式中，旨在以最小的停機時間測試設計、建立螢幕佈局和偵錯連結。它不僅僅是一個 XAML 檢視器，更是一個互動式環境，可用於快速迭代 UI。
其最重要的功能之一是即時編輯：您可以在編輯器中編寫或修改 XAML 程式碼，並立即查看功能齊全的預覽。此預覽視窗支援真實互動：您可以像在最終應用程式中一樣按下按鈕、更改狀態、移動滑桿或測試行為。
另一個引人注目的功能是能夠使用麵包屑導航來體驗 XAML 導航。這使您可以輕鬆瀏覽複雜的結構，準確了解您在樹狀結構中的位置，並快速找到要調整的元素。
此外，XAML Studio 還包含一系列快捷方式和快速預覽選項：重新載入內容、啟動對齊網格、套用裁剪或更改主題，所有這些都可透過快速存取功能表完成，旨在簡化試錯過程。
即時編輯和預覽交互
XAML Studio 的核心是其實時編輯和互動系統，這項即時編輯功能無需每次更改顏色、間距或範本時都重新編譯整個解決方案。您可以編寫程式碼、儲存，甚至無需保存，介面都會刷新，讓您立即看到結果。
此預覽版具有完全互動性，這意味著您可以測試真實的介面行為：導航控制項、觸發事件，並查看樣式、觸發器和視覺狀態組合時元素的行為。它對於原型設計來說簡直是救星，因為它可以幫助您更快決定哪些設計美觀，哪些不美觀。
此外，XAML Studio在設計介面上內建了對齊參考線，方便使用者輕鬆地統一定位元素，並偵測出可能被忽略的錯位。這使您能夠實現更簡潔的佈局，而無需進行大量的盲目邊距調整。
在複雜的設計系統中，WinUI 和 Fluent 提供了許多陰影、圓角和自適應佈局等功能，而擁有一個整合良好的互動式預覽功能可以幫助您避免在生產環境中進行微調時經常遇到的諸多挫折。
調試綁定並探索視覺化樹
在 WPF、UWP 或 WinUI 中，資料綁定靜默錯誤是一大難題。當綁定失敗時，通常只會顯示一個空值，除此之外幾乎沒有其他訊息，這使得理解問題所在變得十分困難。 XAML Studio 內建了一個綁定偵錯器，旨在幫助使用者發現並解決這類問題。
借助綁定偵錯器，您可以直觀地查看模型屬性與介面控制項之間的連接方式。該工具會顯示每個綁定的狀態、上次使用的值，並幫助您快速定位哪個綁定失敗以及失敗原因。對於包含大量資料的複雜原型，這可以節省大量時間。
與此相關，XAML Studio 整合了可視化樹狀瀏覽器和視覺化狀態，可透過「屬性」面板存取。視覺化樹狀瀏覽器會顯示構成螢幕的控制項和元素的完整層次結構，讓您可以選擇任何節點並查看其屬性、樣式和關係。
同時，視覺化狀態瀏覽器可以輕鬆查看和切換視圖的不同狀態（例如，正常、指向、按下、停用），這在使用自訂控制項或進階範本時至關重要。這樣，您就可以快速測試每種狀態對設計的影響，而無需在實際應用程式中手動強制執行每種情況。
使用資料上下文編輯器進行資料管理
在沒有真實數據的情況下測試介面就像盲目設計。因此，XAML Studio 包含一個資料上下文編輯器，該工具可讓您輕鬆定義視圖的資料上下文，並用測試資訊填充它。
透過此編輯器，您可以將使用者介面連接到靜態和動態資料來源：例如，從本機檔案或 REST API 載入 JSON 數據，並將其用作控制項的 DataContext。這樣，您可以查看佈局在處理長文本、大型集合或邊界值時的表現，這對於實現健壯的設計至關重要。
這種將 XAML 與測試資料混合使用的能力，無需設定整個應用程式基礎架構，即可更快地迭代資訊的視覺外觀和分佈，並省去了設定臨時範例專案來查看表單在真實資料中的外觀。
XAML Studio 還具有自動儲存系統，可在您重新開啟應用程式時還原文件及其資料上下文，這樣您就不必每次想要繼續測試特定設計時都重新配置資料來源。
效率工具：智慧感知、自動保存等
除了純粹的視覺特性外，XAML Studio 還整合了多種效率工具，讓您在編寫大量 XAML 程式碼時更加輕鬆和有效率。其中最實用的功能之一是 IntelliSense 支持，它會在您輸入時提示屬性、類型、控制項名稱和命名空間。
這項 IntelliSense 功能不僅能加快程式碼編寫速度，還能幫助防止綁定、路徑和屬性中的拼字錯誤，尤其是在樣式、模板或共享資源等較長的結構中。如果您已經熟悉 Visual Studio 中的 IntelliSense，那麼您會感覺非常得心應手。
另一個非常實用的功能是文件的自動儲存和恢復。 XAML Studio 可以自動儲存您的工作，並在您重新開啟應用程式時，擷取您先前使用的標籤和文檔，以便您可以從上次中斷的地方繼續工作，而無需逐一開啟文件。
此介麵包含一個文件工具箱，可作為控制項和屬性的範例、說明和參考資料的捷徑。這樣，您無需離開工具即可查閱文檔，這在測試不太熟悉的 API 或 WinUI 特有的屬性時尤其方便。
設計輔助工具：Fluent UI、指南與命名空間
該專案的最新版本採用了基於微軟現代設計系統 Fluent UI 的全新介面。此次更新不僅體現在工具的視覺外觀上，也體現在其對現有控制、主題和佈局的整合方式上。
為了幫助您進行佈局，XAML Studio 在預覽介面上提供了對齊參考線和網格。這些參考線使對齊邊距、內邊距和佈局變得輕鬆便捷，尤其適用於您想要複製像素級精確設計，或希望確保元素正確對齊而無需手動測量的情況。
該工具的另一項優勢在於管理 XAML 命名空間。透過其命名空間助手，您可以更有效率地新增和修正 xmlns，避免因聲明不完整或重複而導致標記錯誤或產生煩人警告的常見問題。
日常使用中也進行了一些小的改進，例如可以從上下文選單複製開啟的標籤頁，這在您想要嘗試相同佈局的兩種變體，而又不想丟失原始版本或從頭開始建立新檔案時非常有用。
資料夾支援和資源管理
XAML Studio 的一項重大改進是增加了對外部資料夾和資源的支援。這意味著您可以處理一組相關的文件，而不僅僅是單一孤立的 XAML 文件。
借助此功能，應用程式可以從資料夾載入圖像、設計資料檔案以及其他通常與實際介面配套的輔助資源。例如，您可能有一組用於輪播圖的測試圖像、用於按鈕的圖標，或用作資料來源的 JSON 檔案。
資料夾支援使 XAML Studio 更接近真實的工作流程，而不只是一個簡單的沙箱。它可讓您設定模擬完整應用程式資源結構的小型測試場景，同時又具備專為原型設計而打造的輕量級環境的特性。
所有這些功能，再加上預覽、綁定和導航工具，使得 XAML Studio 對於那些希望在將螢幕整合到重量級解決方案之前對其進行完善的用戶來說，是一個非常有吸引力的選擇。
從 Microsoft Store 下載並手動安裝
對於大多數使用者來說，最簡單的入門方法是直接從 Microsoft Store 下載 XAML Studio。它是一款免費應用，您只需搜尋並安裝它，即可在幾分鐘內開始體驗 XAML。
根據現有信息，應用程式商店版本目前仍處於 1.1 分支，而最活躍的開發工作則在專案倉庫的 dev 分支上進行。如果您想體驗最新功能或參與開發，這一點非常重要，因為應用程式商店中顯示的內容可能與原始程式碼中的內容有所不同。
如果您喜歡從儲存庫手動安裝或自行編譯，則應牢記與 Visual Studio 相關的一些最低要求，以確保一切正常運作。
從原始碼編譯 XAML Studio
如果您想更進一步，從原始程式碼編譯 XAML Studio，則需要在 Visual Studio 中準備環境，其中包含面向現代 Windows 應用程式開發的特定元件。
首先，您需要在 Visual Studio 中安裝Windows 應用程式開發工作負載。此工作負載包含與 UWP 應用程式、WinUI 以及 Windows 平台上的其他現代 XAML 技術相關的所有內容。
此外，您還需要安裝通用 Windows 平台工具以及特定的 Windows SDK 17763。如果沒有此 SDK，專案的某些部分可能無法正確編譯，因此建議在開啟解決方案之前，請在 Visual Studio 安裝程式中檢查這一點。
所有元件都準備好後，打開程式碼庫，確保名為XAMLStudio 的專案被標記為解決方案中的啟動專案。然後，只需按 F5 進入調試模式，即可從您自己的開發環境中啟動應用程式。
開源專案、許可證和行為準則
由於 XAML Studio 是以.NET 基金會專案的形式發布的，因此它採用 MIT 許可證，這是最寬鬆的開源許可證之一。這意味著您可以非常自由地查看、修改、重複使用程式碼並為其做出貢獻，只要您遵守通常的署名條款即可。
該程式碼庫包含一個 NOTICE.json 文件，其中列出了第三方庫的歸屬信息，與應用程式本身顯示的外部庫使用資訊一致。如果您關注企業環境中的授權合規性，此文件可作為參考，幫助您了解已整合哪些元件。
該專案已採用微軟開源行為準則，因此參與問題、拉取請求或討論需要遵守明確的行為準則：尊重、專業精神以及對騷擾行為零容忍。此外，我們也提供了一個關於行為準則的常見問題解答頁面，以及一個聯絡信箱（[email protected]），用於解答疑問或處理問題。
對於希望積極協作的用戶，CONTRIBUTING.md 檔案介紹如何提出更改建議、提交貢獻以及報告問題。它詳細說明了使用分支的推薦方法、程式碼審查工作流程以及專案協作的其他實用方面。
遙測、隱私和資料收集
與其他許多現代應用程式一樣，XAML Studio 包含了遙測機制來收集使用情況信息，目的是了解哪些功能使用最多、應用程式在不同文件大小下的性能如何以及最常發生的錯誤類型。
好消息是，該應用程式本身提供了對此遙測資料的明確控制：在設定頁面的“回饋”部分，您可以將“診斷資料”選項變更為“否”，以停用分散式應用程式本身的資料收集。
值得注意的是，根據專案訊息，App Center（用作遙測基礎的平台）已被棄用，目前v2 版本中未使用主動遙測，正在確定替代的診斷解決方案。
總而言之，微軟聲明該軟體可能會收集應用程式使用情況信息，這些資訊可用於改進服務和產品。如果您作為開發者使用可能收集最終用戶資料的功能（例如，在您自己的應用程式中整合服務），則必須遵守適用法律，並提供適當的隱私權聲明和政策，並在適當情況下連結到微軟的隱私權聲明。
品牌、標誌和商標使用
該程式碼庫和應用程式本身可能包含微軟或其他第三方的商標和標誌。該項目明確指出，這些商標的使用須遵守微軟的官方品牌指南。
如果您決定建立專案的修改版本或替代發行版，則必須以不會造成混淆或暗示微軟官方贊助的方式進行（如果不存在此類關係）。如果您重新散佈二進位檔案或將專案的部分內容整合到商業產品中，則此規則尤其重要。
同樣，程式碼中使用的任何第三方標誌或商標均受這些第三方的政策約束，因此，如果您打算在自己的公共專案中重複使用應用程式的大部分內容，建議您審查這些方面。
背景：對 Visual Studio 設計器的不滿以及 XAML Studio 的價值
XAML Studio 作為開源專案發布之際，正值許多開發者對 Visual Studio 的視覺化設計器表達不滿之時。效能問題、崩潰、行為不一致以及調試複雜 XAML 的困難是反覆出現的抱怨。
在這種情況下，XAML Studio 被視為一種「逃生閥」：它是一款輕量級工具，專門用於 XAML 設計和測試，可以減少傳統編輯-編譯-運行循環中的一些繁瑣步驟。它的目標並非取代 Visual Studio，而是彌補在介面快速迭代上的不足。
這種方法也符合學習 WinUI、WPF 或 UWP 等技術的使用者的需求。對許多人來說，.sln 檔案、複雜的配置以及打包成可執行檔等操作可能會讓人非常頭疼，尤其是在學習初期。而擁有一個專注於 XAML 層的獨立工具，則能讓學習和實驗過程更加順暢。
簡而言之，XAML Studio 已找到其定位，成為那些將大量時間投入到在 Windows 生態系統中構建和改進用戶界面的人們非常重視的應用程序，它為日常操作 XAML 提供了一個更靈活、更輕鬆的環境。
對於剛開始學習 C#、WPF、UWP 或 WinUI 的用戶，或者對於那些已經精通 XAML 但仍然面臨測試緩慢和調試困難的用戶來說，擁有像 XAML Studio 這樣的工具，將顯著改變你進行原型設計、複雜綁定以及在將設計集成到大型項目之前進行驗證的方式——所有這些都具有開源的靈活性，並且如何使用這些項目的靈活性，並且如何控制這些數據以及如何使用這些項目的靈活性。
