In Sauce, we use bitmap (raster) fonts. However, in order to display text properly, just having an image with all the character glyphs is not good enough. We need to provide additional data about the font:
- font name and style
- metrics:
- em height
- ascent
- decent
- line spacing
- glyph location and size
Furthermore, we need to arrange the glyphs in a manner so that they fit within an acceptable texture size; in our case, we wanted a square texture with a power of two size.
Exporter
Like the majority of our tools, the Font Exporter is written in C#. It fetches all the font data we need for our output font file format. It provides users with standard font options and a display panel to preview results.
One of the most important features of the exporter is the glyph arrangement on the raster image. The exporter attempts to fit the glyphs on the smallest texture possible given the parameters. This is certainly not something you want to do by hand in an image editor.
Font Asset Format
Each of our font assets is stored in a single binary file: *.sefont. The file is divided into three main chunks: header, glyph map, and raster data.
The header includes a file format version, meta data, and the font attributes outlined above.
The glyph map is comprised of a custom set of characters specified by the exporter. Each entry contains the symbol character and its corresponding raster subregion (coordinates and dimensions).
Although we’ve chosen to include the most common set of text characters, you probably noticed that the first glyph is a solid box. This is the “invalid” character. In the engine, if there is ever a request for a character that does not exist in the map, this invalid character will be displayed.
The raster data is simply a PNG image embedded in the file. Thanks to our robust Streams library, we are able to extract the PNG image without any special handling.