位图字体制作工具

发表于 2022-05-18 分类于 02工具

位图字体因何而生？优缺点是什么？

位图字体的出现是为了处理像TTF一类的字体文件在不同平台显示有差异的问题。

因为可以由美术出图，所以呈现出的效果能够比字体文件更美观。

不需要用户去安装某个字体，就能够达到设计者想要呈现的效果。从游戏开发的角度来讲，也缩小了安装包的体积。

但是只适用于文本复杂度不高的情况，像文本无法固定的聊天内容，就不适用了。

工具	平台限制	官网	下载地址	是否免费	备注
BMFont	仅Windows	链接	前边链接上有	免费	这个用得比较多
Glyph Designer	仅MacOS	链接	前边链接上有	60块一个月	功能比BMFont更强，但需要付费
Littera	跨平台(在线工具)	链接	不用下载，浏览器打开这个网址就行	免费	这个还蛮好用的，但需要安装Flash。Littera在油管上的视频。
SnowBamboo	跨平台(在线工具)	链接	不用下载，浏览器打开这个网址就行	免费	这个类似Littera，但不需要Flash。github仓库，给作者加星。
Hiero	跨平台的（因为是Java做的）	链接	前边链接上有	免费	这个我没用过
convert2fnt	仅Windows	没得	去搜嘛	免费	这是我之前在网上找到的一个小众软件，易用，功能较弱

2023/03/23更新：Littera这个网址挂了。

在使用之前，需要设置软件，其中许多设置我不懂，还是去看看官方文档吧。

我们可以把这些设置保存成一个.bmfc文件。下次使用时可以直接加载这个配置文件，不用每次都去设置一遍。

有两种制作方式，第一种是使用某个字体，然后选中某些字符，然后导出。第二种是提供图片给BMFont，然后设定好图片和字符的对应关系，然后导出。

我们通常是采用读取文本文件的方式来选择字符。

这里需要特别注意文本的编码，比方说在Windows系统上，用记事本保存文件时，有ANSI、UTF-16 LE、UTF-16 BE、UTF-8、带有BOM的UTF-8，我测试了一下，ANSI和UTF-8是不行的。

Edit->Open Image Manager->Image->Import image，Id那里填上数字，这个数字就对应着ASCII码里的某个字符，绑定成功后就会显示一个蓝色的小点。

第一行是对字体的介绍。info 开头：

字段	说明	BMFont设置	备注
face	字体	Font Settings -> Font graphics -> Font
size	字号	Font Settings -> Font graphics -> Size
bold	是否加粗	Font Settings -> Font graphics -> Bold
italic	是否斜体	Font Settings -> Font graphics -> Italic
charset	字符集
unicode	是否unicode
stretchH	纵向缩放百分比		horizontal表示水平，vertical表示水平。那为啥这个叫纵向缩放百分比呢？
smooth	是否开启平滑
aa	是否开启抗锯齿
padding	内边距
spacing	外边距
outline	描边	Font Settings -> Effects -> Outline thickness

第二行是对应所有字贴图的公共信息。common 开头：

字段	说明	BMFont设置	备注
lineHeight	行高	Font Settings -> Font graphics -> Font
base	字的基本大小		没搞懂这个是在哪里设置的，有什么用
scaleW	合图的宽	Export Options -> Texture -> Width
scaleH	合图的高	Export Options -> Texture -> Height
pages	合图有几张
packed	图片是否压缩
alphaChnl	透明度
redChnl	红色
greenChnl	绿色
blueChnl	蓝色

第三行是对应当前字贴图的信息

字段	说明	BMFont设置	备注
id
file	合图名字

第四行是当前贴图中所容纳的文字数量

字段	说明	BMFont设置	备注
chars count	文字数量

第五行起把当前贴图中所用到的所有文字的编码以及对应在图片上的矩形位置，偏移等列出来

把BMFont生成的png拖入PS里，右键图层，点混合选项，那里可以加描边，然后保存图片就行。

abcdefghijklmnopqrstuvwxyz
ABCDEFGHIJKLMNOPQRSTUVWXYZ~!@#$%^&*()-+=_`|{}\[]:";'<>?,./1234567890