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 によるサポートされるすべてのタグを表示します。
Tag | Description | Example | Notes |
---|---|---|---|
b | Renders the text in boldface. | We are <b>not</b> amused. | |
i | Renders the text in italics. | We are <i>usually</i> not amused. | |
size | Sets the size of the text according to the parameter value, given in pixels. | 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 the size is set too large. |
color | Sets the color of the text according to the parameter value. The color can be specified in the traditional HTML format. #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 would be specified by | <color=#00ffffff>… | Another option is to use the name of the color. This is easier to understand but naturally, the range of colors is limited and full opacity is always assumed. <color=cyan>… The available color names are given in the table below. |
|Color name |Hex value |Swatch |
|:—|:—|
|aqua (same as cyan)|#00ffffff
||
|black|#000000ff
||
|blue|#0000ffff
||
|brown|#a52a2aff
||
|cyan (same as aqua)|#00ffffff
||
|darkblue|#0000a0ff
||
|fuchsia (same as magenta)|#ff00ffff
||
|green|#008000ff
||
|grey|#808080ff
||
|lightblue|#add8e6ff
||
|lime|#00ff00ff
||
|magenta (same as 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、幅、および高さの値で始まり、拡大縮小されていないテクスチャの幅および高さに対する比率として指定されます。
リッチテキストはエディター 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);