成品预览 环境与工具 cocos2d-x 2.2.3,AngelCode,PhotoShop在我参与的项目中,由于美术对战斗表现非常苛刻,飘血等飘字的样式否需要逐字自定义,例如上图中的Zzz,闪避,反击,等等,最初他们设想是把所有飘字做成各个散图,用飘图来代替最初的飘文字.这绝对不是一种好的方法.于是我想到了自定义位图字体.在 cocos2d-x源码中发现CCLabelBMFont对位图字体支持的非常不错.因为CCLabelBMFont中仅仅看某个字的矩阵范围,而这个矩阵里是什么 有什么 完全不会干涉.创建位图字体首先需要使用一款叫做AngelCode的工具.步骤如下:
AngelCode的使用 - 新建一个文本文件,写入要做成位图的字,例如:反击 挡 连击 闪 睡(Zzz)
- 保存为UTF8格式
- AngelCode中Edit->Select chars form file
- AngelCode中Options->Font Setting 设置size大小
- AngelCode中Options->Font Setting 选择默认字体
- AngelCode中Options->Export Options修改 间隙像素 建议 > 3,
- AngelCode中Options->Export Options修改Texture寛高
- AngelCode中Options->Export Options修改Bit深度为32
- AngelCode中Options->Export Options修改File Format为Text
- AngelCode中Options->Export Options修改Textures为png文件
- AngelCode中Options->Save Bitmap font as生成位图字体
为适用cocostudio的自定义位图控件还需要改一下两个地方: - 打开输出的.fnt修改file="xxx_0.png" 为file="xxx.png"
- 修改输出的.png文件名xxx_0.png 改为xxx.png
修改个别特殊字的矩阵 上图中我的睡字 其实是用了Zzz符号代替的,但是这个符号比睡字大根本放不下.怎么办呢?我们可以直接修改.fnt文件中睡字所在的矩阵范围.例如原来的是: - char id=30561 x=390 y=0 width=74 height=74 ....省略后面部分
复制代码
74×74的寛高直接被我修改为: - char id=30561 x=390 y=0 width=112 height=94 ....省略后面部分
复制代码
这样就解决了个别特殊字体过大的问题,当然 也可以在程序里把字体放大,但是美术们好像对放大的效果不满意.所以直接修改fnt数据应该是最好的方法了. 在cocos2dx中使用 - std::string szString("睡睡");
- std::string szFontName("FightFilyFont.fnt");
- CCLabelBMFont::create( szString, szFontName, kCCLabelAutomaticWidth, kCCTextAlignmentCenter );
复制代码
本文来自:http://shadowkong.com/archives/1859
|