型セレクター

USS 型セレクターは、要素の型に基づいて要素を照合します。USS の 型セレクターは、HTML タグに一致させる CSS の 型セレクターと類似しています。例えば、USS の Button {...} はあらゆる Button 要素に一致します。これは、CSS の p {...} があらゆる段落 (<p>) タグに相当するのと同じです。

構文

以下は型セレクターの構文です。

TypeName {...}

型セレクターを使用する場合は、具体的なオブジェクトの型のみを指定します。TypeName (型名) に名前空間を加えないでください。

例えば、このセレクターは有効です。

Button { ... }

このセレクターは有効ではありません。

UnityEngine.UIElements.Button { ... }

例

単純なセレクターがどのように要素を検出するかを示すために、UI ドキュメントの例を示します。

<UXML xmlns="UnityEngine.UIElements">
  <VisualElement name="container1">
    <VisualElement name="container2" class="yellow">
      <Button name="OK" class="yellow" text="OK" />
      <Button name="Cancel" text="Cancel" />
    </VisualElement>
  </VisualElement>
</UXML>

スタイルをまったく適用しない場合、UI は以下のようになります。

以下の型セレクタースタイル規則は、2 つの Button 要素に一致します。

Button {
  border-radius: 8px;
  width: 100px;
  }

スタイルを適用すると、UI は以下のようになります。

その他の参考資料

• USS のベストプラクティス