Unity插件之TextMeshPro 富文本【转】

作者: 编程小火鸡 | 来源:发表于2019-04-22 14:34 被阅读0次

2019.03.21 00:20 字数 2653 阅读 68评论 0喜欢 0

Unity插件之TextMeshPro 6.富文本

简介

通过富文本标签可以更改文本的外观和布局，实现多种样式的结合，使文本内容看起来更加丰富，还可以插入图素，制作图文混排，这些标签类似于HTML或XML，但语法又不是那么严格。此文章将重点介绍可以在TextMeshPro中使用的标签，虽然此文中列出了很多标签，但是在实际的实用中，经常使用的标签数量就只有几种而已。

声明

本文中的内容属于个人总结整理而来,个人水平有限，对于部分细节难免有理解错误及遗漏之处，如果您在阅读过程中有所发现，希望您能指正，同时文章中的部分内容也参考了其它大神的文章，如果文章中的内容侵犯了您的权益，表示非常歉意，请您指出，我将尽快修改。

如果您进行转载，请标明出处。
Unity插件之TextMeshPro 6.富文本(http://www.liyubin.com/articles/2019/03/19/1552973981025.html)

TextMeshPro富文本标签

标签看起来像是<tag>开始，如果需要关闭标签时使用</tag>,标签可以嵌套着使用，多个相同的标签使用时，往往是最后一个标签会生效，某些标签具有值和属性，类似于<tag = >、<tag attribute=vaue>,这些参数可以名称或者数值。数字是十进制或者十六进制，像素1px，百分比80%,字体单位1.2em,可以带有双引号也可以不带，有很多属性时最好使用。

推荐：虽然关闭标签不是必须的，还是推荐严格的添加关闭标签，对于排查错误会有不小的帮助

Text Alignment(文本对齐标签) -> align

每个文本都有一个整体的对齐方式，但是可以使用标签覆盖掉，从而重新设置文本对方方式。此标记通常放在段落的开始，如果同一行上有多个对齐标签，则最后一个会生效，其它的会被忽略。
```
<align="right">Right
<align="center">Center
<align="left">Left
```
显示效果为：

image
Colr(颜色标签) -> color alpha

文本默认可以设置整体的颜色，也可以使用标签设置整个文本或者文本中某些部分为其它的颜色。目前提供了两个标签可以对颜色产生影响
- color
 
 TextMeshPro内置了部分颜色值，可以通过名称直接使用其值，颜色值有：
 - 黑色-black
 - 蓝色-blue
 - 绿色-green
 - 橙色-orange
 - 紫色-purple
 - 红色-red
 - 白色-white
 - 黄色-yellow
 内置的颜色值有限，如果想设置其它的颜色可以直接使用十六进制进行设置如：#FFFFFF，如果想修改alpha值可以使用#FFFFFFFF，
```
<color="red">Red <color=#005500>Dark Green <#0000FF>Blue <color=#FF000088>Semitransparent Red
```
 显示效果为：
 
 image
- alpha
 
 如果只是需要修改文本的透明度，由可以只使用alpha标签，同样是使用十六进制表示的。
```
<alpha=#FF>FF <alpha=#CC>CC <alpha=#AA>AA <alpha=#88>88<alpha=#66>66 <alpha=#44>44 <alpha=#22>22 <alpha=#00>00
```
 显示效果为：
 
 image
PS:如果需要恢复默认的显示颜色，只要加上结束标签即可，即：</color>或者</alpha>,使用一次结束标签会将颜色设置为之前的颜色值
Bold and Italic(粗体与斜体) -> b i

使用b标签可以将文本加粗

使用i标签可以将文本变为斜体
```
The quick brown fox
jumps over The lazy dog.
```
显示效果为：

image
Character Spacing(字符间距) -> cspace

通过使得cspace标签可以调整字符间距，无论是绝对的还是相对于原始字体的。可以以像素或者字体单位(em)，设置正数将会加大字符间距，使用负数会减小字符间距，使用结束符可以让文本间距恢复到正常
```
<cspace=1em>Spacing</cspace> is just as important as <cspace=-0.5em>timing.
```
显示效果为：

image
Font(字体标签) -> font

可以font标签切换使用不同的字体，新字体会被一直使用，直到遇到新的字体标签或者关闭标签，字体与材质必须放到指定的目录中，同时必须提前做好相应的配置
```
Would you like <font="Impact SDF">a different font? or just <font="NotoSans" material="NotoSans Outline">a different material?
```
显示效果为：

image
Indentation(缩进标签) -> indent

通过indent标签可以设置缩进，可以使用像素、百分比、字体单位为其值。在遇到新的缩进标签或者结束标签前，缩进标签的效果会一直存在，即使是跨行后效果依然会存在
```
1\. <indent=15%>It is useful for things like bullet points.</indent>

2\. <indent=15%>It is handy.
```
显示效果为：

image
Line Height(行高标签) -> line-height

通过line-height可以在不用修改字体的情况下，设置高度可以使用行与行之间离的更近或者更远，其值可以是像素值、字体单位、百分比
```
Line height at 100%
<line-height=50%>Line height at 50%
<line-height=100%>Rather cozy.
<line-height=150%>Line height at 150%
Such distance!
```
显示效果为：

image
Line-Indent(行缩进标签) -> line-indent

一般用在每一行的开始位置，指示此行将缩进，此标签只影响手动换行，不影响使用文字转义换行
```
<line-indent=15%>This is the first line of this text example.
This is the second line of the same text.
```
显示效果为：

image
Text Link(超链接标签) -> link

通过使用link标签可以为文本段添加链接数据，格式为<link="ID">,链接中的ID值应当是唯一的，这样才能在交互时才能知道是哪个链接发生了交互

不需要给每个链接一个唯一ID，当链接到相同的数据多次时，可以使用同一个ID。link标签虽然允许与用户交互，但是它本身并不会改变文本的外观，一般情况下为了标识清楚，多数会设置样式带有下划线
Lowercase,Uppercase,and Smallcaps(大写、小写与小大写标签) -> lowercase uppercase smallcaps

更改文本大小写样式。
```
<lowercase>Alice and Bob watched TV.</lowercase>
<uppercase>Alice and Bob watched TV.</uppercase>
<smallcaps>Alice and Bob watched TV.</smallcaps>
```
显示效果为：

image
Margin(边距标签) -> margin

使用margin标签可以调整文本的水平边距
```
Our margins used to be very wide.
<margin=5em>But those days are long gone.
```
显示效果为：

image
Mark(标记标签) -> mark

使用mark标签可以在文本的上层添加一个覆盖，以突出显示这部分文本内容。由于mark标记是在文本上层的，所以一般情况下需要一定的透明度，才能看到底下的文本
```
Text <mark=#ffff00aa>can be marked \nwith an overlay.
```
显示效果为：

image
MonoSpacing(??) -> mspace

使用mspace可以所有的字符转换为等宽的字体
```
Any font can become<mspace=2.75em> monospace, if you really want it.
```
显示效果为：

image
Noparse(禁用富文本标签) -> noparse

某些时候并不希望文本被解释为标记文本，如果想禁用标记则可以使用noparse
```
Use <noparse></noparse> for bold text.
```
显示效果：

image
Non-breaking Spaces(字词不破坏标签) -> nobr

对单词往往希望字符保持在一起而不是被自动换行分隔，此时可以使用nobr标签
```
You don't want I M P O R T A N T things to be broken up.
```
显示效果为：

image
Page Break(分页标签) -> page

可以使用page标签在文本中插入分页符，将文本分成几个部分，使用些标签前提是文本框属性使用overflow同时设置为page模式
Horizontal Position(水平位置标签) -> pos
FontSize(字号标签) -> size

使用size标签可以随时调整字体的大小，可以像素、字体单位或百分比，使用像素调整可以是绝对的也可以是相对的，例如：+1和-1
```
<size=100%>Echo <size=80%>Echo <size=60%>Echo <size=40%>Echo<size=20%>Echo
```
显示效果为：

image
Horizontal Space(水平间距标签) -> space

使用space标签可以在水平方向中添加一个偏移，就像是添加了多个空格一样。可以使用像素、字体单位或百分比设置
```
Give me some <space=5em> space.
```
显示效果为：

image
Sprite(精灵标签) -> sprite

使用sprite标签可以将图集中的图素添加到文本中，格式为按索引<sprite index=1>或者按名称<sprite name="spriteName">,此标签是不需要结束符,对于Sprite需要提交在配置中定义

默认情况下精灵不受文本顶点颜色的影响，如果需要影响Sprite则需要添加tint=1属性，可以使用color属性为sprite添加其它颜色
```
Sprites! <sprite=0> More sprites! <sprite index=3> And even more! <sprite name="Default Sprite Asset_4" color=#55FF55FF>
```
显示效果为：

image
Strikethrough and Underline(删除线与下划线标签) -> s u

可以使用s标签添加删除线，使用u标签添加下划线
```
The <s>quick brown</s> fox jumps over the lazy dog
```
显示效果为：

image
Style(样式标签) -> style

可以通过style标签自定义样式，不过定义时需要指定样式的名称。
```
 <style="Title">Styles</style>
 You can create your own.
```
显示效果为：

image
Subscript and Superscript(上标与下标标签) -> sup sub

使用sup可以添加上角标，使用sub可以添加下角标。角标具体显示位置可以在字体中定义
```
We have 1m3 of H2O.
```
显示效果为：

image
Vertical Offset(垂直偏移标签) -> voffset

使用voffset可以使用文本基于baseline在垂直方向上产生偏移
```
Up <voffset=1em>up <voffset=2em>UP</voffset> and <voffset=-0.5em>down</voffset> we go again.
```
显示效果为：

image
Text Width(文本宽度标签) -> width

使用width标签，可以在文本内调整文本区域水平大小，但不能超出文本对象原始的大小
```
I remember when we had lots of space for text.
<width=60%>But those days are long gone.
```
显示效果为：

image

Unity插件之TextMeshPro 富文本【转】

Unity插件之TextMeshPro 6.富文本

简介

声明

TextMeshPro富文本标签

相关文章

网友评论

延伸阅读

深度阅读

栏目导航

热点阅读