Unity 文本解决方案:富文本插件TextMeshPro

2023-10-14 15:30

本文主要是介绍Unity 文本解决方案:富文本插件TextMeshPro,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

  • TextMeshPro是Unity收购的一个第三方插件,现在已经自动内置到编辑器中,只要使用一次就会自动导入到工程。
  • TextMesh Pro是Unity的终极文本解决方案。它是Unity的UI Text和Text Mesh网格的完美替代品。
  • 功能强大,易于使用,TextMesh Pro使用先进的文本渲染技术,以及一套自定义着色器;提供实质性的视觉质量改进,同时给用户提供难以置信的灵活性,当涉及到文本样式和纹理。
  • TextMesh Pro提供了对文本格式和布局的改进控制,具有诸如字符、单词、行和段落间距、字距、对齐文本、链接、30多个可用的富文本标记、支持多种字体和精灵、自定义样式等功能。
  • 由于TextMesh Pro创建的几何图形和Unity的文本组件一样,每个字符使用两个三角形,所以这种改进的视觉质量和灵活性并不需要额外的性能成本。
  • 优化桌面和移动设备,TextMesh Pro带来了最先进的文本渲染统一

组件介绍:

Main Setting:
Font Asset:TMP的字体资源。
Materail Preset:字体用到的材质
Font Style:字体风格,粗体,斜体,下划线等等
Auto Size:自动适应大小(和Text一样)
Vertex Color:字体颜色
Color Gradient:勾选之后会出现渐变色的控制参数
Override Tags:勾选之后富文本的<color>标签会失效
Spacing Options:字体、单词、行、段落间距。单词的判定依据是空格,段落的判定依据是换行。
Alignment:对齐方式
Wrapping:是否自动折行
Overflow:溢出方式
    Overflow:可以溢出

    Ellipsis:超出时将超出部分用...替代

    Truncate:无法溢出

    Page:将文本内容分成很多页可以通过切换页签id来切换内容

    Linked:可以关联一个其他的TMP组件多余部分将显示在新的组件里面(实际测了下没有起效果)

    Masking:不明

    ScrollRect:不明

Extra Setting:
Margins:上下左右边界调整
Geometry Sorting:不明
RichText:是否支持父文本
Raycast Target:是否支持UI事件响应
Parse Escape Characters:是否解析转义字符
Visible Descender:不明
Sprite Asset:关联的表情资源文件(如果没有设置,在使用图文混编的时候会自动启用系统默认的表情资源)
Kerning:是否开启自动紧缩。有些字母排列在一起的时候会显得比较空如T e,开启后会显示为Te。
Extra padding:官方文档说的是某些比较小的字体在排版时可能被裁剪掉,开启该选项可以防止这个现象。目前没有遇到过这个情况,如果以后遇到了就开启试试吧。
轮廓、阴影、外发光:
以上这些特性由shader实现,所以使用这些特性需要通过调整材质面板对应的参数

轮廓:

 

outline:外轮廓参数,其中:【Color】是轮廓颜色。【Thickness】决定了外轮廓的厚度。【Texture】则会将texture的纹理采样之后和color混合输出最终颜色,这里的texture应该设置为repeat模式。因为speed参数可以使得外轮廓有一个uv流动的效果,可以用来做流动的外轮廓,如果用clamp就没有流动效果了。
Face:控制内部的表现(外轮廓以内的字体部分),和outline联合使用,其中:【Color】是内部颜色,该颜色会合字体顶点色(组件面板的Vertex Color)叠加在一起作为最终字体的颜色。【Softness】是会控制外轮廓的柔和程度。【Dilate】控制的是内部区域的大小。texture同outline,不过纹理会叠加到内部区域。
阴影:

 

轮廓参数中有一个勾选框,可以开启和禁用该特性。
【Color】阴影颜色,【Offset】阴影的偏移量,【Dilate】影响阴影大小,【Softness】柔和程度。
外发光:

 

【Color】外发光颜色,【Offset】内外交界处的偏移为整数则沿法线向外偏移,【Inner】外发光向内部扩散的距离,【Outer】外发光向外部扩散的距离,【Power】强度。
表情混编使用:
      我们平时开发游戏的时候经常会遇到图文并列的情况。比如一个上商店界面,需要在购买按钮上展示消耗的货币图标和数量。一般处理的时候都是做两个预制件,一个处理图片,一个处理文字,在用布局组件控制排版。比较繁琐。。。

      有了TMP的混编功能只需要一个TMP组件加一个带富文本的字符串就可以实现功能了。如string costtxt = string.format("<sprite=index> X {0}", costnum)。极大的简化了工作量,像一些图文混编的聊天功能也可以用TMP组件轻松的实现。ps:其中index是关联的表情资源(Extra Setting里的Sprite Asset)的序号(这个可以看表情制作这块)。

下面是一个使用的参考:

 

表情资源制作:
1.导入需要用于制作表情的图片到unity中,将Sprite Mode设置为Multiple。

2.点击sprite Editor将每一个表情分割出来。(图是百度随便扒的)


 

为了使文字和图片对齐,中心点设置为左下。
3.保存退出sprite编辑界面,右键选中处理好的图片,依次选Create->TextMeshPro->Sprite Asset即可生成Sprite Asset。

4.将生成好的Sprite Asset拖到TMP组件中使用。

 

5.编写富文本

 

6.最终效果

 

中文字体制作:
字体资源的制作有很多种方式,这里只介绍一种添加中文支持的方式(因为我在自己的项目中只用了这一种 ^-^! )。

1.在window->TextMeshPro里面打开Font Asset Creator

 

Source Font File中添加支持中文的字库
Character Set 设置为Custom Characters(自定义字符集)
Custom Character List中添加需要用到的中文字符,点击保存就得到支持中文的TMP字体了。
***这里有一个内存优化点

Atlas Resolution 决定了生成字体图片的大小

Samping Point Size 可以设置为自动尺寸和自定义尺寸两种模式

如果设置为自动尺寸则生成的单个字符会自动缩放以占满整个图片

如果设置为自定义尺寸则可以指定游戏中使用最多的那个尺寸大小,然后根据最终所有字符占用的尺寸大小来调整Atlas Resolution,以避免占用多余的内存。

关于性能:
关于性能有两个点可能要注意一下。

1.使用图文混编图片和文字会分别占用一个dc(因为二者使用的材质信息不同)。因此TMP中混编的图片同样要注意不要和字体发生重叠,否则就会打断文本自身的合并处理增加dc。如果有重叠的时候就将带图片的放在上层(貌似同一个组件中图片的层级会默认比文字高),这样文字和文字之间dc仍然是合并的。

2.TMP组件支持的外发光,光照,阴影这些特性都是在shader中实现的,如果全开的话势必会增加渲染的开销。建议根据项目情况去选择不同的shader来生成字体,比如插件自己提供的mobile里的shader(mobile里的shader不仅仅是删除了部分功能如光照外发光,本身对外轮廓,阴影的算法也做了简化)。如果使用需求明确的话,也可以根据需求去裁减修改插件提供的shader。总之够用就行。
——————— 

引用:  

https://zhuanlan.zhihu.com/p/84700094

 

 

 

这篇关于Unity 文本解决方案:富文本插件TextMeshPro的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/211396

相关文章

Python中图片与PDF识别文本(OCR)的全面指南

《Python中图片与PDF识别文本(OCR)的全面指南》在数据爆炸时代,80%的企业数据以非结构化形式存在,其中PDF和图像是最主要的载体,本文将深入探索Python中OCR技术如何将这些数字纸张转... 目录一、OCR技术核心原理二、python图像识别四大工具库1. Pytesseract - 经典O

javax.net.ssl.SSLHandshakeException:异常原因及解决方案

《javax.net.ssl.SSLHandshakeException:异常原因及解决方案》javax.net.ssl.SSLHandshakeException是一个SSL握手异常,通常在建立SS... 目录报错原因在程序中绕过服务器的安全验证注意点最后多说一句报错原因一般出现这种问题是因为目标服务器

C++高效内存池实现减少动态分配开销的解决方案

《C++高效内存池实现减少动态分配开销的解决方案》C++动态内存分配存在系统调用开销、碎片化和锁竞争等性能问题,内存池通过预分配、分块管理和缓存复用解决这些问题,下面就来了解一下... 目录一、C++内存分配的性能挑战二、内存池技术的核心原理三、主流内存池实现:TCMalloc与Jemalloc1. TCM

苹果macOS 26 Tahoe主题功能大升级:可定制图标/高亮文本/文件夹颜色

《苹果macOS26Tahoe主题功能大升级:可定制图标/高亮文本/文件夹颜色》在整体系统设计方面,macOS26采用了全新的玻璃质感视觉风格,应用于Dock栏、应用图标以及桌面小部件等多个界面... 科技媒体 MACRumors 昨日(6 月 13 日)发布博文,报道称在 macOS 26 Tahoe 中

Python实现精准提取 PDF中的文本,表格与图片

《Python实现精准提取PDF中的文本,表格与图片》在实际的系统开发中,处理PDF文件不仅限于读取整页文本,还有提取文档中的表格数据,图片或特定区域的内容,下面我们来看看如何使用Python实... 目录安装 python 库提取 PDF 文本内容:获取整页文本与指定区域内容获取页面上的所有文本内容获取

MyBatis Plus 中 update_time 字段自动填充失效的原因分析及解决方案(最新整理)

《MyBatisPlus中update_time字段自动填充失效的原因分析及解决方案(最新整理)》在使用MyBatisPlus时,通常我们会在数据库表中设置create_time和update... 目录前言一、问题现象二、原因分析三、总结:常见原因与解决方法对照表四、推荐写法前言在使用 MyBATis

Java死锁问题解决方案及示例详解

《Java死锁问题解决方案及示例详解》死锁是指两个或多个线程因争夺资源而相互等待,导致所有线程都无法继续执行的一种状态,本文给大家详细介绍了Java死锁问题解决方案详解及实践样例,需要的朋友可以参考下... 目录1、简述死锁的四个必要条件:2、死锁示例代码3、如何检测死锁?3.1 使用 jstack3.2

html 滚动条滚动过快会留下边框线的解决方案

《html滚动条滚动过快会留下边框线的解决方案》:本文主要介绍了html滚动条滚动过快会留下边框线的解决方案,解决方法很简单,详细内容请阅读本文,希望能对你有所帮助... 滚动条滚动过快时,会留下边框线但其实大部分时候是这样的,没有多出边框线的滚动条滚动过快时留下边框线的问题通常与滚动条样式和滚动行

Oracle修改端口号之后无法启动的解决方案

《Oracle修改端口号之后无法启动的解决方案》Oracle数据库更改端口后出现监听器无法启动的问题确实较为常见,但并非必然发生,这一问题通常源于​​配置错误或环境冲突​​,而非端口修改本身,以下是系... 目录一、问题根源分析​​​二、保姆级解决方案​​​​步骤1:修正监听器配置文件 (listener.

MySQL版本问题导致项目无法启动问题的解决方案

《MySQL版本问题导致项目无法启动问题的解决方案》本文记录了一次因MySQL版本不一致导致项目启动失败的经历,详细解析了连接错误的原因,并提供了两种解决方案:调整连接字符串禁用SSL或统一MySQL... 目录本地项目启动报错报错原因:解决方案第一个:第二种:容器启动mysql的坑两种修改时区的方法:本地