RISC World


Neil White

Please note that before trying to compile any examples you will need the Castle 32bit SharedCLibrary installed on your computer.

SDL_ttf is an add on library to SDL that provides the capability to render TrueType (ttf) fonts to SDL surfaces. It is a wrapper around the FreeType font system. There are plenty of freeware ttf fonts available around the web, but make sure that if you download any that they truly are freeware ones as some come with some crazy licences. In this article I hope to make you familiar with loading and displaying ttf fonts in and SDL window.

First we need to tell out C program we want to use SDL_ttf -

   #include SDL_ttf.h

Then we need to set aside some memory for the fonts in a similar fashion as when we set aside memory for mixer sound chunks, only this time for ttf fonts -

   TTF_Font *ttf_font;  - this is where we load the font into.

SDL_Surface **font_surface; - this is where the bitmaps of the font are stored once they have been loaded, which needs to be set to an appropriate size for the characters we want to hold 126 is the amount of ASCII codes -

   font_surface = (SDL_Surface **)malloc(sizeof(SDL_Surface *) * 126);

The fonts use something we have yet to come across yet, an SDL_Color structure, which is defined like this-

   SDL_Color text_color;

and set using hex values 0x00 0xFF ( 0-255 ) like this -

   text_color.r = 0xFF; 
   text_color.g = 0xFF; 
   text_color.b = 0xFF; 

which gives us r g and b set to 255 which is white.

Basically the SDL_ttf system uses ttf fonts rendered into sdl surfaces, so we need to initialise the ttf system using the TTF_init() command here shown with an error trap -

   if(TTF_Init()) {
   printf("TTF_Init error: %s", TTF_GetError());
   exit (-1);

Now we are ready to load the font -

First define a character array to hold the destination string

   char font_file[256];

Copy the directory name defined in the makefile to the font_file string -

   strcpy(font_file, DATA_PREFIX);

Add the name of the font we want to load -

   strcat(font_file, "font.ttf");

Now load the font, here again shown with an error trap -

   if((ttf_font = TTF_OpenFont(font_file, 50)) == NULL) {
   printf("TTF_OpenFont error: %s", TTF_GetError());
   exit (-1);

Now the font is loaded into memory we want to plot it into surfaces ready to be used with SDL using ASCII values we achieve this like this -

A character array to hold the letter we are plotting -

   char letter[1];

A loop going from space to tilde, 0-32 are control characters so not much use for displaying text, 32 is space, 33-47 are punctuation marks 48-58 are the numbers 0-9, 59-64 are more punctuation, 65-90 capital letters of the alphabet, 91-96 are more punctuation and the lower case letters run from 97 though 122 with 123-126 yet more punctuation characters.

   for (i=32; i < 126; i++) {

put the ASCII code into our letter character array with a null character.

   letter[0] = i;
   letter[1] = '\0';

now the same ASCII code is used for rendering the text in our font_surface array with the previously defined text colour -

   font_surface[i] = TTF_RenderText_Blended(ttf_font, letter, text_color);

SDL_SetColorKey sets the transparency of the surface -

   SDL_SetColorKey(font_surface[i], SDL_SRCCOLORKEY, SDL_MapRGB(font_surface[i]->format,0,0,0));

Now we have got all our font surfaces we no longer need ttf, so we close the font and shut down ttf-


Now we can use this function to display some text -

   void plotfont(char strinplot[], int x,int y)

Integers for controlling the loop and holding the ascii code and the length of the string -

   int i,j,str;

Get the length of the string -


A loop for each letter of the string

   for ( i=0 ; i< j ; i++ )

The current letter ascii code is obtained


Now the appropriate font_surface is plotted to the screen using a previously defined imageplot function ( in the code example )

   imageplot( font_surface[ str ] , x , y );

This inreases x value by the width of the letter ready to plot the next

   x=x+font_surface[ str ]->w;

End of loop


end of plotfont function


And that is how to use ttf fonts with SDL in it's most simple form. The example included displays 'Risc World Example' and displays the ASCII alphabet from 33 to 126, so if you want to download and try different fonts you can, simply by renaming the downloaded font to font/ttf and replacing the font/ttf in the example directory.

Neil White