Texture isn't mapped to quad - c++

I'm using the following to draw text in OpenGL (using SDL)
void renderText(const TTF_Font *font, const SDL_Color color,
const double& x, const double& y, const double& z, const std::string& text) {
bool textured = glIsEnabled(GL_TEXTURE_2D);
glEnable(GL_TEXTURE_2D);
//test color: black
glColor3f(0,0,0);
SDL_Surface *Message = TTF_RenderText_Blended(const_cast<TTF_Font*>(font), text.c_str(), color);
GLuint Texture = 0;
//Generate an OpenGL 2D texture from the SDL_Surface
glGenTextures(1, &Texture);
glBindTexture(GL_TEXTURE_2D, Texture);
glTexParameterf(GL_TEXTURE_2D, GL_TEXTURE_MIN_FILTER, GL_LINEAR);
glTexParameterf(GL_TEXTURE_2D, GL_TEXTURE_MAG_FILTER, GL_LINEAR);
glTexImage2D(GL_TEXTURE_2D, 0, GL_RGBA, Message->w, Message->h, 0, GL_BGRA,
GL_UNSIGNED_BYTE, Message->pixels);
//Draw this texture on a quad with the given xyz coordinates.
glBegin(GL_QUADS);
glTexCoord2d(0, 0); glVertex3d(x, y, z);
glTexCoord2d(1, 0); glVertex3d(x+Message->w, y, z);
glTexCoord2d(1, 1); glVertex3d(x+Message->w, y+Message->h, z);
glTexCoord2d(0, 1); glVertex3d(x, y+Message->h, z);
glEnd();
//Clean up
glDeleteTextures(1, &Texture);
SDL_FreeSurface(Message);
if (!textured)
glDisable(GL_TEXTURE_2D);
}
However, the only thing shown is a rectangle at (x,y) (in this case (10,10)) with the background color set with glColor3f (black in this case). The texture created from the SDL_Surface isn't shown on the quad. The arguments passed to the function are all valid:
font: previously loaded TTF_Font != NULL
color: SDL_Color {255,255,255} (white)
x = 10
y = 10
z = 0
text = "test"
What's wrong here?
glOrtho(0.0, SCREEN_WIDTH, SCREEN_HEIGHT, 0.0, -1.0, 10.0);
OpenGL v2.2
SDL v1.2.15
Kubuntu Raring x64
Update: When using ..._Solid instead of ..._Blended, calling glColor3f(1,1,1) and passing SDL_Color {255,255,255} results in some strange stuff:
The quad appears where it should appear, and it shows strange content. What's wrong?

THe problem was that I didn't call glBlendFunc before calling above method. So OpenGL had a wrong blending mode set. After using glBlendFunc(GL_SRC_ALPHA, GL_ONE_MINUS_SRC_ALPHA);it looks fine.

Related

Render fonts with freetype

I made opengl rendering engine, and i can render shapes, 3d shapesand textures. Then i wanted to render fonts. I used freetype library to do this. But i have one serious problem with it. When i render font it looks terrible. First i will explain how i initialized freetype, and loaded font, then how i render textures, so you will be able to see itf there are any mistakes.
I initialize freetype and load font like this:
FT_Library library;
FT_Face face;
FT_GlyphSlot slot;
FT_Init_FreeType(&library);
FT_New_Face(library, "arial.ttf", 0, &face);
FT_Set_Char_Size(face, 0, 20 * 64, 300, 300);
slot = face->glyph;
FT_Load_Char(face, 'a', FT_LOAD_RENDER);
Then i load it into my texture:
this->tex.LoadFromBuffer(slot->bitmap.buffer, slot->bitmap.width, slot->bitmap.rows);
The tex object is just texture container which looks like this:
class Texture
{
public:
void LoadFromBuffer(unsigned char* buf, int w, int h);
float sizex, sizey;
GLuint texName;
};
And load from buffer function looks like this:
void Texture::LoadFromBuffer(unsigned char* buf, int w, int h)
{
this->sizex = w;
this->sizey = h;
glGenTextures(1, &this->texName);
glBindTexture(GL_TEXTURE_2D, this->texName);
glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MIN_FILTER, GL_LINEAR);
glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MAG_FILTER, GL_NEAREST);
glPixelStorei(GL_UNPACK_ALIGNMENT, 1);
glTexImage2D(GL_TEXTURE_2D, 0, GL_RGBA, w, h, 0, GL_RGB, GL_UNSIGNED_BYTE, buf);
glBindTexture(GL_TEXTURE_2D, 0);
stbi_image_free(buf);
}
Then texture is created and i render it just normaly with opengl on squad:
void Renderer::Render(Quad& quadv)
{
glEnable(GL_TEXTURE_2D);
glTexEnvf(GL_TEXTURE_ENV, GL_TEXTURE_ENV_MODE, GL_DECAL);
glBindTexture(GL_TEXTURE_2D, quadv.texture->texName);
glBegin(GL_QUADS);
glColor3f(quadv.color.r, quadv.color.g, quadv.color.b);
glTexCoord2f(0.0, 0.0); glVertex2f(quadv.vertices[0].x, quadv.vertices[0].y);
glTexCoord2f(1.0, 0.0); glVertex2f(quadv.vertices[1].x, quadv.vertices[1].y);
glTexCoord2f(1.0, 1.0); glVertex2f(quadv.vertices[2].x, quadv.vertices[2].y);
glTexCoord2f(0.0, 1.0); glVertex2f(quadv.vertices[3].x, quadv.vertices[3].y);
glEnd();
glDisable(GL_TEXTURE_2D);
}
Quadv is object which contains vertices of quad, but its not important here.
Texture in quadv is the texture with letter a, that i loaded before.
Code looks just normal to me, but when i run it, the texture looks like this:
A letter is triple no matter what size texture is or size of quad.
And whole image is terrible.
I don't recall what is the default PixelMode when using FT.
But it looks to me like you are assuming that the bitmap provided by FT comes as a 32-bit RGBA color, which is probably not the case.
I'm gonna assume it comes as an 8-bit color. Try changing:
glTexImage2D(GL_TEXTURE_2D, 0, GL_RGBA, w, h, 0, GL_RGB, GL_UNSIGNED_BYTE, buf);
to
glTexImage2D(GL_TEXTURE_2D, 0, GL_RGBA, w, h, 0, GL_RED, GL_UNSIGNED_BYTE, buf);
We replaced GL_RGB which was the input format to GL_RED such that the tex image function expects 1 component per pixel. FT2 Documentation for further information
The bitmap contains 1 channel per pixel, encoded in a single byte. Since you're using legacy OpenGL, I recommend using the internal texture format GL_ALPHA. Therefore each element of the texture is treated as a single alpha component.
glTexImage2D(GL_TEXTURE_2D, 0, GL_RGBA, w, h, 0, GL_RGB, GL_UNSIGNED_BYTE, buf);
glTexImage2D(GL_TEXTURE_2D, 0, GL_ALPHA, w, h, 0, GL_RED, GL_UNSIGNED_BYTE, buf);
Enable Blending to show only the opaque part of the glyphs:
void Renderer::Render(Quad& quadv)
{
glEnable(GL_TEXTURE_2D);
glTexEnvf(GL_TEXTURE_ENV, GL_TEXTURE_ENV_MODE, GL_DECAL);
glBindTexture(GL_TEXTURE_2D, quadv.texture->texName);
glEnable(GL_BLEND);
glBlendFunc(GL_SRC_ALPHA, GL_ONE_MINUS_SRC_ALPHA);
glBegin(GL_QUADS);
glColor3f(quadv.color.r, quadv.color.g, quadv.color.b);
glTexCoord2f(0.0, 0.0); glVertex2f(quadv.vertices[0].x, quadv.vertices[0].y);
glTexCoord2f(1.0, 0.0); glVertex2f(quadv.vertices[1].x, quadv.vertices[1].y);
glTexCoord2f(1.0, 1.0); glVertex2f(quadv.vertices[2].x, quadv.vertices[2].y);
glTexCoord2f(0.0, 1.0); glVertex2f(quadv.vertices[3].x, quadv.vertices[3].y);
glEnd();
glDisable(GL_TEXTURE_2D);
}

How to transform SDL TTF Surface into GL Texture with Transparent background

I would like to draw text over content drawn in GL. I want the symbols themselves to be opaque, whilst the rest transparent, allowing the drawn content to be seen. The following code yields a text, which is the correct one, yet with a perfectly white background. My drawn content is completely absent.
How am I to solve this? I am using SDL 2.0, VSC
glPushMatrix();
/*Content drawn in GL*/
GLuint TextureID = 0;
SDL_Color Color = {30, 30, 30, 0};
TTF_Font * Font = TTF_OpenFont("Times.ttf", 30);
SDL_Surface * Message = TTF_RenderText_Blended(Font, "ASDASDASD", Color);
glGenTextures(1, &TextureID);
glBindTexture(GL_TEXTURE_2D, TextureID);
glTexImage2D(GL_TEXTURE_2D, 0, GL_ALPHA, Message->w, Message->h, 0, GL_RGBA, GL_UNSIGNED_BYTE, Message->pixels);
glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MIN_FILTER, GL_LINEAR);
glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MAG_FILTER, GL_LINEAR);
glBindTexture(GL_TEXTURE_2D, TextureID);
glBegin(GL_QUADS);
{
glColor4f(.5, .5, .5, 1);
glTexCoord2f(0,0); glVertex2f(MouseX/10, MouseY/10);
glTexCoord2f(1,0); glVertex2f((MouseX/10) + (Message->w / 10), MouseY/10);
glTexCoord2f(1,1); glVertex2f((MouseX/10) + (Message->w / 10), (MouseY/10) + (Message->h / 10));
glTexCoord2f(0,1); glVertex2f(MouseX/10, (MouseY/10) + (Message->h / 10));
}
glEnd();
glPopMatrix();
SDL_FreeSurface(Message);
SDL_GL_SwapWindow(GameWindow);
Think of it this way: When you create the texture above, you're drawing dark grey fully transparent (30,30,30,0) text against a fully transparent background (0,0,0,0 due to TTF_RenderText_Blended). You're then using immediate mode color blending to raster a quad of the same size (HINT: with no blend func and no mention of z buffer disable!).
P.S. you're leaking like crazy in the example:
glGenTexture every frame without a glDeleteTextures (you only need a
new one if it changes)
TTF_OpenFont without a TTF_CloseFont in every
frame (keep it only until you do not require rendering of that font)
TTF_RenderText_Blended surface isn't leaked but you could free it right after
glTexImage2D
I assume you're meaning to use the font as a mask to subtract from a solid color background? I generally create font textures white (full alpha) then apply color or masking in the shader. To accomplish a similar effect in immediate mode you could:
// startup
glEnable(GL_BLEND);
glDisable(GL_DEPTH_TEST);
SDL_Color Color = {255, 255, 255, 255};
TTF_Font * Font = TTF_OpenFont("Times.ttf", 30);
SDL_Surface * Message = TTF_RenderText_Blended(Font, "ASDASDASD", Color);
TTF_CloseFont(Font);
glGenTextures(1, &TextureID);
glBindTexture(GL_TEXTURE_2D, TextureID);
glTexImage2D(GL_TEXTURE_2D, 0, GL_ALPHA, Message->w, Message->h, 0, GL_RGBA, GL_UNSIGNED_BYTE, Message->pixels);
SDL_FreeSurface(Message);
glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MIN_FILTER, GL_LINEAR);
glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MAG_FILTER, GL_LINEAR);
// frame render
glClear(GL_COLOR_BUFFER_BIT);
// you'll see this in many (immediate mode) 2D rendering examples
// without the blend eq below, this would render the white text on top of the quad's background color
glBlendFunc(GL_SRC_ALPHA, GL_ONE_MINUS_SRC_ALPHA);
// use text as a mask to cut away from what is below
glBlendEquation(GL_FUNC_REVERSE_SUBTRACT);
glBindTexture(GL_TEXTURE_2D, TextureID);
glBegin(GL_QUADS);
{
glColor4f(.5, .5, .5, 1);
glTexCoord2f(0,0); glVertex2f(MouseX/10, MouseY/10);
glTexCoord2f(1,0); glVertex2f((MouseX/10) + (Message->w / 10), MouseY/10);
glTexCoord2f(1,1); glVertex2f((MouseX/10) + (Message->w / 10), (MouseY/10) + (Message->h / 10));
glTexCoord2f(0,1); glVertex2f(MouseX/10, (MouseY/10) + (Message->h / 10));
}
glEnd();
// if done every frame, make sure to: glDeleteTextures(1, &TextureID);
SDL_GL_SwapWindow(GameWindow);
Very handy site here: http://www.andersriggelsen.dk/glblendfunc.php

SDL2 with OpenGL texture displaying incorrectly

I have searched for this but unfortunately the only answers I find are those that deal with the issue of textures not being mapped, in this case the texture is mapped but does not look like the loaded surface.
Anyway, ignoring the fact that power of 2 square images aren't required (which I've yet to properly look into yet) I've made a functional script for expanding the surface to power of 2 dimensions and a structure for storing the resized surface, the old dimensions of the surface and the ID for the texture.
My surface to texture code is (arguments are SDL_Surface* surf, antTex* tex):
tex->w=surf->w;
tex->h=surf->h;
tex->surf=resizeToNearestPow2(surf);
glGenTextures(1, &tex->id);
glBindTexture(GL_TEXTURE_2D, tex->id);
glTexImage2D(GL_TEXTURE_2D, 0, GL_RGBA, tex->surf->w, tex->surf->h, 0, GL_BGRA, GL_UNSIGNED_BYTE, tex->surf->pixels);
glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MAG_FILTER, GL_NEAREST);
glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MIN_FILTER, GL_NEAREST);
glBindTexture(GL_TEXTURE_2D, NULL);
The antTex struct is:
GLuint id; //Texture ID
int w, h; //Original Image Size
int rw, rh; //Resized Canvas Size
SDL_Surface* surf; //Resized Surface
Everything about resizing the image appears to be working fine (having used SDL's SDL_SaveBMP function to check the resulting image), I used SDL2_image.h's IMG_Load for loading the original image.
When I draw a plane with the texture mapped to it while GL_BLEND is enabled nothing shows up at all, when I disable it I get this (the red is the window's background colour):
http://i1200.photobucket.com/albums/bb336/DarknessXeagle/error_zps03e1e5a1.png
The original image was this:
http://i1200.photobucket.com/albums/bb336/DarknessXeagle/d_zpsc8b9af6f.png
This is my function for drawing plane with the texture mapped to it (arguments are antTex* tex, int x, int y):
glBindTexture(GL_TEXTURE_2D, tex->id);
int w, h;
w=tex->w;
h=tex->h;
GLfloat tw, th;
th=(GLfloat)tex->h/(GLfloat)tex->rh;
tw=(GLfloat)tex->w/(GLfloat)tex->rw;
glPushMatrix();
glTranslatef(x, y, 0);
glBegin(GL_QUADS);
glNormal3f(0, 0, 1);
glTexCoord2f(0, th); glVertex2f(0, h);
glTexCoord2f(tw, th); glVertex2f(w, h);
glTexCoord2f(tw, 0); glVertex2f(w, 0);
glTexCoord2f(0, 0); glVertex2f(0, 0);
glEnd();
glPopMatrix();
glBindTexture(GL_TEXTURE_2D, NULL);
You have a problem with u and v coordinates passed to render the texture into the quad using glTexCoord2f.
You need to change:
glTexCoord2f(0, th); glVertex2f(0, h);
glTexCoord2f(tw, th); glVertex2f(w, h);
glTexCoord2f(tw, 0); glVertex2f(w, 0);
glTexCoord2f(0, 0); glVertex2f(0, 0);
into:
glTexCoord2f(0, 1); glVertex2f(0, h);
glTexCoord2f(1, 1); glVertex2f(w, h);
glTexCoord2f(1, 0); glVertex2f(w, 0);
glTexCoord2f(0, 0); glVertex2f(0, 0);

Draw 2-Dimensional Image 32bit

I'm trying to draw a buffer of pixels to the screen. When I draw, black is drawn as transparent which is perfect. However, other colours are also drawn transparent. I cannot seem to figure out why.
I draw using:
glDrawPixels(width, height, GL_BGRA, GL_UNSIGNED_BYTE, buffer);
to draw a 32 bit bmp. However, the bitmap does not show unless I do convert it to 24 bit and use GL_BGR. Am I doing something wrong? Is there a reason black would be transparent?
Right before doing a draw, I do:
void Enable2DDrawing(bool &DrawingEnabled, bool &GLTexture2D, bool &GLRectangleTexture, bool &PointSmooth, float &PointSize)
{
if (!DrawingEnabled)
{
GLTexture2D = glIsEnabled(GL_TEXTURE_2D);
GLRectangleTexture = glIsEnabled(GL_TEXTURE_RECTANGLE);
PointSmooth = glIsEnabled(GL_POINT_SMOOTH);
glGetFloatv(GL_POINT_SIZE, &PointSize);
glDisable(GL_TEXTURE_RECTANGLE);
glDisable(GL_TEXTURE_2D);
glEnable(GL_POINT_SMOOTH);
glHint(GL_POINT_SMOOTH_HINT, GL_NICEST);
glPushMatrix();
glLoadIdentity();
DrawingEnabled = true;
}
}
and right after drawing, I do:
void Disable2DDrawing(bool &DrawingEnabled, bool GLTexture2D, bool GLRectangleTexture, bool PointSmooth, float PointSize)
{
if (DrawingEnabled)
{
glPopMatrix();
if (GLTexture2D) glEnable(GL_TEXTURE_2D);
if (GLRectangleTexture) glEnable(GL_TEXTURE_RECTANGLE);
if (PointSmooth) glDisable(GL_POINT_SMOOTH);
DrawingEnabled = false;
}
}
Then I swap the buffer. I also tried drawing using textures by doing:
GLuint LoadTexture(void* Buffer, int width, int height, GLenum Target)
{
GLuint ID = 0;
glGenTextures(1, &ID);
glBindTexture(Target, ID);
glTexParameteri(Target, GL_TEXTURE_WRAP_S, Target == GL_TEXTURE_2D ? GL_REPEAT : GL_CLAMP_TO_EDGE);
glTexParameteri(Target, GL_TEXTURE_WRAP_T, Target == GL_TEXTURE_2D ? GL_REPEAT : GL_CLAMP_TO_EDGE);
glTexParameteri(Target, GL_TEXTURE_MIN_FILTER, GL_LINEAR);
glTexParameteri(Target, GL_TEXTURE_MAG_FILTER, GL_LINEAR);
glTexImage2D(Target, 0, GL_RGBA, width, height, 0, GL_BGRA, GL_UNSIGNED_BYTE, Buffer);
glTexEnvf(GL_TEXTURE_ENV, GL_TEXTURE_ENV_MODE, GL_MODULATE);
return ID;
}
void DrawTexture(std::uint32_t Target, std::uint32_t ID, float X1, float Y1, float X2, float Y2, int Width, int Height)
{
Width = Target == GL_TEXTURE_RECTANGLE ? Width : 1;
Height = Target == GL_TEXTURE_RECTANGLE ? Height : 1;
glEnable(Target);
glBindTexture(Target, ID);
glBegin(GL_QUADS);
glTexCoord2f(0, Height);
glVertex2f(X1, Y1); //top left
glTexCoord2f(0, 0); //bottom left
glVertex2f(X1, Y2);
glTexCoord2f(Width, 0);
glVertex2f(X2, Y2); //bottom right
glTexCoord2f(Width, Height);
glVertex2f(X2, Y1); //top right
glEnd();
glDisable(Target);
}
But it does not draw the bitmap correctly. It draws a 32-bit bmp like:
http://i.imgur.com/A4pE2Uw.png when it is supposed to be completely white. If I draw each pixel 1 by 1, it works fine. Am I missing something?
What is the best way to draw 32 bit bitmaps and do I have to use glPixelStorei? Does anyone have sample code for drawing a bitmap or a nice explanation on how?
Have you enabled blending?
glBlendFunc(GL_SRC_ALPHA, GL_ONE_MINUS_SRC_ALPHA);
glEnable(GL_BLEND);

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.
Here's how to do it:
Initialize SDL and SDL_ttf, and create a window using SDL_SetVideoMode(). Make sure you pass the SDL_OPENGL flag.
Initialize your OpenGL scene (glViewport(), glMatrixMode() etc.).
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);
Then you can use the texture in OpenGL using glBindTexture() etc. Make sure to call SDL_GL_SwapBuffers() when you're done with drawing.
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;
}