BitmapFont and BitmapText

BitmapFont is a font you can create from a texture.

For this tutorial, let's use this 8x8 font texture:

First thing to do, is to create a BitmapFont with all the information it needs to correctly generate glyphs from the texture.

ns::BitmapFont constructor can take up to 5 arguments :

• the texture
• glyph size, the size of each letter/symbol in pixels
• character map, define the order of the letters/symbols on the texture
• advance map, define advance values for specific letter/symbol
• default advance, the default x offset after each letter /symbol

auto* bitmapfont = new ns::Bitmapfont(
    ns::Res::getTexture("font.png"),    // the texture
    {8, 8},     // glyph size, the font is an 8x8 font
    // v this is the character map
    " ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789.,:;!?-+=",
    // v the advance map, specifies the space each letter takes
    {{"ABCDEFGHIJKMNOPQRSTUVWXYZ?=-", 7},
     {"ijlntsofpqrux", 5}},
    6 // the default advance, by default the font will advance by 6 pixels 
);

Now that the font is created, we can create and draw a BitmapText. It is just like a regular Text, except it requires a BitmapFont instead of a regular Font.

auto* bitmaptext = new ns::BitmapText("This is a BitmapText !");
bitmaptext->setFont(bitmapfont);
bitmaptext->setPosition(50, 50);

To draw it, add the text to a scene layer (since the font is black, set a white background first to see it).

For more details, check BitmapFont and BitmaptText documentation