游戏蛮牛学习群(纯技术交流,不闲聊):159852603
游戏蛮牛 手机端
开启辅助访问
 找回密码
 注册帐号

扫一扫,访问微社区

教程分享

关注:793

当前位置:游戏蛮牛 技术专区 教程分享

查看: 187|回复: 0

[自学总结] Unity的TextMeshPro插件

[复制链接]  [移动端链接]
2初来乍到
131/150

46

主题

48

帖子

131

积分

Rank: 2Rank: 2

UID
24181
好友
0
蛮牛币
412
威望
0
注册时间
2014-5-7
在线时间
47 小时
最后登录
2018-11-14
发表于 2018-11-4 15:55:38 | 显示全部楼层 |阅读模式

马上注册,结交更多好友,享用更多功能,让你轻松玩转社区。

您需要 登录 才可以下载或查看,没有帐号?注册帐号

x
本文节选自洪流学堂公众号专栏《郑洪智的Unity2018课》,未经允许不可转载。
洪流学堂公众号回复专栏,查看更多专栏文章。



小新:“UI里面还有一类组件是用TextMeshPro开头的,这类组件有啥用啊?”
大智:“TextMeshPro是Unity收购的一个第三方插件,可以解决文字渲染的很多问题,可以替换UI Text。比如UI Text就没办法对文字加入特效。”
小新:“哇,可以直接对文字加入动态特效啊?那就不用美术同学辛苦去做了?”
大智:“是的哦”
小新:“那我们今天就来学习一下这个吧!”
TextMesh Pro
TextMesh Pro是Unity中文字渲染的终极解决方案,原本是一个第三方插件,后被Unity收购后并入Unity,现在可以免费使用。
安装
对于Unity2018及以后的版本,可以从菜单栏Window > Package Manager中安装TextMesh Pro。
Unity2018.2及之后的版本TextMesh Pro包会被默认安装到工程中,无需手动安装。


对于Unity2017及之前的版本,可以通过AssetStore(https://assetstore.unity.com/packages/essentials/beta-projects/textmesh-pro-84126)下载导入此插件。
创建
TextMeshPro最基础的用法就是使用它的Text组件来显示文本。有两种使用方法,一种是通过网格MeshRenderer渲染,一种是通过UI系统渲染。
Mesh方式创建方法:Hierarchy的Create菜单(右键菜单)> 3D > TextMesh Pro - Text
UI方式创建方法:Hierarchy的Create菜单(右键菜单)> UI > TextMesh Pro - Text


第一次创建时,会弹出一个提示窗口:
这似乎是您第一次访问TextMesh Pro,因此我们需要为您的项目添加对使用TextMesh Pro至关重要的资源。这些新资源将放置在项目的根目录中的“TextMesh Pro”文件夹。


点击下方的按钮Import TMP Essentials即可。
导入必要资源后,下方的TMP Examples & Extras会变为可点击状态。这些资源是可选导入的,可以点击Import TMP Examples & Extras来导入实例和额外资源。
Examples&Extras包中包含额外的资源和示例,可以更轻松地发现和学习TextMesh Pro的强大功能。这些额外资源将与TMP基本资源放在同一文件夹中。
TextMesh Pro - Text 和 UGUI - Text 的区别

TextMesh和UIText的渲染对比

UGUI的Text使用了一张字体贴图,Unity把所有需要显示的字符放到了一张图集中,字符的形状是通过像素定义的。当我们放大时,像素不够用就会出现文字变模糊的情况。
TextMesh Pro的Text使用了不同的技术来渲染文字,叫做Signed Distance Field(后面简称SDF,对该技术感兴趣的同学可以自行搜索一下)。和UGUI类似,这个技术同样需要将字符放到一个图集中,但是不使用像素来代表字符的形状,而使用SDF技术来生成字符的形状。使用这种技术字符在渲染时不会因为缩放而造成字符模糊的情况,总是能够准确的渲染字符的边缘。
创建字体
TextMesh Pro无法像UGUI Text那样使用动态字体,因为TextMesh Pro需要对字体进行预处理来计算SDF,这部分计算非常耗时。这对于英文字体来说影响不大,一个字体文件或一张贴图包含的信息都很少,但是对于字符非常多的语言如中文就影响很大。
所以对于中文环境建议如下:
  • 对于游戏中显示的文字可以使用TextMesh Pro的SDF字体,提高显示效果和特效处理。
  • 对于游戏中的输入框建议使用UGUI自带输入框,使用动态字体。
创建SDF字体文件的过程如下:
1、菜单栏打开Window > TextMeshPro > Font Asset Creator


2、在Font Source中选择你想要创建的字体
3、在Character Set中选择要生成的字符集
4、其他选项根据需要进行设置(下面会详细说明每个属性的作用)
5、点击下方的Generate Font Atlas按钮生成字体
6、生成结束后记得点击Save保存**


Font Creator窗口属性
Font Source 选择要创建SDF字体的源字体
Font Size 创建字体的字号的大小。
  • Auto Sizing 建议使用该选项。根据给定Atlas Resolution(图集分辨率)来计算并使用最大字号。
  • Custom 自定义字号。
Font Padding 图集中每个字符之间的间隔,以便在渲染时能却分他们的边缘。此外padding也用于文字的特效,所以不宜过小;但是也不宜过大,过大会造成更大的atlas分辨率或者atlas上能承载的字符更少。对于512*512的图集,padding为5通常比较合适。
Packing Method 打包方式
  • Fast 可能计算出不是最大的字号,但是计算速度会快一些
  • Optimum 可以计算出图集上能承载的最大的字号
    通常在测试设置时使用Fast,在最终打包时使用Optimum
Atlas Resolution 使用SFD字体时,更高的分辨率会产生更精细的渐变,从而产生更高质量的字体。对于大多数字体,仅包含所有ASCII字符时,512x512纹理分辨率足够用。
当需要支持数千个字符时,不得不使用大纹理。但即使在最高分辨率下,也可能无法满足所有要求。在这种情况下,可以通过创建多个字体资源来拆分字符。将最常用的字符放在主字体资源中,将其他字符放在后备(fallback)字体资源中。
Character Set 字体文件中的字符不会自动包含在字体资源中。你必须指定你需要的那些。你可以选择一些预定义的字符集,也可以自己提供字符列表。
  • ASCII 大小写字母+数字+常见符号
  • Extended ASCII 包含所有的ASCII字符
  • ASCII lowercase 小写字母+数字+常见符号
  • ASCII uppercase 大写字母+数字+常见符号
  • Numbers + Symbols 数字+常见符号
  • Custom Range 使用十进制来制定字符的编码范围,可以使用减号和英文逗号来指定范围,如32-126,161-255

使用自定义字符范围时,可以直接引用一个SDF字体,使用这个字体中的字符集

  • Unicode Range(Hex) 使用16进制来制定字符的编码范围,可以使用减号和英文逗号来指定范围,如20-7E,A1-FF
  • Custom Characters 自定义字符,直接输入对应的字符
  • Characters from file 从外部文件中导入字符

注意要包含空格字符,除非确定你不需要它
Font Style 你可以选择几种不同的字体样式。这些设置仅适用于位图字体。
你可以通过shader配置SDF字体的样式,可以选择粗体、斜体、粗体加斜体和描边,也可以控制粗体和轮廓的强度。
Font Render Mode 距离场模式创建SDF纹理需要与SDF shader一起使用。字符是在高分辨率下采样来创建良好的渐变。16x是默认值并且足以用于大多数情况。32x生成较慢但可以让复杂或小字符产生更好的质量。
其他模式直接将字符渲染为位图,以便与位图字体一起使用。Raster模式不使用抗锯齿,Smooth模式使用抗锯齿。两者都有一个Hinted模式,它将字符像素与纹理像素对齐以获得更清晰的结果。
Get Kerning Pairs? 你可以选择从字体中提取字距数据。此数据用于调整特定字符对之间的间距,以产生更好的视觉效果。但是请注意很多字体没有字距数据。
总结
大智:“SDF字体创建完以后就能用于TMP的text了。”
小新:“这个插件确实很强大,文字显示看起来真舒服。”
今日思考题
大智:“把你的界面里的文字替换成TMP的text看看效果如何吧!”
小新:“好嘞”
大智:“收获别忘了分享出来!也别忘了分享给你学Unity的朋友,也许能够帮到他。”
洪流学堂公众号回复专栏,查看更多专栏文章。


回复

使用道具 举报

您需要登录后才可以回帖 登录 | 注册帐号

本版积分规则

关闭

站长推荐 上一条 /1 下一条

快速回复 返回顶部 返回列表