UI Builder - 1 （UI Builder介面簡介）

UI Builder，是一個可視化的UI編輯工具，讓你可以在使用UI Toolkit時可以編輯UI assets，如UI Documents(.uxml)與StyleSheets(.uss)，此外還可以安裝以下的package增加額外的功能

• com.unity.vectorgraphics：讓你可以將VectorImage指定為元素(element)的background style
• com.unity.2d.sprite：讓你可以將 2D Sprite asset(或sub-asset)指定為元素的background style。安裝了此套件後，還可以直接從Inspector窗格中打開2D Sprite編輯器。

---

選擇 Window -> UI Toolkit -> UI Builder便可開啟UI Builder畫面

• StyleSheets：讓你編輯目前UI Document(UXML)的StyleSheets(USS)
• Hierarchy：顯示目前UI Document的element結構樹
  • 在這個Hierarchy中顯示的是element的name attribute，如果這個element沒有name則顯示它的C# type
• Library：顯示目前可以使用的elements，其中Standard為Unity內建的elements；Project則為專案中自訂的element (.uxml assets以及繼承VisualElement並有在UxmlFactory設定可以被UXML實體化的C# element )。
• Viewport：會顯示UI Document (UXML) 的畫面，並會儲存目前UI Document (UXML)的平移(pan)和縮放(zoom)狀態
  • 使用滑鼠中鍵(Middle-click)，或是使用Ctrl/Cmd + Alt/Option + 滑鼠左鍵可以拖動Viewport。
  • 使用滑鼠滾輪可以縮放Viewport。
• UXML Preview與USS Preview：此處可以預覽UI Builder產生的UXML與USS
• Inspector：與Unity原有的Inspector類似，根據選擇的element顯示對應的設定內容

---

下一篇：UI-Builder-2-（開始使用UI-Builder）