When using Unity style sheet (USS), you can specify values for VisualElement
properties in USS files. You can also assign property values in C#, using the C# properties of VisualElement
. Values assigned in C# override values from a USS file.
カスタムプロパティ で USS を拡張することができます。カスタム USS プロパティには --
というプレフィックスが必要です。
This page introduces the supported data types.
USS データ型は、USS プロパティが受け入れる値とキーワードを定義します。
Property | Description | |
---|---|---|
<length> |
Represents a distance value. | |
<number> |
Represents either an integer or a number with a fractional component. | |
<integer> |
Represents a whole number. | |
<color> |
Represents a color. You can define a color with a #hexadecimal code, the rgb() or rgba() function, or a color keyword (for example, blue or transparent ). |
|
<resource> |
Represents an asset in a Resources folder. | |
<url> |
Represents an asset specified by a path. You can express it as either a relative path or an absolute path. | |
<length>{1,4} |
Represents one to four options for properties that are sharthand for -top- , -bottom- , -left- , and -right- properties, such as padding-top , or border-top-width . |
|
1 length | Applies to all four properties. | |
2 lengths | The first applies to -top- and -bottom- . The second applies to -left- and -right- . |
|
3 lengths | The first applies to -top- . The second applies to -left and -right- . The third is applied to -bottom- . |
|
4 lengths | Applies in this order : -top- , -right , -bottom- , -left-
|
UI Toolkit は長さの単位としてピクセル (px
) とパーセンテージ (%
) をサポートします。ピクセル値は絶対値ですが、パーセンテージは通常、要素の親に相対的です。
例:
width:200px;
は、幅が 200 ピクセルであることを表します。width:50%;
は、幅が親要素の半分であることを表しています。測定単位を指定することは重要です。単位を指定しない場合、UI Toolkit はプロパティ値がピクセルで表されていると想定します。
注意: 0
は、測定単位を必要としない特別な値です。
数値は、浮動小数点数または整数リテラルで表されます。例えば、flex:1.0
です。
Specific keywords are supported for some built-in properties. Keywords provide a descriptive name instead of a number. For example: position:absolute
. All properties support the initial
global keyword which resets a property to its default value. See USS properties for a list of keywords.
UI Toolkit は、以下のリテラルの色の値と関数をサポートします。
#FFFF00
(rgba はチャンネルごとに 1 バイト)、#0F0
(rgb)rgb(255, 255, 0)
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()
関数でアセットを参照する際、指定するパスは相対パスでも絶対パスでも構いません。
パスは、ファイルの拡張子を含む必要があります。
例えば、プロジェクトに、すべてのスタイルシートを含む 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()
関数は、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) の画面をサポートする必要がある場合、resource()
関数を使用すると、正しいバージョンのテクスチャアセットを自動的にロードできます。
その際、以下が必要です。
@2x
というサフィックスが付いていることを確認してください。例えば、myimage.png
の高 DPI バージョンは、myimage@2x.png
としてください。Unity がアセットをロードするとき、現在のスクリーン DPI に合ったバージョンを自動的に選択します。
例えば、USS の resource("myimage")
を使用すると、Unity は Resources/myimage.png
または Resources/myimage@2x.png
のいずれかをロードします。
引用符を使用して文字列の値を指定します。例えば --my-property: "foo"