传统的显示字体是使用系统的ttf,如果需要更多效果通常做法是:
1、上网找带有特效的ttf;
2、把需要显示的字合并成图片,显示时在程序里面根据单个文字图片名字显示;
3、使用bmfont,把需要显示的文字生成fnt,png;
4、自定义ttf文件
方法1的优点是简单,但是太盲目,有时不一定能找到需要的ttf,如果只需要自定义少数的文字,ttf文件就显得比较大。方法2的优点是适用于文字比较少的情况,方法3适用于事先知道需要显示哪些文字;方法4适用于需要自定义大量文字的情况
这里的需求是美术希望在显示伤害数字时候显示自定义字体效果,具体如图
其中的红色和白色数字就是要显示的效果。
具体实现步骤:
1、下载Bmfont工具,
运行后选择Open Image Manager
打开界面后是
点击Image
选择importImage,选择图片后出现对话框
其中id填写鼠标移动到要显示的数字上面时右下角的左边数字。
在options->font setttings设置需要的字体,大小,在export options中根据实际显示的图片大小设置生成的纹理图片大小,生成的图片格式,比如png,tga,文字信息格式,比如txt,xml,
按ctrl +s 或者选择 save bitmap font as生成的文件包含fnt,png,
这里特别说下为了降低渲染批次,把多套数字图片合并在一起,最终生成下面的图片,具体的读取指定的数字图片在文章后面会详细介绍。
在unity编辑器里面选择NGUI->open bitmap font maker
把前面生成的fnt文件拖动到font data, png图片拖动到texture, atlas里面选择指定的atlas,create the font,生成文字prefab,如图,
如果前面生成的bmfont工具有问题,会导致生成的prefab缺少sprite选项,如图
不然放到UILabel中是无法显示,也没报错,所以要确定这一步的效果和图片上一致。
使用时把prefab拖动到指定项即可,如图
怎么在同一张图片里面读取指定的数字,前面在bmfont工具设置指定的数字图片时是根据红色设置为半角unicode,白色设置为全角unicode,其中数字全角的unicode需要上网查找获取, 效果图如图
在程序中获取int数字显示时,思路是根据数字获取对应的unicode编码值,然后转成string即可
具体实现如图
如果显示的是非数字,比如字母,实现思路都可以参考这里的数字实现。
也思考过如果在同一张图片中合并大于2套数字图片时怎么解决,可以一套是使用原来的unicode,一套使用@到I,以此类推,如图。