Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Using SDL_ttf with OpenGL

I'm using OpenGL and SDL to create a window in my program.

How do I use SDL_ttf with an OpenGL window?

For example I want to load a font and render some text. I want to draw the text using an SDL OpenGL surface.

like image 634
Khedesh Avatar asked Mar 13 '11 12:03

Khedesh


2 Answers

Here's how to do it:

  1. Initialize SDL and SDL_ttf, and create a window using SDL_SetVideoMode(). Make sure you pass the SDL_OPENGL flag.
  2. Initialize your OpenGL scene (glViewport(), glMatrixMode() etc.).
  3. Render your text with SDL_ttf using e.g. TTF_RenderUTF8_Blended(). The render functions return an SDL_surface, which you have to convert into an OpenGL texture by passing a pointer to the data (surface->pixels) to OpenGL as well as the format of the data. Like this:

    colors = surface->format->BytesPerPixel;
    if (colors == 4) {   // alpha
        if (surface->format->Rmask == 0x000000ff)
            texture_format = GL_RGBA;
        else
            texture_format = GL_BGRA;
    } else {             // no alpha
        if (surface->format->Rmask == 0x000000ff)
            texture_format = GL_RGB;
        else
            texture_format = GL_BGR;
    }
    
    glGenTextures(1, &texture);
    glBindTexture(GL_TEXTURE_2D, texture); 
    glTexImage2D(GL_TEXTURE_2D, 0, colors, surface->w, surface->h, 0,
                        texture_format, GL_UNSIGNED_BYTE, surface->pixels);
    
  4. Then you can use the texture in OpenGL using glBindTexture() etc. Make sure to call SDL_GL_SwapBuffers() when you're done with drawing.

like image 70
Antti Avatar answered Nov 06 '22 06:11

Antti


Based off of: http://content.gpwiki.org/index.php/SDL_ttf:Tutorials:Fonts_in_OpenGL

The code below is an example of how you can render the text on top of finished 3D model you may have built.

#include "SDL.h"
#include "SDL_ttf.h"

/.../

void RenderText(std::string message, SDL_Color color, int x, int y, int size) {
  glMatrixMode(GL_MODELVIEW);
  glPushMatrix();
  glLoadIdentity();

  gluOrtho2D(0, m_Width, 0, m_Height); // m_Width and m_Height is the resolution of window
  glMatrixMode(GL_PROJECTION);
  glPushMatrix();
  glLoadIdentity();

  glDisable(GL_DEPTH_TEST);
  glEnable(GL_TEXTURE_2D);
  glEnable(GL_BLEND);
  glBlendFunc(GL_SRC_ALPHA, GL_ONE_MINUS_SRC_ALPHA);

  GLuint texture;
  glGenTextures(1, &texture);
  glBindTexture(GL_TEXTURE_2D, texture);

  TTF_Font * font = TTF_OpenFont("pathToFont.ttf", size);
  SDL_Surface * sFont = TTF_RenderText_Blended(font, message, color);

  glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MIN_FILTER, GL_LINEAR);
  glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MAG_FILTER, GL_LINEAR);
  glTexImage2D(GL_TEXTURE_2D, 0, GL_RGBA, sFont->w, sFont->h, 0, GL_BGRA, GL_UNSIGNED_BYTE, sFont->pixels);

  glBegin(GL_QUADS);
  {
    glTexCoord2f(0,0); glVertex2f(x, y);
    glTexCoord2f(1,0); glVertex2f(x + sFont->w, y);
    glTexCoord2f(1,1); glVertex2f(x + sFont->w, y + sFont->h);
    glTexCoord2f(0,1); glVertex2f(x, y + sFont->h);
  }
  glEnd();

  glDisable(GL_BLEND);
  glDisable(GL_TEXTURE_2D);
  glEnable(GL_DEPTH_TEST);

  glMatrixMode(GL_PROJECTION);
  glPopMatrix();
  glMatrixMode(GL_PROJECTION);
  glPopMatrix();

  glDeleteTextures(1, &texture);
  TTF_CloseFont(font);
  SDL_FreeSurface(sFont);
}

/.../

int main() {

/.../ Render 3D stuff here

  // Prints out "Hello World" at location (5,10) at font size 12!
  SDL_Color color = {255, 0, 0, 0}; // Red
  RenderText("Hello World", color, 5, 10, 12); 

/.../

  return 0;
}
like image 2
Weeba Avatar answered Nov 06 '22 07:11

Weeba