UI の外観修正子

*このコンテンツは、ベータ版のAI(人工知能)を使用して翻訳されており、エラーが含まれている可能性があります。このページを英語で表示するには、 こちら をクリックしてください。

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

グラデーション

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

グラデーションを構成するには:

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

カラー順列

グラデーションの色順序を設定するには:

  1. In the エクスプローラー window, select the UIGradient .

  2. プロパティ ウィンドウで、 プロパティフィールド内をクリックし、入力ボックスの右側の ボタンをクリックします。カラーシーケンスポップアップ表示。

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

    Color sequence popup from white to white
  3. カラーシーケンスのキーポイントをクリックし、 の横にある小さな正方形をクリックして、 カラー ポップアップウィンドウを開きます。

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

    Color sequence popup from red to white
  5. 必要に応じて、次のことができます:

    • グラフのどこかをクリックして、別のキーポイントを追加します。
    • 既存のキーポイントを新しい位置にドラッグするか、キーポイントを選択して 時間 入力を介して特定の時間値を入力します。
    • キーポイントを選択し、 削除 ボタンをクリックして削除します。
    • 順序をリセットするには、 リセット ボタンをクリックします。

透明性

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

  1. In the エクスプローラー window, select the UIGradient .

  2. プロパティ ウィンドウで、 透明性 プロパティフィールド内をクリックし、入力ボックスの右側の ボタンをクリックします。数字シーケンスポップアップ表示。

    数列グラフの各スクエアは、その時点で透明度値を決定する キーポイント です。

    Number sequence popup from 0.5 to 0.5
  3. 任意のキーポイントをクリックしてドラッグしたり、キーポイントを選択して 時間 の入力を介して特定の時間/値の組み合わせを入力したりします。

    Number sequence popup from 0 to 1
  4. 必要に応じて、次のことができます:

    • グラフのどこかをクリックして、別のキーポイントを追加します。
    • キーポイントを選択し、 削除 ボタンをクリックして削除します。
    • 順序をリセットするには、 リセット ボタンをクリックします。

偏りと回転

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

オフセット (X) = 0
>

オフセット (X) = 0.25
>

オフセット (X) = -0.25
>

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

回転 = 0
>

回転 = 45
>

回転 = -90
>

ストローク

UIStroke インスタンスは、テキストまたは境界にアウトラインを適用します。主な機能には次があります:

テキストの輪郭/境界

親によって、 UIStroke は、 テキストの概要 または ボーダー として動作します。テキストオブジェクトに親を付けると、テキストのアウトラインに適用されます。他の に親を付けると、ボーダーに適用されます。

UIStroke の子テキストラベル
>

UIストロークとUICornerの子供を持つフレーム
>

テキストオブジェクトに適用すると、デフォルトのストローク動作を ApplyStrokeMode プロパティでオーバーライドでき、テキスト自体ではなくオブジェクトの境界にストロークを適用できます。2つのインスタンスをテキストオブジェクトに親属させて、テキストの輪郭と境界を独立して制御できます。1つはコンテキスト、もう1つはボーダーに設定します。

UIStroke.ApplyStrokeMode = コンテキスト
>

UIStroke.ApplyStrokeMode = ボーダー
>

厚さ

親の外側の端からピクセルで測られる Thickness プロパティを通じて、ストローク幅を設定できます。

UIストローク.太さ = 4
>

UIストローク.太さ = 12
>

色/グラデーション

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

UIストロークの色 = (0, 95, 225)
>

UIストロークとUIGradientの子供
>

透明性

Transparency プロパティは、親オブジェクトの BackgroundTransparency または TextTransparency と独立してストロークの透明度を設定します。これにより、「空洞」(アウトラインのみで構成)のテキストと境界をレンダリングできます。

TextLabel.TextTransparency = 0 / UIStroke.Transparency = 0.5
>

TextLabel.TextTransparency = 1 / UIStroke.Transparency = 0
>

コーナースタイル

LineJoinMode プロパティでは、コーナーの解釈方法を制御できます。値は ラウンドベベル 、または ミター のいずれかを受け入れます。

UIStroke.LineJoinMode = ラウンド
>

UIStroke.LineJoinMode = ベベル
>

UIストローク.ラインジョインモード = ミター
>

コーナー

UICorner インスタンスは、親の GuiObject のすべての4つの隅に歪みを適用します。You can control the applied radius through the CornerRadius プロパティ using either Scale または Offset .

Scale 角を パーセンテージ に丸め、親の 最短 端の総長に基づいて、スケールの 0.5 またはそれ以上が親を「ピル」形に変形させる、幅または高さに関係なく。Offset 親の幅/高さに関係なく、角を特定の ピクセル に丸めます。

Scale = 0.25  ·  Offset = 0
Scale = 0.5  ·  Offset = 0
Scale = 0  ·  Offset = 32
Scale = 0  ·  Offset = 64

パッド

A UIPadding オブジェクトは、親の GuiObject コンテンツに上、下、左、および/または右側のパッドを適用します。

たとえば、ボタンの底にオフセットを適用して、テキストボタン内のテキストを下方または上方に移動できます。