Module 03 –Fonty v OpenGL Module 03 – Fonty v OpenGL Module 03 Fonty

Module 03 –Module 03 – Fonty v OpenGLFonty v OpenGL

Module 03Module 03

FontyFonty


ObsahObsah

Zobrazovanie textu

Bitmapové fonty

Outline fonty

2D texture fonty

Demonštračný program


Zobrazovanie textuZobrazovanie textu

Niekedy je potrebné zobraziť v grafickej aplikácii aj texty

Texty sa používajú napríklad v:

o menu

o screensavers

o dialógy

o Jednoduché textové efekty

• Je niekoľko základných techník používaných pri výpise textu pomocou OpenGL

knižnice.

• Mnohé sú závisle od daného operačný systému, na ktorom sa bude aplikácie

spúšťať


BitmapBitmapovéové Font Fontyy

Bitmapové fonty ponúkajú jednoduchý spôsob na zobrazenie 2D textu na

obrazovku

Informácie o znakoch sú uložené v podobe bitmapy v jednom veľkom

bitmapovom obrázku

Nevýhodou je ich kostrbatosť a bez antialiasingu pri zväčšovaní sú neosté

Výhodou je ich jednoduchosť implementácie a rýchlosť vypisovania textu na

obrazovku.

Vytvárajú sa pomocou wgl funkcií wglUseFont Bitmaps(), ktoré generujú

bitmapy z existujúceho súboru s fontom natiahnutého vo vašom OS.


Outline FontOutline Fontyy

Outline fontsú veľmi podobné bitmapovým fontom

Outline fonty definujú znaky vo fonte ako sériu čiara kriviek, ktoré je možné

zväčšovať aj zmenšovať bez straty kvality.

Pomocou OpenGL je možné hýbať s outline fontovým textom okolo obrazovky

v 3D, priradiť textu hĺbku, a narábať s fontom rovnako, ako z ľubovolným iným

3D objektom.


2D Texture Fonts2D Texture Fonts

Používanie texúrory na uloženie fontu má viacero výhod (šetrenie pamätovým

priestorom, zvýšenie FPS)

Napríklad v tomto module budeme používať iba jednu textúru na definovanie

256 znakov.

Na jeden znak máme vymedzený priestor 16 x 16 pixelov pri štandardnej

veľkosti textúry 256x256


Drawing OpenGL bitmap font (1)

Postup:

1) include header files for working with input and arguments

2) declare new global variable for base display list for the font set

3) declare new global functions for building, printing and releasing

the GL font

4) define font building function BuildFont()

5) define font releasing function KillFont()

6) define font printing function glPrint()

7) load and enable the new font while setting up the OpenGL environment

8) draw text

9) properly release font




//--------------------------------------------------------------------------------

// Header Files

//--------------------------------------------------------------------------------

…

#include <stdio.h> // Header File For Standard Input/Output

#include <stdarg.h> // Header File For Variable Argument Routines

…

2) declare new global variables for base display list for the font set

//--------------------------------------------------------------------------------

// Global Variables

//--------------------------------------------------------------------------------

…

GLuint base; // Base Display List For The Font Set

…



3) declare new global functions for building, printing and releasing font

//--------------------------------------------------------------------------------// Global Functions//--------------------------------------------------------------------------------…GLvoid BuildFont(GLvoid); // Declaration For BuildFontGLvoid glPrint(const char *fmt, ...); // Declaration For glPrintGLvoid KillFont(GLvoid); // Declaration For KillFont…


GLvoid BuildFont(GLvoid){

HFONT font; // Windows Font IDHFONT oldfont; // Used For Good House Keepingbase = glGenLists(96); // Storage For 96 Characters…

} // end of BuildFont()




GLvoid BuildFont(GLvoid)

{

…

font = CreateFont( -24, // Height Of Font

0, // Width Of Font

0, // Angle Of Escapement

0, // Orientation Angle

FW_BOLD, // Font Weight

FALSE, // Italic

FALSE, // Underline

FALSE, // Strikeout

ANSI_CHARSET, // Character Set Identifier

OUT_TT_PRECIS, // Output Precision

CLIP_DEFAULT_PRECIS, // Clipping Precision

ANTIALIASED_QUALITY, // Output Quality

FF_DONTCARE|DEFAULT_PITCH, // Family And Pitch

"Courier New"); // Font Name

…






{

…

oldfont = (HFONT)SelectObject(hDC, font); // Selects The Font We Want

// Builds 96 Characters Starting At Character 32

wglUseFontBitmaps(hDC, 32, 96, base);

SelectObject(hDC, oldfont); // Selects The Font We Want

DeleteObject(font); // Delete The Font




5) define font releasing function KillFont()

GLvoid KillFont(GLvoid)

{

glDeleteLists(base, 96); // Delete All 96 Characters

} // end of KillFont()


GLvoid glPrint(const char *fmt, ...)

{

char text[256]; // Holds Our String

va_list ap; // Pointer To List Of Arguments

if (fmt == NULL) // If There's No Text

return; // Do Nothing

…

} // end of glPrint()





{

…

va_start(ap, fmt); // Parses The String For Variables

vsprintf(text, fmt, ap); // And Converts Symbols To Actual Numbers

va_end(ap); // Results Are Stored In Text

glPushAttrib(GL_LIST_BIT); // Pushes The Display List Bits

glListBase(base - 32); // Sets The Base Character to 32

glCallLists(strlen(text), GL_UNSIGNED_BYTE, text); // Draws The Display List Text

glPopAttrib(); // Pops The Display List Bits




7) load and enable the new font while setting up the OpenGL environmentint InitGL(GLvoid) // All Setup For OpenGL Goes Here

{

…

BuildFont(); // Build The Font

…

} // end of InitGL(Glvoid)

8) draw textint DrawGLScene(GLvoid)

{

…

glLoadIdentity(); // Reset The Current Modelview Matrix

glTranslatef(0.0f,0.0f,-1.0f); // Move One Unit Into The Screen

glColor3f(1.0,0.0,0.0); // Set Font Color

glRasterPos2f(-0.35, 0); // Set Font Position

glPrint("Module04 - OpenGL Bitmap Fonts"); // Set text

…

} // end of DrawGLScene()




GLvoid KillGLWindow(GLvoid)

{

…

KillFont(); // release thefont

} // end of KillGLWindow()


Final result

Using of bitmap font


Practice

Open:

Lab03 / BitmapFont / BitmapFont.sln


Drawing OpenGL outline font (1)

We will continue with previous lab (1).

Steps to do:


2) declare new global variables for text rotation and outline font characters storage info

3) declare new global functions for building, printing and releasing

the GL outline font

4) define outline font building function BuildFont()

5) define outline font releasing function KillFont()

6) define outline font printing function glPrint()

7) load and enable the new outline font setting up the OpenGL environment

8) draw text





//--------------------------------------------------------------------------------

// Header Files

//--------------------------------------------------------------------------------

…


#include <stdarg.h> // Header File For Variable Argument Routines

…

2) declare new global variables for text rotation and outline font characters storage info

//--------------------------------------------------------------------------------

// Global Variables

//--------------------------------------------------------------------------------

…

GLuint base; // Base Display List For The Font Set

GLuint rot ; // Used To Rotate The Text

GLYPHMETRICSFLOAT gmf[256]; // Storage For Information About Our Outline Font Characters

…



3) declare new global functions for building, printing and releasing outline font

//--------------------------------------------------------------------------------

// Global Functions

//--------------------------------------------------------------------------------

…

GLvoid BuildFont(GLvoid); // Declaration For BuildFont

GLvoid glPrint(const char *fmt, ...); // Declaration For glPrint

GLvoid KillFont(GLvoid); // Declaration For KillFont

…



{

HFONT font; // Windows Font ID

base = glGenLists(256); // Storage For 256 Characters

…






{

…

font = CreateFont( -24, // Height Of Font

0, // Width Of Font

0, // Angle Of Escapement

0, // Orientation Angle

FW_BOLD, // Font Weight

FALSE, // Italic

FALSE, // Underline

FALSE, // Strikeout

ANSI_CHARSET, // Character Set Identifier

OUT_TT_PRECIS, // Output Precision

CLIP_DEFAULT_PRECIS, // Clipping Precision

ANTIALIASED_QUALITY, // Output Quality

FF_DONTCARE|DEFAULT_PITCH, // Family And Pitch

"Courier New"); // Font Name

…






{

…

SelectObject(hDC, font); // Selects The Font We Created

wglUseFontOutlines( hDC, // Select The Current DC

0, // Starting Character

255, // Number Of Display Lists To Build

base, // Starting Display Lists

0.0f, // Deviation From The True Outlines

0.2f, // Font Thickness In The Z Direction

WGL_FONT_POLYGONS, // Use Polygons, Not Lines

gmf); // Address Of Buffer To Recieve Data




5) define outline font releasing function KillFont()


{

glDeleteLists(base, 256); // Delete All 256 Characters


6) define outline font printing function glPrint()


{

char text[256]; // Holds Our String

va_list ap; // Pointer To List Of Arguments

if (fmt == NULL) // If There's No Text

return; // Do Nothing

…






{

…

va_start(ap, fmt); // Parses The String For Variables

vsprintf(text, fmt, ap); // And Converts Symbols To Actual Numbers

va_end(ap); // Results Are Stored In Text

for (unsigned int loop=0;loop<(strlen(text));loop++) // Loop To Find Text Length

{

length+=gmf[text[loop]].gmfCellIncX; // Increase Length By Each Characters Width

}

glTranslatef(-length/2,0.0f,0.0f); // Center Our Text On The Screen

glPushAttrib(GL_LIST_BIT); // Pushes The Display List Bits

glListBase(base); // Sets The Base Character to 0

glCallLists(strlen(text), GL_UNSIGNED_BYTE, text); // Draws The Display List Text

glPopAttrib(); // Pops The Display List Bits




7) load and enable the new font while setting up the OpenGL environment

int InitGL(GLvoid) // All Setup For OpenGL Goes Here

{

…


…

} // end of InitGL(Glvoid)

8) draw text

int DrawGLScene(GLvoid)

{

…

glLoadIdentity(); // Reset The Current Modelview Matrix

glTranslatef(0.0f,0.0f,-15.0f); // Move One Unit Into The Screen

…




8) draw text


{

…

glRotatef(rot,1.0f,0.0f,0.0f); // Rotate On The X Axis

glRotatef(rot*1.5f,0.0f,1.0f,0.0f); // Rotate On The Y Axis

glRotatef(rot*1.4f,0.0f,0.0f,1.0f); // Rotate On The Z Axis

glColor3f(1,0,0); // Set Outline Font Color

glPrint("Module04 - OpenGL Outline Fonts"); // Print GL Text To The Screen

rot+=0.25f; // Increase The Rotation Variable

…






{

…




Final result

OpenGL outline font


Practice

Open:

Lab03 / OutlineFont / OutlineFont.sln


Drawing 2D texture OpenGL font (1)

Steps to do:

1) include header files for working with math and input operations

2) declare new global variables to point us to our display list, for text texture, loop and to move text & for coloring

3) declare new global functions for loading font bmp file, converting it to the texture, building, printing and releasing 2D texture font

4) load font bmp file

5) load font bitmaps and convert to texture

6) define 2D texture font building function BuildFont()

7) define 2D texture font releasing function KillFont()

8) define 2D texture font printing function glPrint()

9) load and enable the new 2D texture font setting up the OpenGL environment

10) draw text




1) include header files for working with math and input operations in init.h

//--------------------------------------------------------------------------------

// Header Files

//--------------------------------------------------------------------------------

…

#include <math.h> // Header File For Windows Math Library


…

2) declare new global variables to point us to our display list, for text texture, loop and to move

text & for coloring

//--------------------------------------------------------------------------------

// Global Variables

//--------------------------------------------------------------------------------

…

GLuint base; // Base Display List For The Font

GLuint texture[1]; // Storage For Font Texture

GLuint loop; // Generic Loop Variable

…



2) declare new global variables to point us to our display list, for text texture, loop and to move

text & for coloring

…

GLfloat cnt1; // 1st Counter Used To Move Text & For Coloring

GLfloat cnt2; // 2nd Counter Used To Move Text & For Coloring

…

3) declare new global functions for loading font bmp file, converting it to the texture, building,

printing and releasing 2D texture font

//--------------------------------------------------------------------------------

// Global Functions

//--------------------------------------------------------------------------------

…

AUX_RGBImageRec *LoadBMP(char *Filename); // Declaration For LoadBMP

int LoadGLTextures(); // Declaration For LoadGLTextures

GLvoid BuildFont(GLvoid); // Declaration For BuildFont

GLvoid KillFont(GLvoid); // Declaration For KillFont

GLvoid glPrint(GLint x, GLint y, char *string, int set); // Declaration For glPrint

…



4) load font bmp file

AUX_RGBImageRec *LoadBMP(char *Filename)

{

FILE *File=NULL; // File Handle

if (!Filename) // Make Sure A Filename Was Given

{

return NULL; // If Not Return NULL

}

File=fopen(Filename,"r"); // Check To See If The File Exists

if (File) // Does The File Exist?

{

fclose(File); // Close The Handle

return auxDIBImageLoad(Filename); // Load The Bitmap And Return A Pointer

}

return NULL; // If Load Failed Return NULL

} // end of LoadBMP()




int LoadGLTextures()

{

int Status=FALSE; // Status Indicator

AUX_RGBImageRec *TextureImage[2]; // Create Storage Space For The Textures

memset(TextureImage,0,sizeof(void *)*2); // Set The Pointer To NULL

if (TextureImage[0]=LoadBMP("Data/Font.bmp"))

{

Status=TRUE; // Set The Status To TRUE

glGenTextures(1, &texture[0]); // Create One Texture

glBindTexture(GL_TEXTURE_2D, texture[0]);

glTexParameteri(GL_TEXTURE_2D,GL_TEXTURE_MAG_FILTER,GL_LINEAR);

glTexParameteri(GL_TEXTURE_2D,GL_TEXTURE_MIN_FILTER,GL_LINEAR);

…

} // end of LoadGLTextures()




int LoadGLTextures()

{

...

glTexImage2D(GL_TEXTURE_2D, 0, 3, TextureImage[loop]->sizeX, TextureImage[loop]->sizeY, 0, GL_RGB, GL_UNSIGNED_BYTE, TextureImage[0]->data);

}

if (TextureImage[0]) // If Texture Exists

{

if (TextureImage[0]->data) // If Texture Image Exists

{

free(TextureImage[0]->data);

}

free(TextureImage[0]);

}

return Status; // Return The Status

} // end of LoadGLTextures()



6) defefine 2D texture font building function BuildFont()


{

float cx; // Holds Our X Character Coord

float cy; // Holds Our Y Character Coord

base=glGenLists(256); // Creating 256 Display Lists

glBindTexture(GL_TEXTURE_2D, texture[0]); // Select Our Font Texture

for (loop=0; loop<256; loop++) // Loop Through All 256 Lists

{

cx=float(loop%16)/16.0f; // X Position Of Current Character

cy=float(loop/16)/16.0f; // Y Position Of Current Character

glNewList(base+loop,GL_COMPILE); // Start Building A List

… // Loop Until All 256 Are Built




6) defefine 2D texture font building function BuildFont()


{

…

glBegin(GL_QUADS); // Use A Quad For Each Character

glTexCoord2f(cx,1-cy-0.0625f); // Texture Coord (Bottom Left)

glVertex2i(0,0); // Vertex Coord (Bottom Left)

glTexCoord2f(cx+0.0625f,1-cy-0.0625f); // Texture Coord (Bottom Right)

glVertex2i(16,0); // Vertex Coord (Bottom Right)

glTexCoord2f(cx+0.0625f,1-cy); // Texture Coord (Top Right)

glVertex2i(16,16); // Vertex Coord (Top Right)

glTexCoord2f(cx,1-cy); // Texture Coord (Top Left)

glVertex2i(0,16); // Vertex Coord (Top Left)

glEnd(); // Done Building Our Quad (Character)

glTranslated(10,0,0); // Move To The Right Of The Character

glEndList(); // Done Building The Display List

} // Loop Until All 256 Are Built




7) defefine 2D texture font releasing function KillFont()


{

glDeleteLists(base,256); // Delete All 256 Display Lists



GLvoid glPrint(GLint x, GLint y, char *string, int set)

{

if (set>1)

{

set=1;

}

glBindTexture(GL_TEXTURE_2D, texture[0]); // Select Our Font Texture

glDisable(GL_DEPTH_TEST); // Disables Depth Testing

…





GLvoid glPrint(GLint x, GLint y, char *string, int set)

{

…

glMatrixMode(GL_PROJECTION); // Select The Projection Matrix

glPushMatrix(); // Store The Projection Matrix

glLoadIdentity(); // Reset The Projection Matrix

glOrtho(0,640,0,480,-1,1); // Set Up An Ortho Screen

glMatrixMode(GL_MODELVIEW); // Select The Modelview Matrix

glPushMatrix(); // Store The Modelview Matrix

glLoadIdentity(); // Reset The Modelview Matrix

glTranslated(x,y,0); // Position The Text (0,0 - Bottom Left)

glListBase(base-32+(128*set)); // Choose The Font Set (0 or 1)

glCallLists(strlen(string),GL_BYTE,string); // Write The Text To The Screen

glMatrixMode(GL_PROJECTION); // Select The Projection Matrix

glPopMatrix(); // Restore The Old Projection Matrix

glMatrixMode(GL_MODELVIEW); // Select The Modelview Matrix

glPopMatrix(); // Restore The Old Projection Matrix

glEnable(GL_DEPTH_TEST); // Enables Depth Testing




9) load and enable the new 2D texture font setting up the OpenGL environment

int InitGL(GLvoid)

{

if (!LoadGLTextures()) // Jump To Texture Loading Routine

{

return FALSE; // If Texture Didn't Load Return FALSE

}


glClearColor(0.0f, 0.0f, 0.0f, 0.0f); // Clear The Background Color To Black

glClearDepth(1.0); // Enables Clearing Of The Depth Buffer

glDepthFunc(GL_LEQUAL); // The Type Of Depth Test To Do

glBlendFunc(GL_SRC_ALPHA,GL_ONE); // Select The Type Of Blending

glShadeModel(GL_SMOOTH); // Enables Smooth Color Shading

glEnable(GL_TEXTURE_2D); // Enable 2D Texture Mapping

return TRUE; // Initialization Went OK

} // end of InitGL()



10) draw text


{

glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT);

glEnable(GL_BLEND); // Enable Blending

glLoadIdentity(); // Reset The View

// Pulsing Colors Based On Text Position

glColor3f(1.0f*float(cos(cnt1)),1.0f*float(sin(cnt2)),1.0f-0.5f*float(cos(cnt1+cnt2)));

// Print GL Text To The Screen

glPrint(int((280+250*cos(cnt1))),int(235+200*sin(cnt2)),"Module04",0);

// Pulsing Colors Based On Text Position

glColor3f(1.0f*float(sin(cnt2)),1.0f-0.5f*float(cos(cnt1+cnt2)),1.0f*float(cos(cnt1)));

// Print GL Text To The Screen

glPrint(int((280+230*cos(cnt2))),int(235+200*sin(cnt1)),"2D Texture Font",1);

cnt1+=0.01f; // Increase The First Counter

cnt2+=0.0081f; // Increase The Second Counter

return TRUE; // Everything Went OK






{

…




Final result

OpenGL 2D texture font


Practice

Open:

Lab03 / BitmapFont2 / BitmapFont2.sln

Documents

Module 03 –Fonty v OpenGL Module 03 – Fonty v OpenGL Module 03 Fonty