Game Development Reference
Figure 4-7 . Glyph Designer lets you create bitmap fonts from any TrueType font and can export FNT and PNG
files compatible with the CCLabelBMFont class of cocos2d
On the left-hand side you have the list of TrueType fonts, and if those aren't enough,
you can use the Load Font icon to load any TTF file. Below the list you can change the
size of the font with the slider and also switch to bold, italic, and other font styles.
Tip Creating Retina-enabled bitmap fonts is easy. Create your font as usu-
al and export it. This will be your non-Retina or SD font. Then simply change
the size of the font in Glyph Designer to twice its normal size; for example,
move the slider from a font size of 30 to a font size of 60. Then reexport the
font using the same name but adding the -hd suffix. Now you have the same
font in regular/SD and Retina/HD sizes.
Cocos2d will automatically recognize and use the font with the -hd suffix if
Retina support is enabled and the game is running on a Retina device.
In the center of the screen, you see the resulting texture atlas used for your current font
settings. Notice that the texture atlas size and the order of the glyphs frequently change
as you modify the font settings. You can also select a glyph and see its info on the
right-hand pane under Glyph Info.
Further down on the right-hand pane you can change the texture atlas settings, although
in most cases you don't have to. Glyph Designer makes sure the texture atlas size is al-
ways large enough to contain all the glyphs in a single texture.
With the Glyph Fill settings, you can change the color and the way glyphs are filled, in-
cluding a gradient setting. Alongside that you have the option to change the Glyph Out-
line, which is a black thin line around each glyph, and the Glyph Shadow, which allows
you to create a 3D-ish look of the font.
At the very bottom of the right-hand pane you find the Included Glyphs section. With
that you can choose from a predefined selection of glyphs to include in the atlas. If you
absolutely know for sure that you won't be needing certain characters, you can also
enter your own list of characters to reduce the size of the texture. This is especially
helpful for score strings, where you may only need digits plus very few extra charac-
ters. For example, the bitmap font used in the DoodleDrop project only contains letters
to minimize the font's memory usage.