完整课程入口:996 全套课程体系 | Lua 学习路径 | 幂尔框架 mirs.cn
伤害飘字、排行榜名次这类需要多字号、描边发光的文字效果,位图字体(BMFont 预渲染图集)与 SDF 字体(有向距离场实时渲染)是两条路线。选型影响包体、显存与任意缩放下的清晰度。本文用同一套字符集做对照实测。
位图字体:预渲染每个字符的图集,运行时按 UV 取图拼接。字号固定(如 24px),放大到 48px 会模糊,需要多套图集。SDF:图集里存的是"到字形边缘的距离场",运行时按距离重建边缘,一套 64px 图集可任意缩放并保持锐利,还自带描边与发光能力(Shader 里按距离阈值上色)。
同一套常用汉字 3500 字 + ASCII,两条路线各生成一份:
| 指标 | 位图 24px | 位图 48px | SDF 64px |
|---|---|---|---|
| 图集体积 | 1.1MB | 3.8MB | 2.2MB |
| 48px 显示清晰度 | 模糊 | 清晰 | 清晰 |
| 描边/发光 | 需另做图集 | 需另做图集 | Shader 参数 |
| 首次加载 | 快 | 快 | 需 Shader 支持 |
SDF 一套图集覆盖全部字号并内置描边发光,代价是需要一个支持 SDF 采样的 Shader(Cocos2d-x 内置 Label 组件已含 SDF 支持,开启即可)。
三种场景三条路:静态界面文字(按钮、固定文案)→ 系统字体直接渲染,无需字体图集;伤害飘字、排行榜这类多字号 + 描边需求 → SDF;纯图标化的少量固定字符(+1、NEW 标记)→ 位图字体最小成本。混合使用完全合理:主界面系统字体、战斗数字 SDF、活动标记位图。
SDF 开启后验证中文渲染(部分老版本引擎的 SDF 对中文 distance field 生成参数有差异);字符集按使用频率裁剪(3500 常用字通常只用到 800 字,图集体积再降 60%);飘字高频创建销毁配合对象池(飘字流程参考 Action 动画篇)。三步走完,文字渲染的包体、显存、清晰度三项同时达标。