[一起写信] Unity富文本的探索继续

最近接了些代做Unity项目的工作
都是些很简单的Unity App应用
教育科普类App,医疗健康科普App……

嗯,这些应用的开发都不可避免的使用到TMP文字
看到TMP文字就会想到Rich Text
不同版本的Unity对Rich Text的支持程度也是不一样的
我在想……胡桃日记的一起写信到底支持多少种Rich Text方法呢

首先我得查找Unity官方的文档
描述文字
(这是TMP文字4.0.0pre.2的支持情况)

然后我们还得了解……胡桃日记用的什么版本的Unity开发?

在官方开发某期vlog中,我看到了这一帧
描述文字
这个Unity开屏画面……看起来版本应该是2020版的Unity

(我最开始学Unity用的就是Unity 2020.3.21和2020.3.30)
描述文字
​
那时候我成功将胡桃的mmd模型(pmx.)转换成了.fbx导入Unity

(当时还不会调整Shader)
描述文字
描述文字

既然是2020的话,那么应该查阅2020版的tMP Rich Text的官方文档
描述文字
​描述文字

之前介绍过些用法

■基本样式标签
粗体文字
<i>斜体文字</i>
<u>下划线文字</u>
<s>删除线文字</s>

■字体大小调整
<size=50>50号文字</size>
<size=150%>放大1.5倍</size>
<size=50%>缩小一半</size>

■字体颜色
<color=#FF0000>红色字</color>
<color=green>绿色字</color>

■嵌套组合
<size=40><color=#FFD700>黄金大字</color></size>

而这一篇是在原有的基础上继续介绍更多的用法
都是一个一个去试的

■在这之前我想补充一下有关于<color>的知识点

介绍<color>的时候有提过一嘴,不仅可以使用#+16进制表示颜色,也可以直接在后面直接加表示颜色的单词实现
如<color=green>green</color>

这里列出在Unity中<color>富文本标签支持的颜色

描述文字

好的,那么进入正题

■<align> :文本对齐方式

描述文字

官方文档说明:
每个文本对象都有整体对齐方式,但可通过标签覆盖此设置。除几何中心外,所有水平对齐选项均可用。
通常应在段落开头放置这些标签。连续的对齐作用域不会叠加。若同一行放置多个对齐标签,则最后一个标签覆盖先前设置。
闭合标签
将使对象恢复为整体对齐状态。

<align=”left”> … </align>

👉 左对齐
文字会从左边开始排,剩下的区域空出来。
就像 Word 里最普通的排版。

-–

<align=”center”> … </align>

👉 居中对齐
文字会放在整行的中间,两边留白。
常用于标题。

-–

<align=”right”> … </align>

👉 右对齐
文字会从右边开始排,左边留白。
在聊天窗口里有时会用来表示对方/自己的消息。

-–

<align=”justified”> … </align>

👉 两端对齐
文字会被拉伸,让每一行都能贴满左右边缘。
(除了最后一行不会强制拉伸)
常见于书籍或正式文档。

<align=”flush”> … </align>

👉 完全对齐
和 justified 很像,但是 最后一行也会被拉伸,
即整段文字每一行都填满边界,没有空白。
(效果可能会让字间距显得比较怪)

在胡桃日记一起写信中就是这样
​描述文字
​描述文字
​

lowercase>, <uppercase>, <allcaps> 和 <smallcaps>

描述文字
Lowercase 将文本转换为小写,uppercase 将文本转换为大写,allcaps 将文本转换为全部大写,而 smallcaps 则将所有字母转换为小型大写字母。

小写、大写与小号大写字母

<lowercase>、<uppercase>、<allcaps> 和 <smallcaps> 这些标签会在文本渲染之前改变其大小写。然而,你在 Text 文本框里输入的原始内容会保持不变。
• <lowercase> 和 <uppercase> 标签的作用和你预想的一样,它们会在渲染前把文本分别转换为全小写或全大写。
• <allcaps> 标签的功能和 <uppercase> 标签完全相同。
• <smallcaps> 标签的作用类似于 <uppercase>,但它还会把所有你输入的小写字母(a, b, c…)的字号缩小。

简单来说:

• <lowercase>:将所有英文字母转为小写。
• <uppercase>:将所有英文字母转为大写。
• <allcaps>:等同于 ,功能也是将所有英文字母转为大写。
• <smallcaps>:将所有英文字母转为大写,但原本是小写的字母会以较小的字号显示。

在胡桃日记一起写信中就是这样

描述文字

(实测<smallcaps>不适用于胡桃日记的这个字体,)

<alpha> :用于改变文本的不透明度(即透明度)。它的值是一个十六进制数。

​描述文字

用法解释

• 标签格式:<alpha=#XX>,其中 XX 是一个从 00 到 FF 的两位十六进制值。
• 不透明度值:

​ • #FF 代表完全不透明(FF 是 255 的十六进制表示),文本颜色是实心的。

​ • #00 代表完全透明(00 是 0 的十六进制表示),文本是看不见的。

​ • 介于 00 和 FF 之间的值,如 #88,表示半透明。值越小,文本越透明。

示例分析

官方文档给出的例子展示了不同十六进制值对应的透明度效果:
• <alpha=#FF>FF:FF 文本是完全不透明的。
• <alpha=#CC>CC:CC 文本比 FF 稍透明。
• <alpha=#AA>AA:AA 文本半透明。
• <alpha=#88>88:88 文本更透明。
• <alpha=#66>66:66 文本透明度更高。
• <alpha=#44>44:44 文本非常透明。
• <alpha=#22>22:22 文本几乎看不见了。
• <alpha=#00>00:00 文本完全透明,看不见。

简单来说, 标签允许你精细地控制文本的透明度,从而实现一些视觉上的特殊效果,例如淡入淡出或者突出显示部分文本。

在胡桃日记一起写信中就是这样
​描述文字

<cspace> :用于调整字符间距

可以以像素(px)或字体单位(em)为基础进行绝对或相对调整。正值会拉开字符间距,负值则会收紧间距。当你使用 标签关闭时,间距会恢复到字体默认设置。
​描述文字

用法详解

• <cspace> 标签:这个标签让你能精确控制文本中单个字符之间的距离。它能帮助你在UI设计中实现更美观、更具可读性的布局。
• 单位:
• em (字体单位):这是相对于当前字体大小的单位。例如,1em 的间距等于当前字体大小,这对于保持不同大小文本的间距比例一致非常有用。
• px (像素):这是绝对单位。10px 的间距在任何字体大小下都是固定的 10 像素。
• 正值与负值:
• 正值 (+):增加间距,让字符之间显得更宽松。
• 负值 (-):减少间距,让字符之间更紧凑。

示例分析

官方提供的例子很好地展示了 <cspace> 的两种用法:
• <cspace=1em>Spacing</cspace>:这句话中的 “Spacing” 字符间距被拉开,增加了 1 个字体单位的间距。这使 “Spacing” 看起来更宽敞、更突出。
• <cspace=-0.5em>timing</cspace>:这句话中的 “timing” 字符间距被收紧,减少了 0.5 个字体单位的间距。这使得 “timing” 看起来更紧凑。

通过这种方式,你可以仅对文本中的特定部分应用间距调整,而不会影响整个文本块。这对于创建具有视觉层次感的UI元素,例如强调某个词或短语,非常有效。

在胡桃日记一起写信中就是这样

描述文字

<font> :可以让你在文本中切换到不同的字体。

​描述文字

用法详解

• 切换字体: 使用 <font=”字体资源名”> 标签来指定你想使用的字体。这个字体会替换默认字体,直到你用 标签将其关闭。
• 嵌套使用: 标签可以嵌套,这意味着你可以在一个字体标签内部再使用另一个字体标签来切换字体。
• 切换材质: 你可以使用 material 属性来切换同一种字体的不同材质。例如,你可以让同一种字体显示为描边、阴影或发光效果。字体和材质资源必须在 TextMesh Pro Settings 中进行设置。
• 恢复默认字体:
​ a. 使用
标签来关闭所有正在使用的字体标签。
​ b. 也可以使用 <font=”default”> 标签来直接切换回默认字体。

示例分析

• Would you like <font=”Impact SDF”>a different font?: 这句话中的 “a different font?” 会使用名为 “Impact SDF“ 的字体资源来显示,而其他部分则保持默认字体。
• or just <font=”NotoSans” material=”NotoSans Outline”>a different material?: 这句话中的 “a different material?” 会使用名为 “NotoSans“ 的字体,但会应用名为 “NotoSans Outline“ 的材质,从而可能呈现出描边或不同的视觉效果。

理论上来说,可以通过这个<font>标签,调用游戏内的其他字体来写信,比如胡桃信件上的”方正喵呜体”,以及日记本上的”素材集市康康体”

然而……实现这个有几个条件
1.游戏包体必须要有这个字体(包括包本体以及动态更新字体文件)
2.玩家必须知道这些字体在游戏原始文件中的文件名
(注意,因为用了TMP字体,所以是SDF字体文件的命名,而不是TTF或者OTF字体的名称)
3.(Secret,等一会儿再说)

那么主要还是第二点,我们需要知道字体的文件名称
所以这里需要分析胡桃日记游戏apk包体(过程略)

描述文字

然而当我成功获取到这些字体的名称的时候,使用这个富文本,却失败了
反复确认字体的名称没有问题,但是在游戏里确实实现不了

描述文字

我打开了我的Unity也尝试一下这个<font>自定义字体富文本,一开始也没有成功

后来我想到Unity TMP的默认示例字体”LiberationSans SDF”
于是我就试了一下,结果就……
​描述文字
(因为LiberationSans SDF默认仅支持英文字符,所以汉字字体没有任何改变)

默认的LiberationSans SDF居然成功了,那这是为什么呢?
我去外网搜了半天(大概花了打这个帖子1/4的时间)
得到的答案是……
​描述文字
​描述文字

原来<font>这个富文本标签是对SDF字体文件路径是有要求的(就像是Unity Editor脚本必须放在名为Editor的文件夹中才能生效)

也就是说,第三点就是
3. 对于开发者侧,SDF字体文件必须正确存在于Asset/TextMeshPro/Resource/Font & Materials这个路径中
<font>对于SDF字体位置是强依赖的。。。

于是我又在我的Unity里尝试里了一下,确实是这样的
​描述文字

所以这就表示
似乎官方并没有按照这个路径来存放SDF字体文件,故使用<font>时无法在富文本中正确调用
(assets/loadable/font/dynamicfont/fzzj-ttybjw SDF)
(根据解析结果来看,似乎是动态加载的)

而LiberationSans SDF默认字体,正好就在正确的路径
(因为使用TMP字体的时候必须导入TMP插件,LiberationSans SDF作为示例字体出现,没什么事儿的话基本没人会动这个字体文件的路径)

所以就可以正确被<font>调用(不过仅支持英文)

怎么说呢,有点遗憾,研究了半天是这样的结果
除非开发组会将SDF字体资源移动到Resource/Font & Materials下的路径

(如果提这个事情的话……嘛还是算了吧,开发组设计这功能之初应该就没考虑富文本这种花里胡哨的的情况)

嘛,还是继续吧,还有一堆富文本标签要看

<indent>:它的作用是控制文本的缩进。

描述文字

<indent> 标签的作用**

<indent>标签和 <pos> 标签很相似,都可以用来设置水平光标位置,但 <indent> 的效果会持续到后续所有行。

• 持续性:<indent> 标签一旦被使用,它影响的不仅是当前行,如果文本发生换行(Word-wrapping),后续的每一行都会保持同样的缩进。
• 创建模式:这个特性让它非常适合创建文本模式,比如项目符号列表(Bullet Points)。
• 支持单位:你可以用像素(px)、字体单位(em)或百分比(%)来指定缩进量。

示例分析

  1. <indent=15%>It is useful for things like bullet points.</indent>2. <indent=15%>It is handy.
    • 1. <indent=15%>:这会使第一行文本从光标的**15%**位置开始显示。
    • It is useful for things like bullet points. 这段文本如果因为太长而换行,后续的新行也会从同样 15% 的位置开始。
    • </indent>:这个闭合标签会取消缩进效果,让下一段文本(2. <indent=15%>It is handy.)恢复到默认的左对齐。

简单来说,<indent> 标签就像在打字机上按下了“Tab”键,并且这个缩进效果会一直保持下去,直到你显式地取消它。

在胡桃日记一起写信中就是这样
​描述文字

<line-height> :可以用来手动控制文本的行高。

描述文字

<line-height> 标签的作用

<line-height> 标签用于控制下一行文本的起始位置,它不会改变当前行的位置。
• 影响下一行:它决定了下一行文本距离当前行有多远。
• 调整距离:使用较小的值会让行距更紧凑,而使用较大的值会让行距更宽松。
• 支持单位:你可以用像素(px)、字体单位(em)或百分比(%)来指定行高。
• 相对调整:通过 <line-height> 标签进行的调整是相对于字体资源(Font Asset)中设定的默认行高。使用闭合标签</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!

• 第一行 “Line height at 100%” 保持默认行高。
• <line-height=50%>:这使得接下来的 “Line height at 50%” 行的行高变为默认行高的 50%,因此行距会变得更小。
• <line-height=100%>:这使得接下来的 “Rather cozy.” 行的行高恢复到默认的 100%。
• <line-height=150%>:这使得 “Line height at 150%” 行的行高变为默认行高的 150%,行距会变得更宽。

• 最后的 “Such distance!” 文本会继续使用上一个 150% 的行高设置,直到遇到新的 </line-height> 或新的 <line-height> 标签。

在胡桃日记一起写信中就是这样
​描述文字

<line-indent> :用于控制文本的行缩进。

描述文字

<line-indent> 标签的作用

这个标签会在标签插入位置之后以及每次手动换行后(包括使用<br> 标签换行)插入水平空间。它的效果只对手动换行起作用,对自动换行(word-wrapping)无效。
• 只影响手动换行:<line-indent> 的核心特点是它只对你主动使用换行符(如回车键或 <br>)产生的换行生效。
• 持续性:一旦启用,它会影响后续所有手动换行的行,直到遇到闭合标签 </line-indent>。
• 支持单位:你可以用像素(px)、字体单位(em)或百分比(%)来指定缩进量。

示例分析

This is the first line of this text example.This is the second line of the same text.
• <line-indent=15%>:这个标签插入后,它后面的文本(”This is the first line…”)会缩进 15%。
• 接下来,当你手动换行时,第二行(”This is the second line…”)也会从同样的 15% 位置开始,而不是从文本框的左侧边缘开始。

在胡桃日记一起写信中就是这样
​描述文字

(节选自·永无止境的废话文学)

<margin> 用于增加文本的水平外边距。

描述文字

<margin> 标签的作用

这个标签可以用来在文本的左右两侧添加额外的水平空间,将文本整体向内“推”。
• <margin>:同时调整左右两侧的外边距。
• <margin-left>:只调整左侧的外边距。
• <margin-right>:只调整右侧的外边距。

它们会使文本的宽度变窄,并使其在文本框内居中。
• 单位:你可以用像素(px)、**字体单位(em)或百分比(%)**来指定外边距大小。
• 负值:负值没有任何效果。
• 相对调整:通过这些标签进行的调整是相对于 TextMesh Pro 对象中设定的默认外边距。使用闭合标签 </margin> 可以恢复到默认值。

示例分析

Our margins used to be very wide.<margin=5em>But those days are long gone.
• 第一行 “Our margins used to be very wide.” 文本使用默认的边距。
• <margin=5em> 标签会给接下来的文本 “But those days are long gone.” 的左右两侧都增加 5 个字体单位的外边距。
• 结果是,这段文本的实际宽度会变窄,使其看起来更居中,或者说向内缩进了。
• </margin> 闭合标签则会将后续文本的边距恢复到默认设置。

在胡桃日记一起写信中就是这样
​ ​描述文字

<mark>:用来在文本上添加一个高亮或标记效果。

描述文字

<mark> 标签的作用**

标签会在文本上方添加一个有颜色的覆盖层(overlay),可以用来突出显示文本的某个部分。它的功能类似于在纸质书上用荧光笔做标记。

• 半透明:由于标记层会覆盖在文本上方,所以你必须使用半透明的颜色,这样下面的文字才能透出来。这意味着你指定的颜色值必须包含Alpha 通道(即透明度)。
• 颜色格式:颜色值必须是十六进制格式,例如 #ffff00aa。这里的 #ffff00 代表黄色,而最后的 aa 则代表透明度。aa 是 16 进制值,对应 170,表示半透明。ff 代表完全不透明,00 代表完全透明。
• 不可叠加:你不能将多个 <mark> 标签叠加使用。每一个 <mark> 标签都会影响从它自身到下一个 <mark> 标签或一个闭合 标签之间的文本。

示例分析

Text <mark=#ffff00aa>can be marked with</mark> an overlay.
• <mark=#ffff00aa>:这个标签在它后面的文本上添加了一个半透明的黄色覆盖层。
• can be marked with:这段文本会被高亮显示。
• </mark>:闭合标签结束了高亮效果。
因此,最终的显示效果是,”can be marked with” 这几个单词的背景会显示为半透明的黄色,而其他部分的文本则保持不变。

在胡桃日记一起写信中就是这样(但是好像有bug啊)
​描述文字

<mspace> 一个关于 等宽字体 的标签

描述文字

<mspace> 标签的作用**

<mspace> 标签可以覆盖字体的默认字符间距,将它变成一个等宽字体(monospace font)。这意味着在 <mspace> 标签内的所有字符,都将占据相同的水平空间。

• 等宽:无论字符的实际宽度是多少(比如窄窄的 “i” 和宽宽的 “m”),<mspace> 都会强制它们使用相同的水平宽度。这使得文本的对齐更加整齐,常用于代码显示、ASCII 艺术等场景。
• 单位:你可以用像素(px)或字体单位(em) 来指定字符的宽度。
• 闭合标签:</mspace> 闭合标签会清除所有等宽设置,让后续文本恢复到原始字体的间距。

示例分析

Any font can become <mspace=2.75em>monospace, if you really want it.
• <mspace=2.75em>:这个标签将后续文本的字符宽度强制设定为 2.75em。
• monospace, 这段文本中的所有字符,无论其本身宽度如何,都会被调整为占据 2.75em 的水平空间。
• </mspace>:闭合标签结束了等宽效果,后面的文本 if you really want it. 则会恢复到原始字体的非等宽显示。

在胡桃日记一起写信中就是这样
​描述文字

<nobr> 一个关于 防止换行 的标签。

描述文字

<nobr> 标签的作用**

<nobr> 标签用于确保特定的单词或词组不会被自动换行。它会强迫被包裹的文本保持在同一行内,即使这会超出文本框的边界。

• 防止断行:它的核心功能是保持一段文本的完整性,防止它被自动分到两行。这对于显示重要的短语、专有名词或特定的格式化文本非常有用。
• 恢复默认:闭合标签 会恢复到默认的换行行为,允许文本在行尾自动换行。
• 限制:如果你用 标签包裹的文本太长,无法在一行内显示,它依然会在行尾被强制换行,但不会像普通文本那样在单词间断开。

示例分析

You don’t want <nobr>I M P O R T A N T things to be broken up.
• <nobr>I M P O R T A N T</nobr>:这个标签确保了 “I M P O R T A N T” 这几个字母(虽然中间有空格)不会因为行尾而被分开,它们会作为一个整体被放在同一行。

在胡桃日记一起写信中的举例

比如写信人想要发送胡桃的电话号码,文案如下

(不加<nobr>的情况)
描述文字

(加了<nobr>的情况,这时候电话号部分强制为一个整体,不因为超过文本框边界而强制上下行分开)
描述文字

(这个电话仍然可以打通)
​描述文字

<noparse> :用于创建一个不被解析的文本区域。

描述文字

<noparse> 标签的作用

<noparse>标签的主要功能是告诉 TextMesh Pro 不要将它包裹的文本内容识别为富文本标签。

• 用途:当你想在屏幕上显示那些本身就是富文本标签的字符串时,这个标签就非常有用。例如,你可能需要向用户展示如何使用 <b> 标签来加粗文本,但如果不使用 <noparse>,<b> 标签本身就会被渲染成加粗效果,而不会被显示出来。
• 效果:它创建了一个“隔离区”,在这个区域内的所有内容,都会被视为普通文本,不会被执行任何富文本命令。

示例分析

Use <noparse><b></noparse> for bold text.
• <noparse><b></noparse>:这部分的作用是让 <b> 这个字符串本身被显示出来,而不是被解析为加粗命令。
• for:这部分是普通文本。
• bold:这部分则会被正常解析,bold 这个词会被加粗显示。

最终的显示效果是:Use <b> for bold text.
简而言之,<noparse> 标签就像一个“引号”,让你能原样显示代码或标签,而不让它们被执行。

在胡桃日记一起写信中就是这样
​描述文字

有了<noparse>的引入,前面例子中的<nobr>富文本失效了

<pos>:用于直接控制文本的水平位置。

描述文字

<pos> 标签的作用

<pos> 标签可以让你精确地设置下一个字符或单词开始显示的水平光标位置。

• 直接控制:它就像一个绝对定位的指令,告诉文本从指定的水平位置开始渲染。
• 位置独立:<pos> 标签在文本行中的位置并不重要,它的效果总是基于文本框的左侧边缘。
• 单位:你可以用像素(px)、**字体单位(em)或百分比(%)来指定水平位置。

示例分析

at <pos=75%>75%at <pos=25%>25%at <pos=50%>50%at 0%

这个例子很特别,因为它以一种非线性的方式展示了 <pos> 的效果。如果按顺序渲染,显示效果应该是:

  1. at:显示 “at”。
  2. <pos=75%>:将光标直接移动到距离文本框左边缘 75% 的位置。
  3. 75%:在这里显示 “75%”。
  4. at:紧接着 “75%” 显示 “at”。
  5. <pos=25%>:将光标移动到距离左边缘 25% 的位置。
  6. 25%:在这里显示 “25%”。
  7. at:紧接着 “25%” 显示 “at”。
  8. <pos=50%>:将光标移动到距离左边缘 50% 的位置。
  9. 50%:在这里显示 “50%”。
  10. at 0%:紧接着 “50%” 显示 “at 0%”。

这个例子巧妙地利用了标签的非线性效果,展示了你可以随意跳跃到任何位置来放置文本。它最适合与左对齐一起使用。

在胡桃日记一起写信中就是这样
​描述文字

<rotate> 用于旋转文本中的每个字符。

描述文字

<rotate> 标签的作用

<rotate> 标签可以让你单独旋转文本中的每一个字符,旋转量以度为单位。

• 旋转方向
• 正值(如 45)使字符逆时针旋转。
• 负值(如 -45)使字符顺时针旋转。
• 影响间距:旋转会改变字符之间的距离,有时会导致字符重叠。
• 搭配使用:为了解决重叠问题,通常需要配合 <cspace>(字符间距)标签一起使用,来调整字符的间距。

示例分析

Rotate text <rotate=”-10”>counter-clockwise</rotate> or <rotate=”10”>clockwise</rotate> 这段代码展示了两种旋转方向。
• <rotate=”-10”> 标签让 “counter-clockwise” 这段文本的每个字符都顺时针旋转了 10 度。
• <rotate=”10”> 标签则让 “clockwise” 的每个字符逆时针旋转了 10 度。
Rotate text <rotate=”45”>counter-clockwise</rotate> 这个例子展示了更大的旋转角度(45 度),这会使得字符之间的重叠可能性大大增加。
Rotate text <cspace=”15”><rotate=”45”>counter-clockwise</rotate></cspace> 这个例子是解决重叠问题的示范。它先用 <cspace=”15”> 标签增加了字符间距,然后用 <rotate=”45”> 标签旋转了字符。这样可以确保字符在旋转后不会互相遮挡。

<rotate> 标签让你能够为文本创建独特的视觉效果,但为了保持可读性,可能需要搭配其他标签来调整排版。

在胡桃日记一起写信中可以这样
​描述文字

<space>:用于在文本中插入一段水平空间。

标签可以让你精确地在文本的任意位置插入一段空白的水平距离,就像你按了多次空格键一样。

• 单位:你可以用像素(px)或字体单位(em)来指定这段空间的长度。
• 影响换行:如果 标签紧挨着文字,它会将偏移量附加到旁边的文字上,这可能会影响文本的自动换行。
• 独立换行:如果你希望这段空间能够独立于文字而换行(即在它后面可以自动换行),确保在 标签的
两侧都添加一个空格
。

** 示例分析**

Give me some <space=5em> space.
• <space=5em> 标签在 “some” 和 “space” 这两个单词之间插入了 5 个字体单位的水平空间。
• 即使字体间距很小,这两个单词之间也会有一个明显的宽敞间隔。

总的来说, 标签提供了一种比普通空格更精确的文本排版控制方式,让你可以在需要的地方创造出精确的水平间距。

在胡桃日记一起写信中可以这样
​描述文字

<sprite>:它能让你在文本中插入图片,实现图文混排的效果。(需要在TMP字体上制作SpriteSheet)

描述文字

<sprite> 标签的作用

<sprite> 标签允许你将 精灵图片(Sprites) 从一个 Sprite Asset 资源中插入到文本里。这些精灵资源必须放在 TextMesh Pro settings 指定的文件夹中。

• 默认资源:你可以直接通过索引或名称来访问默认精灵资源中的图片。

​ • 通过索引:<sprite index=1> 或简写 <sprite=1>。这会插入资源列表中索引为 1 的精灵。
​ • 通过名称:<sprite name=”spriteName”>。这会插入名为 “spriteName” 的精灵。

• 非默认资源:如果你想使用其他 Sprite Asset 中的精灵,必须先指定该资源。

​ • 通过索引:<prite=”assetName” index=1>。
​ • 通过名称:<sprite=”assetName” name=”spriteName”>。

• 着色:你还可以给精灵着色。

​ • tint=1:会用 TextMesh Pro 文本组件的顶点颜色给精灵上色。
​ • color=#FFFFFF:可以指定一个十六进制颜色值来改变精灵的颜色。

在胡桃日记一起写信中可以这样
​描述文字

<sub> 和 <sup> :上标和下标

描述文字

<sub> 和 <sup> 标签用于将文本渲染成上标或下标。这在科学记数法和序号(如1st, 2nd, etc.)中非常常见。

• <sup>:用于创建上标(Superscript),文本会显示在基线上方,并且字号会变小。
• <sub>:用于创建下标(Subscript),文本会显示在基线下方,并且字号会变小。

注意:上标和下标的偏移量和字号大小是在 Font Asset 中预先设置好的。

示例分析

We have 1m3 of H2O.
• <sup>3</sup>:这个标签将 3 渲染为上标,通常用于数学和科学表达式,比如体积单位 m3。
• <sub>2</sub>:这个标签将 2 渲染为下标,常用于化学式,比如水分子 H2O。

在胡桃日记一起写信中可以这样
​描述文字

写到这里已经9800/10000多字,50张图片超上限了
这些应该差不多够用了

那么,我们来小结一下吧!

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
//1.■基本样式标签
<b>粗体文字</b>
<i>斜体文字</i>
<u>下划线文字</u>
<s>删除线文字</s>
//2.■字体大小调整
<size=50>50号文字</size>
<size=150%>放大1.5倍</size>
<size=50%>缩小一半</size>
//3.■字体颜色
<color=#FF0000>红色字</color>
<color=green>绿色字</color>
//4.■嵌套组合
<size=40><color=#FFD700><b>黄金大字</b></color></size>

//5.■文本对齐
<align="left"> ... </align> 左对齐
<align="center"> ... </align> 居中对齐
<align="right"> ... </align> 右对齐
<align="justified"> ... </align> 两端对齐
<align="flush"> ... </align> 完全对齐

//6.■小写、大写与小号大写字母
<lowercase>...</lowercase>:将所有英文字母转为小写。
<uppercase>...</uppercase>:将所有英文字母转为大写。
<allcaps>...</allcaps>:等同于 <uppercase>...</uppercase>,功能也是将所有英文字母转为大写。
<smallcaps>...</smallcaps>:将所有英文字母转为大写,但原本是小写的字母会以较小的字号显示。

//7.■改变字体不透明度
<alpha=#XX>...</alpha>
<alpha=#FF>FF:FF 文本是完全不透明的。
<alpha=#CC>CC:CC 文本比 FF 稍透明。
<alpha=#AA>AA:AA 文本半透明。
<alpha=#88>88:88 文本更透明。
<alpha=#66>66:66 文本透明度更高。
<alpha=#44>44:44 文本非常透明。
<alpha=#22>22:22 文本几乎看不见了。
<alpha=#00>00:00 文本完全透明,看不见。

//8.■调整字符间距
<cspace=1em>Spacing</cspace>

//9.■切换字体(目前仅支持LiberationSans SDF)
<font=LiberationSans SDF>...<font> (仅支持英文)

//10.■控制文本的缩进
<indent=15%>...</indent>

//11.■手动控制文本的行高
<line-height=50%>...</line-height>

//12.■控制文本的行缩进。
<line-indent=15%>...</line-indent>

//13.■用于增加文本的水平外边距
• <margin>...</margin>:同时调整左右两侧的外边距。
• <margin-left>...</margin>:只调整左侧的外边距。
• <margin-right>...</margin>:只调整右侧的外边距。
• <margin=5em>...</margin>:调整5个字符单位长度的外边距(也可使用像素或者百分比)

//14.■在文本上添加一个高亮或标记效果
<mark=#ffff00aa>...</mark>

//15.■等宽文字
<mspace=2.75em>...</mspace>

//16.■防止换行
<nobr>...</nobr>

//17.■不被解析的文本区域(富文本无效化)
<noparse>...</noparse>

//18.■直接控制文本的水平位置
<pos=75%>...</pos>
也可以用像素(px)、字体单位(em)或百分比(%)**来指定水平位置。

//19.■旋转文本中的每个字符
<rotate="10">...</rotate>
<rotate="-10">...</rotate>

//20.■在文本中插入一段水平空间
<space=5em>...</space>

//21.■在文本中插入图片(需要有对应TMP SpriteSheet支持)
<sprite index=1...</sprite>
<sprite=1>...</sprite>
<sprite name="spriteName">...</sprite>

//22.■上标和下标
<sup>...</sup>
<sub>...</sub>

END

这次不只是写帖子的工作,还有阅读文档,方法验证,游戏包体分析等工作

虽然又不是第一次写这种体量的长贴,但是这次真的累

游戏账号:@猫小然Nekorachan

END