Sign in to follow this  

OpenGL For Reference: Using SDL_ttf with OpenGL #2

Recommended Posts

Funkapotamus    189
This post is a continuation of the wonderful thread started by C-Junkie found here: Thanks to that thread, I was able to get SDL_ttf up and running. However, I was disappointed by the method's speed. Creating, binding, blitting, and freeing a new OpenGL texture for each string of output was hurting framerate. So, I combined it with the good old .bmp font/display list method. This will load a .ttf font using SDL_ttf, and make a 512x512 pixel texture that contains every character from ascii value 32 to 128. It then builds display lists for each character so you can render text just like you would via the traditional .bmp font method. See a picture of it here. Code:
const int OFFSET = 32;
const int MAX_ASCII = 128;
TTF_Font* font = TTF_OpenFont("arial.ttf", 40);      

// it's best to set the width to the size of the font specified above
float charWidth        = 40;
// make the height a little bit higher since we'll be auto aligning letters that go above/below the baseline and they may trail over
float charHeight       = 50;
// characters are very small.  it's best to make the font large and scale it down rather than make it small and blow it up
float textureWidth     = 512;
float textureHeight    = 512;

/* create letters */
// set letter color to white
SDL_Color color = { 255, 255, 255, 255 };      
// create glyphs, from ' ' (space) to '~' (tilde)
std::vector<SDL_Surface*> glyphCache;         
for(int i = OFFSET; i < MAX_ASCII; i++)
   glyphCache.push_back(TTF_RenderGlyph_Blended(font, i, color));

/* create destination surface */
SDL_Surface* destination = SDL_CreateRGBSurface(SDL_SWSURFACE, (int)textureWidth, (int)textureHeight, 32, 0x00ff0000, 0x0000ff00, 0x000000ff, 0xff000000);      

/* blit glyphs onto destination */      
SDL_Rect glyphRect;
int row = 0;   // 10 chars per row
int col = 0;   
for(int i = OFFSET; i < MAX_ASCII; i++) {
   int minx, maxx, miny, maxy, advance;
   TTF_GlyphMetrics(font, i, &minx, &maxx, &miny, &maxy, &advance);
   glyphRect.x = (int)(col * charWidth);
   glyphRect.y = (int)(row * charHeight + TTF_FontAscent(font) - maxy);                  

   SDL_BlitSurface(glyphCache[i - OFFSET], 0, destination, &glyphRect);

   if(col >= 10) {
      col = 0;

/* create texture */
glGenTextures(1, &textureId);
glBindTexture(GL_TEXTURE_2D, textureId);   
glTexImage2D(GL_TEXTURE_2D, 0, 4, (int)textureWidth, (int)textureHeight, 0, GL_RGBA, GL_UNSIGNED_BYTE, destination->pixels);

/* create display lists */   
GLuint* chars = new GLuint[MAX_ASCII];
int* charWidths = new int[MAX_ASCII];

row = 0;
col = 0;
for(int i = 0; i < MAX_ASCII; i++) {
   int id = glGenLists(1);
   chars[i] = id;

   int minx, maxx, miny, maxy, advance;
   TTF_GlyphMetrics(font, i + OFFSET, &minx, &maxx, &miny, &maxy, &advance);

   float minX = charWidth * col / textureWidth;
   float maxX = (advance) / textureWidth + minX;
   float minY = charHeight / textureHeight * row;
   float maxY = minY + charHeight / textureHeight;

   charWidths[i] = advance;

   glNewList(id, GL_COMPILE); 
         glTexCoord2f(minX, maxY);   glVertex2f(0.0f, 0.0f);       
         glTexCoord2f(maxX, maxY);   glVertex2f(advance, 0.0f);      
         glTexCoord2f(maxX, minY);   glVertex2f(advance, charHeight);   
         glTexCoord2f(minX, minY);   glVertex2f(0.0f, charHeight);
      glTranslatef(advance + 1, 0.0f, 0.0f);

   if(col >= 10) {
      col = 0;

/* free/kill everything */
for(unsigned int i = 0; i < glyphCache.size(); i++)

/* .... */
/* Get the char's list */
GLuint getList(char c) {
   return chars[c - OFFSET];				

/* ... */
/* Usage */
string msg = "Do a barrel roll!";
for(unsigned int i = 0; i < msg.length(); i++)

You'll note I store the width of each character in "int* charWidths". Using this information, it'd be very easy to display text that's centered at a given position, or left/right justified.

Share this post

Link to post
Share on other sites
Starfox    504
AFAIK, you will have some kerning problems with that approach. Also, for languages that are NOT English, this is impossible. I've been working on a project where Arabic text shaping and OpenGL rendering was required, and the whole system was limited to 192 MBs of RAM, so that approach was COMPLETELY impractical. So far, the best solution I could come up with is to transfer the texture asynchronously via PBOs. If anyone has a better idea, please jump in.

Oh, and kudos for picking "Do a barrel roll!" to be the string of choice ;)

Share this post

Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

Sign in to follow this  

  • Similar Content

    • By povilaslt2
      Hello. I'm Programmer who is in search of 2D game project who preferably uses OpenGL and C++. You can see my projects in GitHub. Project genre doesn't matter (except MMO's :D).
    • By ZeldaFan555
      Hello, My name is Matt. I am a programmer. I mostly use Java, but can use C++ and various other languages. I'm looking for someone to partner up with for random projects, preferably using OpenGL, though I'd be open to just about anything. If you're interested you can contact me on Skype or on here, thank you!
      Skype: Mangodoor408
    • By tyhender
      Hello, my name is Mark. I'm hobby programmer. 
      So recently,I thought that it's good idea to find people to create a full 3D engine. I'm looking for people experienced in scripting 3D shaders and implementing physics into engine(game)(we are going to use the React physics engine). 
      And,ye,no money =D I'm just looking for hobbyists that will be proud of their work. If engine(or game) will have financial succes,well,then maybe =D
      Sorry for late replies.
      I mostly give more information when people PM me,but this post is REALLY short,even for me =D
      So here's few more points:
      Engine will use openGL and SDL for graphics. It will use React3D physics library for physics simulation. Engine(most probably,atleast for the first part) won't have graphical fron-end,it will be a framework . I think final engine should be enough to set up an FPS in a couple of minutes. A bit about my self:
      I've been programming for 7 years total. I learned very slowly it as "secondary interesting thing" for like 3 years, but then began to script more seriously.  My primary language is C++,which we are going to use for the engine. Yes,I did 3D graphics with physics simulation before. No, my portfolio isn't very impressive. I'm working on that No,I wasn't employed officially. If anybody need to know more PM me. 
    • By Zaphyk
      I am developing my engine using the OpenGL 3.3 compatibility profile. It runs as expected on my NVIDIA card and on my Intel Card however when I tried it on an AMD setup it ran 3 times worse than on the other setups. Could this be a AMD driver thing or is this probably a problem with my OGL code? Could a different code standard create such bad performance?
    • By Kjell Andersson
      I'm trying to get some legacy OpenGL code to run with a shader pipeline,
      The legacy code uses glVertexPointer(), glColorPointer(), glNormalPointer() and glTexCoordPointer() to supply the vertex information.
      I know that it should be using setVertexAttribPointer() etc to clearly define the layout but that is not an option right now since the legacy code can't be modified to that extent.
      I've got a version 330 vertex shader to somewhat work:
      #version 330 uniform mat4 osg_ModelViewProjectionMatrix; uniform mat4 osg_ModelViewMatrix; layout(location = 0) in vec4 Vertex; layout(location = 2) in vec4 Normal; // Velocity layout(location = 3) in vec3 TexCoord; // TODO: is this the right layout location? out VertexData { vec4 color; vec3 velocity; float size; } VertexOut; void main(void) { vec4 p0 = Vertex; vec4 p1 = Vertex + vec4(Normal.x, Normal.y, Normal.z, 0.0f); vec3 velocity = (osg_ModelViewProjectionMatrix * p1 - osg_ModelViewProjectionMatrix * p0).xyz; VertexOut.velocity = velocity; VertexOut.size = TexCoord.y; gl_Position = osg_ModelViewMatrix * Vertex; } What works is the Vertex and Normal information that the legacy C++ OpenGL code seem to provide in layout location 0 and 2. This is fine.
      What I'm not getting to work is the TexCoord information that is supplied by a glTexCoordPointer() call in C++.
      What layout location is the old standard pipeline using for glTexCoordPointer()? Or is this undefined?
      Side note: I'm trying to get an OpenSceneGraph 3.4.0 particle system to use custom vertex, geometry and fragment shaders for rendering the particles.
  • Popular Now