USS プロパティタイプ

ビルトインとカスタムのプロパティ

USS を使用する場合、UI コード内のビルトインの VisualElement プロパティの値や カスタムプロパティの値を指定できます。

USS ファイルからそれらの値を読み込むことに加えて、ビルトインのプロパティ値を VisualElement の C# プロパティを使用して C# で割り当てることができます。C# で割り当てられた値は、Unity スタイルシート (USS) から値をオーバーライドします。

カスタムプロパティ で USS を拡張することができます。カスタム USS プロパティには -- というプレフィックスが必要です。

プロパティ値

ここでは、サポートされている型を列挙します。

長さ

UI Toolkit は長さの単位としてピクセル (px) とパーセンテージ (%) をサポートします。ピクセル値は絶対値ですが、パーセンテージは通常、要素の親に相対的です。

例：

• width:200px; は、幅が 200 ピクセルであることを表します。
• width:50%; は、幅が親要素の半分であることを表しています。

測定単位を指定することは重要です。単位を指定しない場合、UI Toolkit はプロパティ値がピクセルで表されていると想定します。

注意： 0 は、測定単位を必要としない特別な値です。

数値

数値は、浮動小数点数または整数リテラルで表されます。例えば、flex:1.0 です。

キーワード

一部のビルトインプロパティでは、特定のキーワードがサポートされています。キーワードは、数字ではなく説明的な名前を提供します。例えば、position:absolute です。すべてのプロパティは、プロパティをデフォルト値にリセットする initial グローバルキーワードをサポートします。キーワードのリストについては、サポートされているプロパティ を参照してください。

Color

UI Toolkit は、以下のリテラルの色の値と関数をサポートします。

• 16 進数値: #FFFF00 (rgba はチャンネルごとに 1 バイト)、#0F0 (rgb)
• RGB 関数: rgb(255, 255, 0)
• RGBA 関数: rgba(255, 255, 0, 1.0)
• カラーキーワード： blue、transparent

アセット

フォントやテクスチャなどのプロジェクトアセットを、USS ファイルから参照することができます。例えば、テクスチャを参照して、要素の背景画像として使用できます。

アセットを参照するには、url() 関数または resource() 関数を使用します。参照されたアセットは、スタイルシートをインポートすると解決されます。

例えば、以下のスタイル宣言では resource() 関数を使用して、Images ディレクトリにある img.png という名前のテクスチャアセットを参照し、背景画像として指定します。

`background-image: resource("Images/img.png");

Unity では、ほとんどの場合、url() 関数の使用を推奨しています。ただし、resource() 関数は、画面の密度に応じて異なるバージョンの画像アセットを自動的にロードすることをサポートしています。

url 関数を使ったアセット参照

url() 関数でアセットを参照する際、指定するパスは相対パスでも絶対パスでも構いません。

• 相対パスは、アセットを参照する USS ファイルを含むフォルダーへの相対パスでなければなりません。
• 絶対パスは、プロジェクトに相対するパスです。

パスは、ファイルの拡張子を含む必要があります。

例えば、プロジェクトに、すべてのスタイルシートを含む USS フォルダーと、すべての画像アセットを含む Resources フォルダーがあるとします。

Assets
  └─ Editor
      └─ Resources
      └─ USS

thumb.png という名前の画像を参照するには、以下のいずれかのパスを使用します。

相対パス	絶対パス
url("../Resources/thumb.png")	url("/Assets/Editor/Resources/thumb.png") url("project:/Assets/Editor/Resources/thumb.png") url("project:///Assets/Editor/Resources/thumb.png")

resource 関数によるアセットの参照

resource() 関数は、Unity のリソースフォルダー (Resources と Editor Default Resources) にあるアセットを参照できます。アセットの参照は名前で行います。

• ファイルが Editor Default Resources Resources フォルダーにある場合は、ファイルの拡張子が必要です。
• ファイルが Resources フォルダーにある場合は、ファイルの拡張子は不要です。

例

ファイルへのパス	参照構文
Assets/Resources/Images/my-image.png	resource("Images/my-image")
Assets/Editor Default Resources/Images/my-image.png	resource("Images/default-image.png")

高 DPI/Retina スクリーン用画像アセットの参照

異なる画面密度 (DPI) の画面をサポートする必要がある場合、resource() 関数を使用すると、正しいバージョンのテクスチャアセットを自動的にロードできます。

その際、以下が必要です。

• テクスチャの高 DPI バージョンには、ファイル名に @2x というサフィックスが付いていることを確認してください。例えば、myimage.png の高 DPI バージョンは、myimage@2x.png としてください。
• テクスチャアセットの通常版と高 DPI バージョンを同じプロジェクトフォルダーに配置します。

Unity がアセットをロードするとき、現在のスクリーン DPI に合ったバージョンを自動的に選択します。

例えば、USS の resource("myimage") を使用すると、Unity は Resources/myimage.png または Resources/myimage@2x.png のいずれかをロードします。

文字列

引用符を使用して文字列の値を指定します。例えば --my-property: "foo"