← 返回博客

VberAI 位图字体生成器:上传字形 / 精灵图拆分,BMFont 进 Unity

VberAI Studio 位图字体生成器:支持上传字形图片、上传精灵图自动拆分,输出 AngelCode BMFont(.fnt + PNG),画布可编辑,再导入 Unity / Godot / Cocos。

发布于
  • vberai
  • ai-studio
  • bitmap-font
  • bmfont
  • fnt
  • angelcode
  • sprite-sheet
  • glyph
  • game-ui
  • unity
  • godot
  • cocos
  • tutorial
VberAI 位图字体生成器:上传字形 / 精灵图拆分,BMFont 进 Unity

VberAI Studio(短称 AI Studio,≠ Google AI Studio)支持位图字体生成器:按字符集在面板生成,也支持上传字形图片,以及上传精灵图并自动拆分——产出带度量信息的游戏字体图集。结果留在同一块游戏画布上,可继续像素化、抠图或导出;跨引擎通行格式是 AngelCode BMFont 的 .fnt + PNG(导出项以面板为准)。

入口:AI Studio。术语:位图字体。

这就是 游戏位图字体 / BMFont 工作流:固定字符集与风格,带 .fnt 度量进 Unity / Godot / Cocos。

游戏里为什么还要位图字体

动态 TTF / OTF 适合长文和任意字号。游戏 HUD、分数、金币计数、像素标题、描边发光数字往往要的是另一件事:字号锁死、风格画进贴图、缩放不发糊、引擎加载可控。

常见三条弯路:

  1. 用动态字体硬撑 — 一放大描边碎、一缩小像素字发灰;过滤模式一开线性插值,格子边就糊。
  2. 手绘单字 PNG,没有度量文件 — 引擎不知道每个字形的宽、高、基线和字距,只能当散图拼。
  3. 桌面 / 在线 BMFont 打完再下载 — 图集和 .fnt 出了工具,还要另开软件修边、像素化、再进 Unity / Godot / Cocos。

AI Studio 把生成放在可编辑的游戏工作台:字体是资产,不是下载完就结束的 zip。

独立 BMFont 工具VberAI 位图字体生成器
入口另开桌面软件或网站同一 AI Studio 画布
输入多从 TTF / 系统字 rasterize面板生成、上传字形图、上传精灵图自动拆分
产出多为 .fnt + 图集下载图集落在画布,可继续编辑
风格依赖源 TTF 与工具特效按面板生成,或沿用已上传字形 / 精灵图
之后多半只剩导入引擎画布上修完再进引擎

三种进字方式

按钮名以面板为准,常见三条路径:

方式适合什么时候
面板按字符集生成还没有素材,直接出 HUD 数字、像素字、风格化数字
上传字形图片美术已画好单字 PNG,缺 .fnt 里的宽、高、advance
上传精灵图并自动拆分整张 0123456789 横条、字符表、数字 sprite sheet,要自动切格并写度量

精灵图拆分和 原位切图 / 图层拆分 思路相近,但产物是 BMFont 图集 + .fnt,不是 UI Prefab。

位图字体 / BMFont 是什么

可验收的定义:

  1. 图集 — 把要用的字形栅格化进一张(或少量)PNG。
  2. 度量文件 — 通常是 AngelCode BMFont 的 .fnt:每个字符的 UV、宽高、xoffset / yoffset、xadvance。
  3. 运行时 — 引擎按字符串从图集取样拼出 Label,而不是现场解析矢量轮廓。

它解决的是「固定字号、固定风格的游戏文字」;不等于 TextMesh Pro 的 SDF 正文字体,也不等于全量中日韩动态字体。

位图字体(BMFont)动态 TTFSDF / MSDF
观感风格烘焙进贴图,像素可锁随字号矢量光栅化缩放相对干净
适合HUD、分数、像素标题、艺术数字长文、聊天、设置页要缩放的 UI 正文
代价字号 / 字符集一变就要重出图集描边与像素风难控像素格锁边不如位图硬

什么时候用,什么时候不用

用: 血条数字、关卡分数、金币 / 钻石计数、技能 CD、像素风标题、带描边或金属质感的数字条。字符集小、字号固定。

不用: 剧情对白、邮件、聊天、设置说明;需要任意缩放的界面正文;完整汉字 / 假名 / 韩文词库。全量 CJK 会把图集体积打爆,应继续用动态字体或 SDF。

在 AI Studio 里怎么生成

按钮文案以面板为准,流程对齐下面四步。

1. 打开位图字体生成器

在 AI Studio 画布打开位图字体生成器。

位图字体生成器面板

2. 选输入方式,再定字符集和字号

在面板生成、上传字形图片、上传精灵图并自动拆分 里选一条(以面板为准)。无论哪条,都要先写清「游戏里会出现哪些字」。

HUD 常见只要 0123456789、+$%/., 和少量拉丁字母。缺字会在运行时变成空白或方框;多字会撑大图集。

字号按最终 HUD 像素定,而不是按设计稿再放大一倍——位图字体放大等于放大贴图。上传精灵图时,切格间距和 padding 要在拆分后看一眼,避免 advance 过紧。

3. 生成并预览图集

出图后检查:字形是否齐基线、描边有没有吃进邻近字、半透明发光有没有脏边、图集有没有浪费空白。需要像素风时,可在同一画布接 图片像素化;需要透明底时接 抠图。

4. 导出后进引擎

导出项以面板为准。跨 Unity / Godot / Cocos Creator 时,优先核对是否拿到:

  • 一张(或成套)PNG 图集
  • 一份 .fnt(AngelCode BMFont 文本或二进制;引擎文档以 .fnt 为准)

文件名、页码和 .fnt 里的贴图引用必须一致,否则引擎能认出字体却显示粉图 / 空白。

导入 Unity / Godot / Cocos

下列是可验收清单,不是编辑器全流程。导入后用一串 0123456789SCORE 看齐行、字距和透明边。

引擎中使用 BMFont 显示分数

Unity

  • 图集 Filter Mode 用 Point(无滤波) 才能锁像素边;线性过滤会发糊。
  • 旧版 UGUI:Custom Font + 带该图集的材质,再挂到 Text。
  • TextMesh Pro:用 Font Asset Creator 做 bitmap 字体资源,或导入 BMFont 对(以你工程所用 TMP 版本为准)。
  • 常见返工:材质槽为空、.fnt 指向的贴图名和导入名不一致。

Godot 4

Godot 支持 BMFont(.fnt)。把 .fnt 与 PNG 放在同一目录导入,赋给 Label(或 RichTextLabel)的字体槽。若只导入 PNG、没有 .fnt,引擎无法得知字形矩形。

Cocos Creator

Cocos 的位图字体由 .fnt + .png 组成:.fnt 是字符缩略图索引。将二者放入资源目录,Label 的字体类型选位图字体(具体菜单名以 3.x 面板为准)。不要和 LabelAtlas(等宽格子数字条)混用——后者没有完整 BMFont 度量。

返工清单

  • 缺字 — 先补字符集再重出,不要在引擎里拿另一套 TTF 混排。
  • 基线不齐 — 数字 1 与 0、逗号与小数点最容易露馅。
  • 字距过紧 / 过松 — 改 .fnt 的 xadvance 或回到生成器调间距。
  • 描边脏边 — 半透明发光叠在邻字上;图集内多留 1–2 像素 padding。
  • 放大发糊 — 位图不要当矢量用;要缩放改用 SDF / MSDF 或动态字体。
  • 图集过大 — 砍字符集,或拆「数字套」与「标题套」。

适合谁

独立开发者和小团队做 HUD 分数、像素标题、风格化数字:字符集小、字号固定,需要 .fnt + PNG 进包,又不想在桌面 BMFont 工具和引擎之间来回倒文件。

边界

  • 首版图集很少等于可上线终稿;商标字形、语种缺字、多分辨率仍要人工验收。
  • 引擎内压缩、图集打包、字体材质与过滤模式在工程侧落地。
  • 面板文案、输入源(源字体 / 风格参考)与导出格式以当前 AI Studio 为准。
  • VberAI Studio ≠ Google AI Studio;见 对比。

小结

要的不是「再多一个在线 BMFont」,而是风格化数字和像素字能作为带度量的游戏资产进包。生成 → 预览图集 → 画布上修边或像素化 → .fnt + PNG 进 Unity / Godot / Cocos,都在 AI Studio。

常见问题

位图字体和 BMFont 是什么?
位图字体把字形画进 PNG 图集,用度量文件告诉引擎每个字怎么切。BMFont(AngelCode)的 .fnt + PNG 是 Unity、Godot、Cocos 都认的一套通行格式。

VberAI 能生成游戏位图字体吗?
能。在 AI Studio 画布使用位图字体生成器,按字符集出图集,或上传字形图 / 精灵图补度量,并在同一画布继续编辑或导出(以产品面板为准)。

能上传字形图片或精灵图吗?
能。支持上传字形图片(单字 PNG 等)写入字体;也支持上传精灵图并自动拆分(如数字条、字符表),生成 BMFont 的 .fnt 与图集(以面板为准)。

和动态 TTF、SDF 字体怎么选?
固定字号的 HUD、像素标题、风格化数字用位图;长文和要缩放的 UI 用动态 TTF 或 SDF / MSDF。

进 Unity 要注意什么?
图集用 Point 过滤;Custom Font 或 TMP bitmap 都能接 BMFont 对,但贴图名必须和 .fnt 一致,材质不能空。

能做全汉字图集吗?
不适合。完整中日韩字符集会撑爆图集。位图字体留给数字、拉丁字母和少量标题字;正文继续用动态字体。

你可能还会喜欢这些文章