Unity Extensible Markup Language(UXML)

UXML啟發於HTML，XAML與XML，它定義並保存了UI的結構，可以使用Inline Style或是透過Unity Style Sheet來更改UI的風格(Style)。

UXML使用了類似樹狀的結構來保存UI，它存在父子關係(parent-child relationships)以及一個根元素(root element)

以下是UXML的範例

<?xml version="1.0" encoding="utf-8"?>
<UXML ...>
    <Box>
        <Toggle name="boots" label="Boots" value="false" />
        <Toggle name="helmet" label="Helmet" value="false" />
        <Toggle name="cloak" label="Cloak of invisibility" value="false"/>
    </Box>
    <Box>
        <Button name="cancel" text="Cancel" />
        <Button name="ok" text="OK" />
    </Box>
</UXML>

• UXML declaration：在上面範例的第一行，是UXML declaration，它是可選的，
  • 如果你使用UXML declaration的話，必須把它放在第一行，
  • 使用UXML declaration的話，必須為它設定version；
  • encoding則是可選的，但是如果使用encoding的話，必須指定它的編碼。
• Document root：<UXML>為文件的根element，在此定義namespace與schema definition files的位置。
  • Namespace：在UI Toolkit中每個element的Namespace不是在UnityEngine.UIElements就是在UnityEditor.UIElements。
    • UnityEngine.UIElements：此命名空間下的elements會作為Unity runtime時的一部分
    • UnityEditor.UIElements：此命名空間下的elements可在Unity Editor使用
    • 在使用時，你可以指定element的namespace，例如：<UnityEngine.UIElements:Button />
    • 或是在UXML declaration中指定它的prefix，如xmlns:engine="UnityEngine.UIElements"，在使用時會變為<engine:Button />
    • 注意：不要把自訂的control class放到UnityEngine.UIElements與UnityEditor.UIElements不然UI Builder會把你自訂的control隱藏。
  • Schema definition：它指定了每個UXML element可以包含哪些attributes和子element。

---

所有Element都會繼承VisualElement，這個VisualElement提供了以下attributes

• name: 用來辨認這個element，它的名稱應該要唯一。
• picking-mode: 設定為Position表示可以回應滑鼠事件，設定為Ignore表示忽略滑鼠事件
• focus-index: (OBSOLETE過時了) Use tabIndex and focusable.
• tabindex: 一個整數，定義這個element的tabbing position
• focusable: 一個Boolean，表示這個element是focusable.
• class: 類似HTML的class，你可以為特定的element加上class，讓它們應用到指定的style；你也可以把它當做篩選element的工具，透過UQuery來找到特定class的elements。
• tooltip: 當滑鼠指到該element時，會顯示提示字串
• view-data-key : 一個字串，作為element序列化(serialization)時使用的Key

---

使用Unity建立UXML：

• 選擇Asset -> Create -> UI Toolkit -> UI Document
• 預設它會幫你建立一個noNamespaceSchemaLocation
  

<ui:UXML xmlns:ui="UnityEngine.UIElements" xmlns:uie="UnityEditor.UIElements" xsi="http://www.w3.org/2001/XMLSchema-instance" engine="UnityEngine.UIElements" editor="UnityEditor.UIElements" noNamespaceSchemaLocation="../../UIElementsSchema/UIElements.xsd" editor-extension-mode="False">
</ui:UXML>

Reference: https://docs.unity3d.com/Manual/UIE-WritingUXMLTemplate.html