USS プロパティータイプ

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

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

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

カスタムプロパティーの API を使用して USS を拡張できます。カスタムの USS プロパティーは -- プレフィックスを必要とします。

プロパティー値

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

長さ

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

例：

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

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

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

数値

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

キーワード

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

色

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

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

アセット

resource() や url() 関数を使ってアセットを参照することができます。例えば background-image: resource("Images/img.png") を指定すると Images ディレクトリの img.png を背景画像として指定できます。参照されたアセットはインポート中に解決されます。

resource() 関数は Resources フォルダーか Editor Default Resources フォルダー下のファイルを受け取ります。以下の注意点があります。

• ファイルが Resources フォルダー下にある場合は、ファイル拡張子を入れないでください。例えば background-image: resource("Images/my-image")。
• ファイルが Editor Default Resources下にある場合は、ファイル拡張子を入れる必要があります。例えば background-image: resource("Images/default-image.png")。

さらに、テクスチャをロードするとき、resource() は高 DPI/Retina 画面を処理するための便利な方法を提供します。同じファイル名と @2x サフィックスを持つテクスチャが同じ場所に存在する場合、Unity は画面の DPI に応じて自動的にそれをロードします。 例えば、USS で resource("myimage") を使用する場合、Unity は Resources/myimage.png か Resources/myimage@2x.png のいずれかをロードします。

url() 関数は、ファイルパスがプロジェクトルートへの相対パス、または USS ファイルを含むフォルダーのいずれかへの相対パスであると想定します。ファイル拡張子を含む必要があります。以下の例では、USS ファイルは Assets\Editor\USS にあり、 thumb.png 背景画像は Assets\Editor\Resources にあります。

• USS ファイルの場所に基づく相対パスには、以下の例を使用します。url("../Resources/thumb.png");
• プロジェクトの場所に基づく絶対パスには、以下の例のいずれかを使用します。url("/Assets/Editor/Resources/thumb.png"); url("project:/Assets/Editor/Resources/thumb.png"); url("project:///Assets/Editor/Resources/thumb.png"); 例えば background-image: url("Images/my-image.png") のようになります。

文字列

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

• 2018–11–16 Page amended