Egret社区
本帖最后由 张宇 于 2015-9-25 14:05 编辑

做游戏的时候,为了好看经常要使用到位图字体。用ShoeBox这个免费的跨平台工具,就可以非常简单的制作出egret支持的fnt格式的图片字体。
a1.png
1) 在photo中把需要的字符都敲出来,我加了个渐变和描边效果。注意字符的间隔要大一点,要不然会识别不出来。
然后存成一张png24位的透明图片。

a2.png
2)打开ShoeBox,把刚才存的透明图片拖到 GUI里的 Bitmap Font上。然后见证奇迹的时刻到了
a3.png
3)ShoeBox会自动识别出每个字符,测量出长宽高。注意每个字符的左上角会显示一个对应的字符,因为我不是按照它默认的顺序做的字。所以顺序是乱的,对应不上,需要重新设置一下。点击下面的settings
a4.png
4)会出现一个设置界面,其中有一项TxtChars,这里面是字符的顺序,按照我们输入的顺序重新敲一遍,然后点击apply
a5.png
5)这回字符就都对应上了。点击Save,保存出来一张png图片和一个.fnt格式的配置文件,这个配置文件还需要修改一下
a8.png

a7.png
6)用记事本打开.fnt配置文件。上面是原始的。下面是修改过的。默认是带着路径的,删掉就可以了。当然你也可以修改对应的文件名,让可读性更好一些。

7)好了,添到resources里egert就可以调用啦。很简单,美术mm可以独立完成。
ps:友情提示,最好把所有的文字都放到一行里,否则可能会出现高度对不齐的现象,可能是个bug




QQ20140628-1.png
分享到 :
17 人收藏

26 个回复

倒序浏览
7yue  官方团队 | 2014-6-26 12:02:05
好教程!
developer  初学乍练 | 2014-8-14 21:24:31
我想问一下楼主,在resources里面这样子配置对么?
{"name":"BabyFontPNG","type":"image","url":"assets/BabyFont.png"},
        {"name":"BabyFont","type":"font","url":"assets/BabyFont.fnt"}
张宇  官方团队 | 2014-8-14 22:13:57
developer 发表于 2014-8-14 21:24
我想问一下楼主,在resources里面这样子配置对么?
{"name":"BabyFontPNG","type":"image","url":"assets/B ...

{"url":"assets/fonts/fontgold.fnt","name":"fontgold","type":"font"}
有一个fnt的就够了,注意type是font
developer  初学乍练 | 2014-8-15 15:04:39
张宇 发表于 2014-8-14 22:13
{"url":"assets/fonts/fontgold.fnt","name":"fontgold","type":"font"}
有一个fnt的就够了,注意type是f ...

那一起生成的png图片要放在同一个目录下么?
developer  初学乍练 | 2014-8-15 15:07:11
张宇 发表于 2014-8-14 22:13
{"url":"assets/fonts/fontgold.fnt","name":"fontgold","type":"font"}
有一个fnt的就够了,注意type是f ...

另外,引用的时候,是直接指定fontFamily么?
this.timerTextField.fontFamily = "fontgold";
张宇  官方团队 | 2014-8-15 15:42:43
developer 发表于 2014-8-15 15:07
另外,引用的时候,是直接指定fontFamily么?
this.timerTextField.fontFamily = "fontgold";
...

官方的example里有样例
https://github.com/egret-labs/egret-examples
tangxuguang212  登堂入室 | 2014-11-28 14:21:51
我想问楼主这个工具在哪里下载呢
张宇  官方团队 | 2014-11-28 14:30:05
tangxuguang212  登堂入室 | 2014-11-28 14:42:12
张宇 发表于 2014-11-28 14:30
http://www.renderhjs.net/shoebox/

非常感谢
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

小黑屋|京网文[2014]0791-191号|京ICP证150115号|Egret社区 ( 京ICP备14025619号 )

Powered by Discuz! X3.4 © 2001-2019 Comsenz Inc.

返回顶部