Unity スタイルシート (USS)

各 VisualElement にはスタイルのプロパティが含まれており、backgroundColor や borderColor など、要素の寸法と要素が画面上でどのように描画されるかを設定します。

スタイルのプロパティは、C# かスタイルシートで設定します。スタイルプロパティには、独自のデータ構造 (IStyle インターフェース) があります。

UI Toolkit は USS (Unity スタイルシート) で書かれたスタイルシートをサポートします。USS ファイルは、HTML のカスケーディングスタイルシート (Cascading Style Sheets、CSS) からヒントを得たテキストファイルです。USS 形式は CSS に似ていますが、USS は Unity でうまく動作するためのオーバーライドとカスタマイズが含まれています。

ここでは、USS とその構文、CSS と比較した違いの詳細を説明しています。

サポートされている USS プロパティのクイックリファレンスについては、USS プロパティリファレンス を参照してください。

Unity スタイルシートの定義

Unity スタイルシート (USS) の基本的な事項は以下の通りです。

• USS はアセットとして認識されるテキストファイルです。テキストファイルには .uss 拡張子が必要です。
• USS はスタイルルールのみをサポートします。
• スタイルルールはセレクターと宣言ブロックで構成されます。
• セレクターは、どのビジュアル要素がスタイルのルールに影響するかを識別します。
• 中括弧 {} で囲まれた宣言ブロックには、1 つ以上のスタイル宣言が含まれます。各スタイル宣言は、プロパティと値で構成されます。各スタイル宣言はセミコロンで終わります。
• 各スタイルプロパティの値はリテラルであり、パースされるときに、ターゲットプロパティ名と一致する必要があります。

スタイルルールの一般的な構文は下のとおりです。

selector {
  property1:value;
  property2:value;
}

USS をビジュアル要素に設定

Unity スタイルシート(USS)を任意のビジュアルエレメントに添付することができます。スタイルルールは、そのビジュアル要素とその子孫すべてに適用されます。また、スタイルシートは必要に応じて自動的に再適用されます。

AssetDatabase.Load() や Resources.Load() などの標準的な Unity API を使用して StyleSheet オブジェクトをロードします。VisualElement.styleSheets.Add() メソッドを使用して、スタイルシートをビジュアル要素にアタッチします。

EditorWindow の実行中に USS ファイルを変更すると、スタイルの変更は即座に適用されます。

スタイルアプリケーションのプロセスは、UI Toolkit を使用する開発者にとって透過的です。スタイルシートは、必要な場合 (階層の変更、スタイルシートの再ロード) に自動的に再適用されます。

ルールに一致するスタイル

スタイルシートを定義すると、それを Visual Tree に適用することができます。セレクターは要素と照会して、どのプロパティが USS ファイルから適用できるかを解決します。セレクターが一致する要素を見つけると、スタイル宣言はその要素に適用されます。

例えば、以下のルールは全ての Button オブジェクトに適合します。

Button {
  width: 200px;
}

VisualElement の照合

UI Toolkit は次の条件を使用して、ビジュアル要素をそのスタイルルールと照合します。

• その C# クラス名 (常にもっとも派生したクラス)
• name プロパティ (文字列)
• クラスリスト (一揃いの文字列)
• ビジュアルツリー内の VisualElement の祖先と位置

これらの特性は、スタイルシートのセレクターで使用されます。

CSS を使い慣れているユーザーには、HTML タグ名、id 属性、class 属性と似ていることがお判りでしょう。