See text-modules and the LibGDX wiki for a list of different BMFont generation tools.
This module operates on JSON descriptions of BMFont files that look like this:
{
pages: [
"sheet_0.png",
"sheet_1.png"
],
chars: [
{ chnl, height, id, page, width, x, y, xoffset, yoffset, xadvance },
...
],
info: { ... },
common: { ... },
kernings: [
{ first, second, amount }
]
}
See here for the full spec.
You can convert from/to various BMFont formats to the above JSON with convert-bmfont.
npm install convert-bmfont -g
For example:
#convert to JSON
convert-bmfont Arial.fnt > Arial.json
#convert to binary
convert-bmfont Arial.fnt -f bin > Arial.bin
Or you can parse various font formats on the fly in Node and the browser.
For convenience, the load-bmfont module wraps the above parsers for Node/Browser and provides fallbacks for XHR1.0 browsers.
var load = require('load-bmfont')
load('fonts/Arial-32.fnt', function(err, font) {
if (err)
throw err
//The BMFont spec in JSON form
console.log(font.common.lineHeight)
console.log(font.info)
console.log(font.chars)
console.log(font.kernings)
})
For further optimization, you can pack a number of font styles/sizes into a single binary file, and then decode that at runtime.
For example:
pack-bmfonts fonts/*.{xml,fnt} > fonts/all.bin
Then, a XHR2.0 implementation for unpacking in a browser (with Browserify) might look like this:
var xhr = require('xhr')
var unpack = require('unpack-bmfonts')
xhr({
url: 'fonts/all.bin',
responseType: 'arraybuffer'
}, function(err, res, arrayBuf) {
if (err)
throw err
var array = new Uint8Array(arrayBuf)
var buffer = new Buffer(array)
var fonts = unpack(buffer)
//do something with your font array...
console.log(fonts)
console.log(fonts[0].common.lineHeight)
})