跳到主要内容

插入文字与字体

使用插入文字编排文字,并将结果作为像素图像放入画布。根据内容选择合适的字体:

字体类型输入方式适合的内容
Resprite Font在字符网格中选择位图字形,保留原有像素与颜色像素文字、图标、表情和 HUD 元素
矢量字体在文本框中输入,调整字号、颜色与排版标题、标签和多行文字

插入后可以通过自由变换调整图像的位置和大小。需要修改文案或字体时,重新编排并插入文字。

打开文字窗口​

选中可编辑的绘图图层和目标帧,再从编辑菜单打开文字窗口:iOS 菜单项为插入字符,桌面端与 Android 为插入文字。插入图像需要使用普通绘图图层;瓦片地图的操作见瓦片地图与瓦片集。

窗口包含字体列表、内容设置与预览。iOS 的窄屏布局会将字体列表放在内容设置上方。

字体管理​

在列表中选择字体后,窗口会显示对应的字符网格或文本输入控件。导入的字体保存在应用内字体库中,可供其他文档使用。

导入字体​

点击字体管理区的 + 按钮,选择支持的字体文件。

平台Resprite Font 文件矢量字体文件
iOS.resfont、.resprite-font.ttf、.ttc、.otf、.otc
桌面端 / Android.resfont、.resprite-font.ttf、.otf

两种 Resprite Font 扩展名都可以导入,导出的字体包使用 .resfont。

iOS 还可以从“文件”App 将支持的字体文件交给 Resprite 打开;桌面端可将支持的字体文件拖入文字窗口。

iOS 导入字体
iOS 导入字体
桌面端字体管理操作
桌面端字体管理操作
把字体文件拖进文字窗口完成导入
把字体文件拖进文字窗口完成导入

整理与导出字体​

选中字体后,可使用字体管理按钮重命名、删除或导出 / 共享。iOS 的共享按钮会打开系统共享面板;桌面端与 Android 使用导出按钮。桌面端还可以直接打开字体文件夹。

要在另一台设备上使用字体,先导出或共享字体文件,再在目标设备上导入。需要扩充字库,可下载字体资源中的 Resprite Font 字体包。

用 Resprite Font 插入文字​

  1. 选择一个 Resprite Font,显示其字符网格。
  2. 在选择字形前设置字间距。字距会随每个新加入的字符记录,修改后影响接下来输入的字符。
  3. 点击网格中的字形拼出内容,需要时使用空格、退格和重置。
  4. 检查预览,点击插入,再在画布上调整图像位置。

需要混合文字与图标时,切换到另一个 Resprite Font 后继续选择字形即可。已经输入的字符会保留各自的字体与字距。

混合使用多种 Resprite Font
混合使用多种 Resprite Font
使用 Resprite Font 教程

用矢量字体插入文字​

  1. 选择矢量字体,在输入框中键入内容,用换行分成多行。
  2. 调整字号、颜色、行距和字距,同时查看预览。
  3. 需要时启用纵向排版。桌面端与 Android 还提供反锯齿开关,控制文字边缘的平滑效果。
  4. 点击插入,在画布上调整位置并确认变换。
多行文字设置
多行文字设置

按最终画布中的大小检查字形和间距,尤其是较小的标签文字。插入前可通过预览比较排版效果。

纵向排版模式
纵向排版模式
使用 TTF 字体教程

创建自定义 Resprite Font​

将自绘的像素文字或图标制作成可重复使用的字库:

  1. 在透明精灵中按等大的网格排列字形,每格放一个字形,画布宽高使用网格尺寸的整数倍。
  2. 选中要用作字库来源的帧,字体使用该帧的合成图像生成。
  3. iOS 打开导出 ▸ 导出为字体;桌面端与 Android 打开文件 ▸ 另存为字体。
  4. 填写字体名称,将字符网格宽高设为绘制时的格子尺寸。设置默认字距,需要等宽排列时启用等宽并指定宽度,再填写作者与描述。
  5. 使用预览检查字形和间距,点击保存将字体加入应用内字体列表。

空网格会被跳过,每个字体最多包含 256 个非空字形。字形应完整放在自己的格子内,避免被切分到相邻字符中。

Resprite Font 模板
Resprite Font 模板

保存后,打开插入文字即可使用新字体。需要分享或转移到其他设备时,在字体列表中选中它,再使用导出 / 共享生成字体文件。

将自定义字体保存到字体列表
将自定义字体保存到字体列表

继续阅读​