カラーグラデーション

最大 4 色のグラデーションをテキストに適用できます。カラーグラデーションを加えると、TextCore によってテキスト文字列の各文字にグラデーションカラーが適用されます。

テキストオブジェクトにカラーグラデーションプリセットを適用するには、<gradient> リッチテキストタグを を使用してください。グラデーションプリセットは、テキストのローカルのグラデーションタイプと色をオーバーライドします。

カラーグラデーションのプリセットを作成する

1 つまたは複数の色でカラーグラデーションを作成し、特定のフォルダーに配置するには、以下の手順を行います。

1. メニューから Assets > Create > Text > Color Gradient の順に選択し、新しいカラーグラデーションプリセットを加えます。

2. カラーグラデーションの Inspector ウィンドウで、ドロップダウンメニューからカラーモードを選択します。

   • Single: 単一色を適用します。
   • Horizontal Gradient: 各文字に 2 つの色を適用し、左右に色を変化させます。
   • Vertical Gradient: 各文字に 2 つの色を適用し、上下に色を変化させます。
   • Four Corners Gradient: 4 色を適用します。各色は各文字の割り当てられた角から放射状に広がります。

3. グラデーションの色を設定します。Colorsフィールドで使用可能な色の数は、選択したグラデーションモードによって異なります。各スウォッチは、文字スプライト上の色の原点に対応しています。

4. カラーグラデーションアセットを、Panel Text Setting アセット のColor Gradient Presets に設定されたパスに配置します。

カラーグラデーションのプリセットを適用する

カラーグラデーションプリセットをテキストに適用するには、<gradient="name-of-the-color-gradient">テキスト</gradient> のように、カラーグラデーションを名前で参照します。このようにカラーグラデーションを適用すると、テキストの色にオブジェクトの現在の頂点色が乗算されます。

純粋なグラデーションをテキストの選択範囲に適用するには、以下の例のように <color> タグを使って色を白にリセットします。

<color=white><gradient="Light to Dark Green - Vertical">ライトグリーンからダークグリーンへのグラデーション</gradient></color>

カラーグラデーションモードの例

以下に各モードのカラーグラデーションの例を示します。

Single

単色のグラデーション。

Horizontal Gradient

2 色による左右のグラデーション。

Vertical Gradient

2 色による上下のグラデーション。

Four Corners Gradient

4 色のグラデーション。各色は 1 つの角から放射状に広がります。最も用途の多いグラデーションタイプです。いくつかの色を変化させ、他の色を変化なしにするなど、さまざまな種類のグラデーションを作ることができます。

この例では、3 つの角が 1 つの色で、4 つ目の角が異なる色で色づけられています。

この例では、同じ色で隣接する角のペアで、左右または上下のグラデーションを示しています。

この例では、斜めに対向する角のペアを同じ色にして、斜めのグラデーションを作っています。

この例では、一方の端に支配的な色を置き、もう一方の端に 2 色間の変化を持つ左右および上下の 3 色グラデーションを示します。

この例では、斜めに対向する 2 つの角に同じ色を、残りの 2 つの角に異なる色を使い、斜めのストライプの 3 色グラデーションを作ります。

その他の参考資料

• リッチテキストタグ
• サポートするリッチテキストタグ
• スタイルシートアセット
• スプライトアセット