找回密码
 立即注册
查看: 143|回复: 0

[笔记] Unity 插件 TextMeshPro 的用法、道理和代码实现

[复制链接]
发表于 2024-7-15 18:12 | 显示全部楼层 |阅读模式
Unity 是一款风行的跨平台游戏开发引擎,它提供了丰硕的功能和东西,可以辅佐开发者快速地创建高质量的游戏。此中,TextMeshPro 是 Unity 的一个插件,它提供了更高质量、更灵活的文本衬着功能,可以满足游戏中各种分歧的文本需求。
对啦!这里有个游戏开发交流小组里面堆积了一帮热爱学习游戏的零基础小白,也有一些正在从事游戏开发的技术大佬,欢迎你来交流学习。
一、TextMeshPro 的用法

  • 安装 TextMeshPro 插件
在 Unity 中安装 TextMeshPro 插件非常简单,只需要在 Unity 的 Asset Store 中搜索 TextMeshPro,然后点击下载和导入即可。

  • 创建 TextMeshPro 对象
在 Unity 中创建 TextMeshPro 对象也非常简单,只需要在场景中点击右键,然后选择 UI -> TextMeshPro -> TextMeshPro - Text 就可以创建一个 TextMeshPro 对象了。

  • 设置 TextMeshPro 属性
在 TextMeshPro 对象的 Inspector 窗口中,可以设置各种属性,包罗文本内容、字体、字号、对齐方式、颜色等等。此中,最常用的属性包罗 TextMeshProUGUI 组件、TextMeshPro 字体、TextMeshPro 颜色、TextMeshPro 对齐方式等。

  • 改削 TextMeshPro 样式
TextMeshPro 提供了各种样式,可以通过改削样式来实现分歧的文本效果。比如,可以设置文本的颜色、字体、暗影、描边、高亮等等。可以通过简单的代码实现这些样式。

  • 使用 TextMeshPro 衬着文本
最后,将 TextMeshPro 对象添加参加景中,然后通过代码设置文本内容,即可使用 TextMeshPro 衬着文本了。
二、TextMeshPro 的道理
TextMeshPro 的道理是基于 Mesh 衬着的,它使用了一种叫做 Signed Distance Field(简称 SDF)的技术,可以在运行时动态生成文本的 Mesh,从而实现更高质量的文本衬着效果。
SDF 技术是一种将二维平面上的图像转换为三维空间中的距离场的技术。在 SDF 中,每个像素点都包含了一个距离值,暗示该像素点距离图像的边缘有多远。通过计算距离值,可以实现各种文本效果,比如描边、暗影、高亮等等。
TextMeshPro 通过使用 SDF 技术,可以实现更高质量、更灵活的文本衬着效果。它可以动态生成文本的 Mesh,从而实现各种效果,比如描边、暗影、高亮等等。同时,TextMeshPro 还提供了丰硕的 API,可以便利地实现各种文本效果。
三、TextMeshPro 的代码实现
下面是一些常用的 TextMeshPro 代码示例:

  • 设置 TextMeshPro 文本内容
可以通过设置 TextMeshProUGUI 组件的 text 属性来设置文本内容。
  1. using TMPro;
  2. using UnityEngine;
  3. public class Example : MonoBehaviour
  4. {
  5.     public TextMeshProUGUI textMeshPro;
  6.     void Start()
  7.     {
  8.         textMeshPro.text = ”Hello, World!”;
  9.     }
  10. }
复制代码

  • 设置 TextMeshPro 文本样式
可以通过设置 TextMeshProUGUI 组件的 font、fontSize、color、outlineWidth、outlineColor、shadowOffset、shadowColor 等属性来设置文本样式。
  1. using TMPro;
  2. using UnityEngine;
  3. public class Example : MonoBehaviour
  4. {
  5.     public TextMeshProUGUI textMeshPro;
  6.     void Start()
  7.     {
  8.         textMeshPro.font = Resources.Load<TMP_FontAsset>(”Fonts/Roboto-Regular SDF”);
  9.         textMeshPro.fontSize = 24;
  10.         textMeshPro.color = Color.white;
  11.         textMeshPro.outlineWidth = 0.1f;
  12.         textMeshPro.outlineColor = 403 Forbidden;
  13.         textMeshPro.shadowOffset = new Vector2(1, -1);
  14.         textMeshPro.shadowColor = new Color(0, 0, 0, 0.5f);
  15.     }
  16. }
复制代码

  • 设置 TextMeshPro 对齐方式
可以通过设置 TextMeshProUGUI 组件的 alignment 属性来设置文本对齐方式。
  1. using TMPro;
  2. using UnityEngine;
  3. public class Example : MonoBehaviour
  4. {
  5.     public TextMeshProUGUI textMeshPro;
  6.     void Start()
  7.     {
  8.         textMeshPro.alignment = TextAlignmentOptions.Center;
  9.     }
  10. }
复制代码

  • 设置 TextMeshPro 描边效果
可以通过设置 TextMeshProUGUI 组件的 outline 属性来设置描边效果。
  1. using TMPro;
  2. using UnityEngine;
  3. public class Example : MonoBehaviour
  4. {
  5.     public TextMeshProUGUI textMeshPro;
  6.     void Start()
  7.     {
  8.         textMeshPro.outlineWidth = 0.1f;
  9.         textMeshPro.outlineColor = 403 Forbidden;
  10.     }
  11. }
复制代码

  • 设置 TextMeshPro 暗影效果
可以通过设置 TextMeshProUGUI 组件的 shadow 属性来设置暗影效果。
  1. using TMPro;
  2. using UnityEngine;
  3. public class Example : MonoBehaviour
  4. {
  5.     public TextMeshProUGUI textMeshPro;
  6.     void Start()
  7.     {
  8.         textMeshPro.shadowOffset = new Vector2(1, -1);
  9.         textMeshPro.shadowColor = new Color(0, 0, 0, 0.5f);
  10.     }
  11. }
复制代码

  • 设置 TextMeshPro 高亮效果
  1. 可以通过设置 TextMeshProUGUI 组件的 richText 属性和 text 属性来设置高亮效果。
  2. using TMPro;
  3. using UnityEngine;
  4. public class Example : MonoBehaviour
  5. {
  6.     public TextMeshProUGUI textMeshPro;
  7.     void Start()
  8.     {
  9.         textMeshPro.richText = true;
  10.         textMeshPro.text = ”<color=yellow>Hello, World!</color>”;
  11.     }
  12. }
复制代码
以上就是 TextMeshPro 的用法、道理和代码实现,但愿能对大师有所辅佐。
懒得打字嘛,点击右侧快捷回复 【右侧内容,后台自定义】
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

小黑屋|手机版|Unity开发者联盟 ( 粤ICP备20003399号 )

GMT+8, 2024-9-8 09:43 , Processed in 0.097236 second(s), 26 queries .

Powered by Discuz! X3.5 Licensed

© 2001-2024 Discuz! Team.

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