UIの外観修飾子

外観修飾子を利用することで、GuiObjectsの外観をさらにカスタマイズできます。

• オブジェクトの背景にグラデーションを適用します。
• テキストやボーダーにストロークを適用します。
• オブジェクトに角を丸める設定をします。
• オブジェクトのボーダー間のパディングを増やします。
• オブジェクトの背後にドロップシャドウを追加します。

グラデーション

UIGradientオブジェクトは、その親GuiObjectに色と透明度のグラデーションを適用します。

グラデーションを設定するには：

• グラデーションのColorプロパティを通じてColorSequenceで色を設定します。
• グラデーションのTransparencyプロパティを通じてNumberSequenceで透明度を設定します。
• グラデーションの開始点（親の境界内または外）をOffsetプロパティで選択します。
• グラデーションの角度をRotationプロパティで選択します。

色のシーケンス

グラデーションの色のシーケンスを設定するには：

1. ExplorerウィンドウでUIGradientを選択します。

2. Propertiesウィンドウで、Colorプロパティフィールド内をクリックし、入力ボックスの右側にある**⋯**ボタンをクリックします。色のシーケンスポップアップが表示されます。

   

   色のシーケンスの下部軸にある各三角形は、そのポイントでの色の値を決定するキーポイントです。

   

3. 色のシーケンス内のキーポイントをクリックし、次にColorの隣にある小さな四角をクリックしてColorsポップアップウィンドウを開きます。

4. キーポイントの希望の色を選択します。

   

5. 必要に応じて、次のことができます：

   • グラフの任意の場所をクリックして別のキーポイントを追加します。
   • 既存のキーポイントを新しい位置にドラッグするか、キーポイントを選択してTime入力を通じて特定の時間値を入力します。
   • キーポイントを選択してDeleteボタンをクリックすることで削除します。
   • Resetボタンをクリックしてシーケンスをリセットします。

透明度

グラデーションの透明度をその範囲で調整するには：

1. ExplorerウィンドウでUIGradientを選択します。

2. Propertiesウィンドウで、Transparencyプロパティフィールド内をクリックし、入力ボックスの右側にある**⋯**ボタンをクリックします。数値シーケンスポップアップが表示されます。

   

   数値シーケンスグラフの各四角は、そのポイントでの透明度の値を決定するキーポイントです。

   

3. 任意のキーポイントをクリックしてドラッグするか、キーポイントを選択してTimeおよびValue入力を通じて特定の時間/値の組み合わせを入力します。

   

4. 必要に応じて、次のことができます：

   • グラフの任意の場所をクリックして別のキーポイントを追加します。
   • キーポイントを選択してDeleteボタンをクリックすることで削除します。
   • Resetボタンをクリックしてシーケンスをリセットします。

オフセットと回転

OffsetおよびRotationプロパティを使用すると、グラデーションの制御ポイントとその角度を調整できます。以下の図に示すように、Offsetは親の幅または高さのパーセンテージに基づいており、正の値または負の値の両方が有効です。

同様に、グラデーションを回転させると、制御ポイントも回転します：

ストローク

UIStrokeインスタンスは、テキストやボーダーにアウトラインを適用します。主な機能は次のとおりです：

• ストロークのアウトラインの色と厚さを調整可能。
• 親の透明度とは独立してストロークの透明度を設定できます。
• 親のボーダーに対して相対的な位置および/またはオフセットをカスタマイズ可能。
• 3つのコーナースタイル（ラウンド、ビベル、またはミッター）。
• UIGradientインスタンスを通じたストロークのグラデーションサポート。

厚さ

ストロークの幅は、Thicknessプロパティを通じて設定できます。これはピクセル（デフォルト）で測定されるか、修飾子のStrokeSizingModeに応じて親に対してスケーリングされます。ストロークがテキストに適用され、StrokeSizingModeがScaledSizeに設定されている場合、厚さはフォントサイズに対して相対的です。

色またはグラデーション

ストロークの色は、Colorプロパティを通じて設定でき、子のUIGradientインスタンスを挿入してグラデーションストロークを作成できます。

テキストのアウトラインまたはボーダー

UIStrokeは、その親のタイプに応じてテキストのアウトラインまたはボーダーとして機能します。UIStrokeをTextLabelのようなテキストオブジェクトに親として設定すると、テキストのアウトラインに適用されます。他のGuiObjectsに親として設定すると、ボーダーに適用されます。

テキストオブジェクトに適用されると、ApplyStrokeModeプロパティによってデフォルトのストローク動作をオーバーライドでき、テキスト自体ではなくオブジェクトの境界にストロークを適用できます。さらに、テキストのアウトラインとボーダーを独立して制御するために、テキストオブジェクトに2つのUIStrokeインスタンスを親として設定し、一方をContextual、もう一方をBorderに設定できます。

ボーダーの位置/オフセット

BorderStrokePositionは、ストロークの親のボーダーに対する位置を設定し、BorderOffsetはストロークの位置に追加のオフセットを指定できます。

透明度

Transparencyプロパティは、親オブジェクトのBackgroundTransparencyやTextTransparencyとは独立してストロークの透明度を設定します。これにより、"中空"（アウトラインのみで構成される）なテキストやボーダーをレンダリングできます。

コーナースタイル

LineJoinModeプロパティを使用すると、コーナーの解釈方法を制御できます。Round、Bevel、またはMiterのいずれかの値を受け入れます。

レイヤリング

複数の兄弟UIStrokeインスタンスをGuiObject上で前から後ろにレイヤリングするには、ZIndexプロパティを利用できます。ZIndexが低いものは、高いものの下（後ろ）にレンダリングされます。

同じZIndexを持つUIStrokeインスタンスのレンダリング順序は未定義です。レンダリング順序が重要な場合は、同じインデックスを持つ複数のUIStrokeインスタンスを適用しないでください。

コーナー

UICornerインスタンスは、その親GuiObjectのコーナーに変形を適用します。CornerRadiusプロパティを通じて、ScaleまたはOffsetを使用して適用される半径を制御できます。

Scaleは、親の最短辺の全長に基づくパーセンテージでコーナーを丸めます。つまり、0.5以上のスケールは、親を幅や高さに関係なく"ピル"形状に変形させます。Offsetは、親の幅/高さに関係なく特定のピクセル数でコーナーを丸めます。

また、TopLeftRadius、TopRightRadius、BottomRightRadius、およびBottomLeftRadiusプロパティを通じて個々のコーナーを制御できます。

パディング

UIPaddingオブジェクトは、親GuiObjectの内容に上、下、左、右のパディングを適用します。たとえば、テキストラベル内のテキストを下または上に移動するには、修飾子のPaddingBottomプロパティにオフセットを適用します。

シャドウ

UIShadowオブジェクトは、その親UIインスタンスの背後にドロップシャドウをレンダリングします。主な機能は次のとおりです：

• シャドウのぼかしを調整します。
• シャドウの色と透明度を調整します。
• シャドウのオフセットと広がりを調整します。
• 親がGuiObject.Rotationで回転している場合、シャドウも回転します。
• 親に丸いコーナーがある場合、シャドウも丸いコーナーになります。

ぼかし

BlurRadiusプロパティは、シャドウのぼかしを決定します。大きな値はシャドウのエッジをより柔らかく見せます。このUDimプロパティのスケール係数は、親の幅または高さのうち短い方に対して相対的です。

色と透明度

Colorプロパティは、シャドウの色を決定し、Transparencyはシャドウの透明度を設定します。0は完全に不透明で、1は完全に透明です。

オフセットと広がり

Offsetプロパティは、親の位置に対してシャドウを移動させ、Spreadは、親のサイズに対してシャドウを拡大または縮小します。