RTsoft Wiki

This page is read only. You can view the source, but not change it. Ask your administrator if you think this is wrong.
====Using RTFont====
RTFont is a class to load and blit bitmapped fonts.  It loads a custom .rtfont format which includes kerning data, the font image, colors for "color codes".  (Old school BBS people who played LORD may remember this as "Seth ANSI", it just allows you to change color easy in a text string)

Example of use:

<code cpp>
RTFont myFont("interface/font_trajan_big.rtfont"); //we could also use myFont.Load()
myFont.Draw(0,0, "Hello.\n`4Red`` is cool.");
</code>
{{:proton:fonts_1.png?|}}

Notice that:
  * /n operates as a carriage return
  * `4 is a color code for red.  `` means "remove the effects of the last color code".  It's a pushed and popped as a stack internally.

If you put this code in your main loop it will work, but it's a bad idea because you'd be loading and destroying the font each frame.

Instead, you should use the font area allocated for you in BaseApp as the examples do.  The advantage here is engine-level components can use these "global" fonts by id.

Let's show an example of that and explore some other features.
====Text wrapping and the kerning map====
<code cpp>
//init a global font one time somewhere (RTSimpleApp does this already):
GetFont(FONT_LARGE)->Load("interface/font_big.rtfont"); //taken from Dink

//in your game loop we'll do this:

string msg = "`9Smile. it makes them wonder what `5you're up to``.  Hey, a kerning map.";
rtRect wrapArea(0,0,GetScreenSizeX(), GetScreenSizeY());
GetFont(FONT_LARGE)->DrawWrapped(wrapArea, msg);

//let's zoom in to show something about kerning

wrapArea.top = 70; //start farther down to not overwrite the above thing
GetFont(FONT_LARGE)->DrawWrapped(wrapArea, "Hey, a kerning map.", false, false, MAKE_RGBA(255,255,255,170), 4.0f);
</code>
{{:proton:fonts_2.png?|}}

Notice that:
  * The text is wrapped
  * You can scale the font size and use color codes and wrapping still works ok
  * You can send a RGBA value to set the color as well
  * Look at that scaled up comma, it's overlapping the space of the y before it.  That's the kerning map in action, something that makes your text flow better by remembering the spacing relationship between each letter with each letter
  * I've apparently decided to choose the ugliest colors for this demonstration possible

====Disabling anti-aliasing====
That blurry anti aliasing when scaling is the default, but you can turn it off by doing:
<code cpp>
GetFont(FONT_LARGE)->SetSmoothing(false);
</code>
{{:proton:fonts_3.png?|}}

Better? Depends what you're going for I guess.

====How to make a new font====
First, if you've run RTSimpleApp you've technically already made a font so it can't be that hard.

Its update_media.bat automatically builds each fonts it finds by takes three files and producing a .rtfont file using RTPack.exe.

For the trajan font it needs (located in RTSimpleApp/media/interface) :
  * font_trajan.fnt (kerning data and locations of each character in the bmp, output by BMFont)
  * font_trajan_00.png (the bitmap itself, a png with alpha)(output by BMFont)
  * font_trajan.txt (a text file with directions for RTPack.exe on what file names to load and what color codes should do.. you have to make this)

BMFont is [[http://www.angelcode.com/products/bmfont/|AngelCode's Bitmap Font Generator]], a free utility to generate bmps and data for fonts.

RTPack.exe can be found in **/shared/win/utils**.  If you're on linux/osx, check [[proton:rtpack|here]] for info on compiling it.  (It also works using wine: RTPack.exe -opts etc).

The command line to make this font is:
<code>
rtpack.exe -make_font font_trajan.txt
</code>

If you're making your own font, notice the file font_trajan.mbfc is with the other font stuff.  This is the settings file for Bitmap Font Generator, load it to see what good values are or to tweak an existing font.

===Making a new font step by step===
  * Download [[http://www.angelcode.com/products/bmfont|Bitmap Font Generator]] and install it, then run it.

  * Do Options->Load Configuration, and choose **<protondir>/RTSimpleApp/media/interface/font_trajan.bmfc**

  * Choose Options->Font settings and change the font to anything you want.  You may need to tweak the bitmap size if your font is too large.

  * (Be careful not to click any letters - it toggles them being selected, non selected letter won't export)

  * Do Options->Save Bitmap font and overwrite the old font_trajan.fnt.  (It will also write out font_trajan_00.png without asking you when you do this)

  * It's done.  Run **/RTSimpleApp/media/update_media.bat** to build the font and place it in the bin dir, and run the app.  The font now look different!

  * Once that is working, you should probably rename your font files.  You'll also need to rename font_trajan.txt and edit the names inside of it with a text editor.

====Performance====
The font code is fast because it batches characters together when it renders using the global RenderBatcher, or allows you to pass in your own RenderBatcher object  so you can render multiple DrawFont calls with a single GL operation later.