見た目修飾子を活用することで、GuiObjects の外観をさらにカスタマイズできます。
- オブジェクトの背景にグラデーションを適用する。
- テキストまたはボーダーにストロークを適用する。
- オブジェクトの角を丸める。
- オブジェクトの境界間のパディングを増やす。
- オブジェクトの後ろにドロップシャドウを追加する。
グラデーション
UIGradient オブジェクトは、親の GuiObject に色と透明度のグラデーションを適用します。
グラデーションを設定するには、次の方法があります。
色のシーケンス
グラデーションの色のシーケンスを設定するには：
Explorer ウィンドウで UIGradient を選択します。
Properties ウィンドウで Color プロパティフィールド内をクリックし、その後入力ボックスの右側にある ⋯ ボタンをクリックします。色のシーケンスのポップアップが表示されます。
色のシーケンスの下軸にある各三角形は、そのポイントでの色の値を決定するキーポイントです。
色のシーケンス内のキーポイントをクリックし、次に Color の隣の小さな四角をクリックして Colors ポップアップウィンドウを開きます。
キーポイントに対する希望の色を選択します。
必要に応じて、以下の操作ができます：
- グラフの任意の場所をクリックして別のキーポイントを追加する。
- 既存のキーポイントを新しい位置にドラッグするか、キーポイントを選択して Time 入力を通じて特定の時刻の値を入力する。
- キーポイントを選択して Delete ボタンをクリックすることでキーポイントを削除する。
- Reset ボタンをクリックしてシーケンスをリセットする。
透明度
グラデーションの透明度をその範囲にわたって調整するには：
Explorer ウィンドウで UIGradient を選択します。
Properties ウィンドウで Transparency プロパティフィールド内をクリックし、その後入力ボックスの右側にある ⋯ ボタンをクリックします。数値シーケンスのポップアップが表示されます。
数値シーケンスグラフの各四角は、そのポイントでの透明度の値を決定するキーポイントです。
任意のキーポイントをクリックしてドラッグするか、キーポイントを選択して Time および Value 入力を通じて特定の時刻/値の組み合わせを入力します。
必要に応じて、以下の操作ができます：
- グラフの任意の場所をクリックして別のキーポイントを追加する。
- キーポイントを選択して Delete ボタンをクリックすることでキーポイントを削除する。
- Reset ボタンをクリックしてシーケンスをリセットする。
オフセットと回転
Offset および Rotation プロパティを使用すると、グラデーションの制御ポイントとその角度を調整できます。以下の図に示すように、Offset は親の幅または高さのパーセンテージに基づいており、正の値または負の値の両方が有効です。
同様に、グラデーションを回転させると、制御ポイントも回転します：
ストローク
UIStroke インスタンスは、テキストまたはボーダーにアウトラインを適用します。主な特徴は：
- 親の透明度とは独立にストロークの透明度を設定可能。
- 親のボーダーに対してカスタマイズ可能な位置および/またはオフセット。
- 三つのコーナースタイル（ラウンド、ベベル、またはミター）。
- UIGradient インスタンスを使用したストロークグラデーションのサポート。
太さ
Thickness プロパティを通じてストロークの幅を設定できます。これはピクセル（デフォルト）で測定されるか、修飾子の StrokeSizingMode によって親に対してスケールされます。ストロークがテキストに対して適用され、StrokeSizingMode が ScaledSize に設定されている場合、太さはフォントサイズに対して相対的です。
色またはグラデーション
Color プロパティを通じてストロークの色を設定でき、子の UIGradient インスタンスを挿入してグラデーションストロークを作成することもできます。
親オブジェクトと UIStroke の両方に子の UIGradient インスタンスを持つことができ、ストロークとフィルのグラデーションを独立して設定できます。
テキストのアウトラインまたはボーダー
UIStroke は、その親のタイプによってテキストのアウトラインまたはボーダーとして機能します。TextLabel のようなテキストオブジェクトに UIStroke を親として適用すると、そのテキストのアウトラインに適用されます。その他の GuiObjects に UIStroke を親として適用すると、ボーダーに適用されます。
テキストオブジェクトに適用されると、ApplyStrokeMode プロパティによってデフォルトのストローク動作をオーバーライドでき、オブジェクトの境界にストロークを適用できます。二つの UIStroke インスタンスをテキストオブジェクトに親として指定し、1つを Contextual に、もう1つを 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 プロパティを通じて個別のコーナーを制御することもできます。
TopRightRadius = (0, 48)
BottomRightRadius = (0, 48)
BottomLeftRadius = (0, 0)
パディング
UIPadding オブジェクトは、親 GuiObject の内容にトップ、ボトム、左、そして/または右のパディングを適用します。たとえば、テキストラベル内のテキストを下方向または上方向に移動するには、修飾子の PaddingBottom プロパティにオフセットを適用します。
シャドウ
UIShadow オブジェクトは、その親 UI インスタンスの後ろにドロップシャドウを描画します。主な特徴は：
- シャドウのぼかしを調整する。
- シャドウの色と透明度を調整する。
- シャドウのオフセットと広がりを調整する。
- 親が GuiObject.Rotation によって回転されている場合、シャドウも回転します。
- 親に角を丸めるが必要な場合、シャドウにも角が丸まります。
UIShadow はテキストをサポートしていません。これを TextLabel または TextButton に追加すると、オブジェクトの矩形のバウンディングエリアのシャドウが描画され、テキストのシャドウではなくなります。
ぼかし
BlurRadius プロパティは、シャドウのぼかし具合を決定します。大きな値は、シャドウのエッジを柔らかくします。この UDim プロパティのスケール因子は、親の幅または高さのどちらか短い方に相対します。
色と透明度
Color プロパティはシャドウの色を決定し、Transparency はシャドウの透明度を設定します。0 が完全に不透明で、1 が完全に透明です。
オフセットと広がり
Offset プロパティはシャドウを親の位置に対して移動させ、Spread はシャドウを親のサイズに対して拡大または縮小します。
