【咸鱼教程】BitmapLabel位图字体使用

引擎版本3.2.6

教程目录
一 为什么要使用位图字体
二 如何使用位图字体
2.1 TextureMerger制作位图字体
2.2 exml中使用位图字体
三 Demo源码

一  为什么要使用位图字体
egret在手机端发布的h5，一般显示的都是手机自带默认字体。
要显示特殊字体的话，一般会用到位图字体。例如下图中的伤害数字。

二 如何使用位图字体
2.1 TextureMerger制作位图字体

首先打开Texturemerger。（https://www.egret.com/products/others.html#egret-texture）

选择Bitmap Font

新建字体，我随意新建的test

选择添加字符

添加如下图片。字体图片一般是美工提供，我这里自己随意制作的。

注意左边栏的图片名要和数字一致。比如左边栏“1”就对应着图片数字1。
如果是图片是“啊”，则左边栏图片名也应该是“啊”。

导出字体

得到两个文件。一张位图字体的png图，和一个fnt字体配置文件。
将两个文件导入default.res.json中加载。

任意新建一个exml皮肤文件，拖动一个BitmapLabel控件到exml上。

选中BitmapLabel，设置位图字体为我们的test_fnt。
如果没有，看看是不是没有将test.fnt和test.png导入default.res.json。

设置BitmapLabel的文本为“123”，则可以看到位图字体可以正常显示了。

三 源码Demo