Laya位图字体制作

在开发中会依据美术的需求使用特殊的字体来实现游戏的整体风格，最近遇到H5游戏的字体更换的需求，开发所使用的引擎是Laya，这里就使用了位图进行字体制作，核心的制作流程如下：

1.下载windows免费的位图字体制作工具Bitmap Font Generator
下载地址：http://www.angelcode.com/products/bmfont/

2.打开软件，选择 Edit-> Open Image Manager，来设定需要导出的字体的常规设置。

在该页面下进行字体图片的导入和删除，注意在导入对应的图片后要给图片设置ID数值，具体的ID数值是多少可以查询考表格中的对应数字，比如当前导入的图片是0，就可以在表格中去寻找0这个数字，然后进行点击，可以在软件的右下角看到48：30这组数字，48就是0对应的ID数值。

将ID配置好以后退出Image Manager的页面，打开Options下的Export Options页面，进行最后的配置，bit depth配置为32，file format配置为xml，textures配置为png，然后点击OK完成字体的配置，将字体导出，导出为font以及png图片两部分文件。

3.Laya内部进行字体配置
字体导出后再导入Laya工程，注意保持png图片以及font字体文件的名称一致，在使用字体的时候，直接在文本字体配置处将字体的名称进行更改，注意要手动更改，引擎没有引入字体的提示功能，更改好字体名称后进行脚本层面的配置，字体的使用需要在使用前进行字体的初始化，初始化的方式只能以脚本的形式进行，以下是对字体的配置。

export default class DefineFontManager
{
    private fontName: string = "ZoomerFont"; //字体名称    
    private bitmapFont: BitmapFont;
    private bitmapUrl: string = "Font/ZoomerFont.fnt" //字体路径

    public static instance: DefineFontManager;
    public static getInstance(): DefineFontManager
    {
        if(this.instance == null)
        {
            this.instance = new DefineFontManager();
        }        
        return this.instance;
    }
    /**
     * 初始化字体信息
     */
    public initFontData(): void
    {        
        console.log("字体");
        this.bitmapFont = new BitmapFont();
        this.bitmapFont.loadFont(this.bitmapUrl, Handler.create(this,this.setFontData));        
    }

    private setFontData(): void
    {
        console.log("字体");
        //如果位图字体中，没放空格，最好设置一个空格宽度
        this.bitmapFont.setSpaceWidth(10);
        //注册位图字体
        Text.registerBitmapFont(this.fontName, this.bitmapFont);      
        //开启字体自适应大小否则编辑器调节无效果
        this.bitmapFont.autoScaleSize = true
    }
}