自動レイアウト
UI リファレンス

リッチテキスト

UI 要素のテキストおよびテキストメッシュは複数のフォントスタイルおよびサイズを含めることができます。リッチテキストは UI システムと旧 GUI システムの両方をサポートしています。GUIStyle、GUIText、および TextMesh クラスは Rich Text 設定があり、Unity にテキスト中のマークアップタグを探すように指示します。Debug.Log 関数でもこのマークアップタグを使用してコードからのエラーレポートを更新することができます。これらのタグは表示されませんが、スタイル変更を意味して、テキストに反映されます。

マークアップの書式

マークアップシステムは HTML にヒントを得ていますが、厳密に標準 HTML に従うことは意図していません。基本的な考え方はテキストの一部はマッチングするタグのペアにより閉じられるということです。

   We are <b>not</b> amused

例が示すように、タグは “山括弧” 記号(< および >)に含まれるテキストです。タグの中のテキストは名前を示します(この場合は単に b です)。セクションの終わりのタグは最初と同じ名前を持っているけれども、スラッシュ記号、/、を加えて使用されることに注意してください。タグはユーザーに直接表示されませんが、囲われるテキストのスタイル指示として解釈されます。上記の例で示される b タグは太文字を “not” という言葉に適用するため、テキストはスクリーン上では次のように表示されます。

   We are not amused

テキストのマークアップセクション(囲うタグを含めて)、要素 と呼びます。

ネスト要素

ひとつの要素を他の要素の中に “ネスト” することで、ひとつより多くの要素をテキストに適用することが可能です。

   We are <b><i>definitely not</i></b> amused

イタリックスタイルは i タグにより適用されるため、スクリーン上では次のように表示されます

   We are ** definitely not** amused

終了タグの順番は開始タグの順番と逆になっていることに注意してください。この理由は、内部タグの範囲が外の要素をすべて含めないことを考えると明らかになります。

   We are <b>absolutely <i>definitely</i> not</b> amused

により次のようになります

   We are absolutely definitely not amused

タグパラメーター

いくつかのタグはテキストに対して、シンプルなある/なしの効果ですが、他ではバリエーションがあるかもしれません。例えば、color タグはどのカラーを適用するか知る必要があります。このような情報は パラメーター の使用によりタグに情報が追加されます。

   We are <color=green>green</color> with envy

終了タグはパラメーター値を含まないことに注意してください。オプションとして、値は ? 記号により囲うこともできますが、必須ではありません。

サポートされるタグ

次のリストは Unity によるサポートされるすべてのタグを表示します。

タグ 説明 注意
b 太字のテキストを描画します。    We are <b>not</b> amused.
i テキストをイタリックにレンダリング。    We are <i>usually</i> not amused.
size テキストサイズをパラメーター値にもとづいてピクセル単位で設定。    We are <size=50>largely</size> unaffected. このタグは Debug.Log においても有効ですが、サイズを大きくしすぎるとウィンドウバーとコンソールにおける行間がおかしくなるでしょう。
カラー名 テキストの色はパラメーター値に応じて設定されます。色は従来の HTML 形式で設定することができます。   #rrggbbaa … 文字は色の、赤、緑、青およびアルファ(透明度)の値を表す 16 進数の対に対応します。例えばこれは、完全な不透明のシアンです。    <color=#00ffffff>… 別のオプションはカラーの名前を使用することです。理解するにはこちらが簡単ですが、色の範囲が限定されていて、常に完全に不透明となります。   <color=cyan>… 利用できる色の名前を以下に記します。
カラー名 十六進数 色見本
aqua (cyan と同じ) #00ffffff
black #000000ff
blue #0000ffff
brown #a52a2aff
cyan (aqua と同じ) #00ffffff
darkblue #0000a0ff
fuchsia (magenta と同じ) #ff00ffff
green #008000ff
grey #808080ff
lightblue #add8e6ff
lime #00ff00ff
magenta (fuchsia と同じ) #ff00ffff
maroon #800000ff
navy #000080ff
olive #808000ff
orange #ffa500ff
purple #800080ff
red #ff0000ff
silver #c0c0c0ff
teal #008080ff
white #ffffffff
yellow #ffff00ff

material

これはパラメーターにより指定されたマテリアルによって、テキストメッシュおよびテキストの一部のみレンダリングします。インスペクターで表示されるとおり、値はテキストメッシュのマテリアルの配列のインデックスです。

   We are <material=2>texturally</material> amused

quad

これはテキストメッシュのみに便利であり、画像をテキストとともにインラインでレンダリングします。画像のために使用するマテリアル、ピクセル単位での画像の高さ、そして 4 つほど画像を表示する四角形領域をあらわす数値を、引数としてとります。他のタグと異なり、quad はテキストを囲わず、終了タグがありません - スラッシュ記号は最初のタグの終わりに置かれ、“自己完結” を表現します。

   <quad material=1 size=20 x=0.1 y=0.1 width=0.5 height=0.5 />

これにより、レンダラーのマテリアル配列の位置のマテリアルを選択し、画像の高さを 20 ピクセルに設定します。画像の四角形領域は x、y、幅、および高さの値で始まり、拡大縮小されていないテクスチャの幅および高さに対する比率として指定されます。

Editor GUI

リッチテキストはエディター GUI システムではデフォルトで無効化されてますが、カスタムの GUIStyle を使用して明示的に有効化できます。richText プロパティーを true にして関連する GUI 関数に style を渡します。

GUIStyle style = new GUIStyle ();
style.richText = true;
GUILayout.Label("<size=30>Some <color=yellow>RICH</color> text</size>",style);
自動レイアウト
UI リファレンス