Laya 文本渲染

记录下学习laya引擎：文本渲染

        h5文本渲染一般分为两种方式 1 系统文字，2自定义字体。

        第一，系统文字一般是使用web渲染方式渲染。游戏中若是使用这种方式，会有大量drawcall，这是无法容忍的，所以这需要合批。我开始很好奇这是怎么做到的，因为我理解，网页层面是不能像应用那样直接获取系统字体文件做渲染的。

        先简单回忆一下合批，同shader，同shader参数，同网格，同图片，这就可以动态合批。怎么做到这些，同shader，同shader参数，同网格，这三点好说，同图片怎么做到，系统绘制是没有图片的。其实到这已经可以猜测到一些东西，可以先在离线canvas绘制字体，然后通过getImageData获取绘制的图片数据。这样就得到图片了，只是有个问题，这样提高效率有多少？

        有了猜测，就去验证。Laya引擎就是这么干的，通过离线canvas获取字体，然后获得图片，接下来就是合批了。记录核心代码

        这里获得图片了，还有个问题，怎么做到同一个图片？做图集，图集的大小也需要控制，也需做好回收，最好是记录使用频率的方式回收图集，这样可以减少利用canvas绘制同时也可以也可以减少存储内存。

 上面就是计算图片占有率，每次绘制文字时顺便计算一下。

         第二，自定义字体。window免费制作位图工具，下载地址：

    http://www.angelcode.com/products/bmfont/

        Laya自定义字体解析类：BitmapFont

        根据制作的字体文件，读取uv，宽度等信息，制作texture。大致逻辑与ui图集逻辑渲染相似。