Version: 2019.1
自动布局
UI 参考

富文本

UI 元素和文本网格的文本可以包含多种字体样式和大小。UI 系统和旧版 GUI 系统都支持富文本。Text、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

标签参数

有些标签对文本具有简单的“全有或全无”(all-or-nothing) 效果,但其他标签可能允许变化。例如,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 另一种选择是使用颜色的名称。这种方法更容易理解,但当然,颜色范围受限,并始终假设颜色完全不透明。<color=cyan>some text</color> 下表中列出了可用的颜色名称。
material 这仅对文本网格有用,使用参数指定的材质渲染文本部分。值为 Inspector 显示的文本网格材质数组的索引。 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> 富文本标签中使用名称而不是十六进制值的颜色。

颜色名称 十六进制值 样本
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

Editor 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 参考