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

リッチテキスト

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

マークアップの書式

マークアップシステムは HTML にヒントを得ていますが、標準 HTML とは完全に別のものです。基本的な考え方はテキストの該当部分を一組のタグによって囲うことです。

We are <b>not<b> amused.

例のように、タグは山括弧 <> 内にある数文字のテキストです。

該当する部分の先頭に開始タグを配置します。タグ内のテキストはその名前を暗示します (この例では単に b)。

セクションの最後にもう 1 つのタグを配置します。これは終了タグです。開始タグと同じテキストですが、テキストの前にスラッシュ / を付けます。すべての開始タグには、対応する終了タグが必要です。開始タグを閉じないと、通常のテキストとして表示されます。

タグはユーザーに見えるように表示されませんが、タグで囲まれたテキストをスタイリングするための指示として解釈されます。上の例で使用されている 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

これは以下のようになります。

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

タグパラメーターに空白を含むことはできません。以下はその例です。

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. Although this tag is available for Debug.Log, you will find that the line spacing in the window bar and Console looks strange if you set the size too large.
color Sets the color of the text according to the parameter value. You can specify the color in HTML format, as in #rrggbbaa, where the letters correspond to pairs of hexadecimal digits denoting the red, green, blue and alpha (transparency) values for the color. For example, cyan at full opacity is specified by color=#00ffffff

You can specify hexadecimal values in uppercase or lowercase; #FF0000 is equivalent to #ff0000.
We are <color=#ff0000ff>colorfully</color> amused もう 1 つのオプションは、色の名前を使用することです。これは分かりやすいですが、当然、色の範囲が制限され、常に完全に不透明な色という前提になります。<color=cyan>some text</color> 使用可能な色の名前は、ページ下の表 の通りです。
material これはテキストメッシュにのみに利用でき、パラメーターで指定されたマテリアルで、テキスト部分を描画します。インスペクターで表示されるように、値はテキストメッシュのマテリアルの配列のインデックスです。 We are <material=2>texturally</material> amused
quad Renders an image inline with the text. This is only useful for text meshes. It takes parameters that specify the material to use for the image, the image height in pixels, and a further four that denote a rectangular area of the image to display. Unlike the other tags, quad does not surround a piece of text and so there is no ending tag - the slash character is placed at the end of the initial tag to indicate that it is “self-closing”. <quad material=1 size=20 x=0.1 y=0.1 width=0.5 height=0.5> This selects the material at the position in the renderer’s material array and sets the height of the image to 20 pixels. The rectangular area of the image starts at the position given by the x, y, width and height values, which are all given as a fraction of the unscaled width and height of the Texture.

サポートする色

次の表は、<color> リッチテキストタグで 16 進数タグの代わりに名前を使用できる色の一覧です。

色の名前 16 進数の値 スウォッチ
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

エディター GUI

Rich text is disabled by default in the Editor GUI system but it can be enabled explicitly using a custom GUIStyle. The richText property should be set to true and the style passed to the GUI function in question:-

GUIStyle style = new GUIStyle ();
style.richText = true;
GUILayout.Label("<size=30>Some <color=yellow>RICH</color> text</size>",style);
自動レイアウト
UI リファレンス
Copyright © 2020 Unity Technologies
优美缔软件(上海)有限公司 版权所有
"Unity"、Unity 徽标及其他 Unity 商标是 Unity Technologies 或其附属机构在美国及其他地区的商标或注册商标。其他名称或品牌是其各自所有者的商标。
公安部备案号:
31010902002961