This is my third article about OpenGL and this one is about texture mapping. In the previous articles we could only make one color cubes and triangles or whatever. But after you read this you can make a nice walls or boxes or just what you need. This texture mapping techniques are for 2D. But this can be used to map a 3D triangle or cube to add a texture on every single side.
Texture requirements
Our textures must equal in width and height like 256 x 256 or something like that. The class we use from CsGL to read in the textures can handle almost any picture file type. This is because it uses the Image class from GDI+.
Coding
Ok lets go to the coding. Before we start coding I first want to teach you how the coordinates work for the texture. The begin point is the bottom left corner which is 0.0, 0.0 and goes up to the top right at 1.0, 1.0 and everything between.
Before we can load any texture we need to make OpenGL ready for texture mapping. So take the base code from the article OpenGL using csGL and start coding.
protected override void InitGLContext()
{
GL.glEnable(GL.GL_TEXTURE_2D); // this one is added
GL.glShadeModel(GL.GL_SMOOTH);
GL.glClearColor(0.0f, 0.0f, 0.0f, 0.5f);
GL.glClearDepth(1.0f);
GL.glEnable(GL.GL_DEPTH_TEST);
GL.glDepthFunc(GL.GL_LEQUAL);
GL.glHint(GL.GL_PERSPECTIVE_CORRECTION_HINT, GL.GL_NICEST);
}
In OpenGL it is kind of hard to make a texture loader for a lot of file types but with CsGL there is a pre made texture loader in it which uses the Image class for loading the texture. Ok add this line of code at the OurView class.
protected CsGL.OpenGL.OpenGLTexture2D Texture;
And this at the constructor.
The texture file is downloadable here.
Texture = new OpenGLTexture2D(@"texture file");
Next thing is to make our texture the current texture we do this with.
Texture.Bind();
This must be placed at the glDraw function in the OurView class and then place the texture on the quads the whole glDraw function will look like this.
Texture.Bind();
GL.glBegin(GL.GL_QUADS);
// Front Face
GL.glTexCoord2f(0.0f, 0.0f); GL.glVertex3f(-1.0f, -1.0f, 1.0f);
GL.glTexCoord2f(1.0f, 0.0f); GL.glVertex3f( 1.0f, -1.0f, 1.0f);
GL.glTexCoord2f(1.0f, 1.0f); GL.glVertex3f( 1.0f, 1.0f, 1.0f);
GL.glTexCoord2f(0.0f, 1.0f); GL.glVertex3f(-1.0f, 1.0f, 1.0f);
// Back Face
GL.glTexCoord2f(1.0f, 0.0f); GL.glVertex3f(-1.0f, -1.0f, -1.0f);
GL.glTexCoord2f(1.0f, 1.0f); GL.glVertex3f(-1.0f, 1.0f, -1.0f);
GL.glTexCoord2f(0.0f, 1.0f); GL.glVertex3f( 1.0f, 1.0f, -1.0f);
GL.glTexCoord2f(0.0f, 0.0f); GL.glVertex3f( 1.0f, -1.0f, -1.0f);
// Top Face
GL.glTexCoord2f(0.0f, 1.0f); GL.glVertex3f(-1.0f, 1.0f, -1.0f);
GL.glTexCoord2f(0.0f, 0.0f); GL.glVertex3f(-1.0f, 1.0f, 1.0f);
GL.glTexCoord2f(1.0f, 0.0f); GL.glVertex3f( 1.0f, 1.0f, 1.0f);
GL.glTexCoord2f(1.0f, 1.0f); GL.glVertex3f( 1.0f, 1.0f, -1.0f);
// Bottom Face
GL.glTexCoord2f(1.0f, 1.0f); GL.glVertex3f(-1.0f, -1.0f, -1.0f);
GL.glTexCoord2f(0.0f, 1.0f); GL.glVertex3f( 1.0f, -1.0f, -1.0f);
GL.glTexCoord2f(0.0f, 0.0f); GL.glVertex3f( 1.0f, -1.0f, 1.0f);
GL.glTexCoord2f(1.0f, 0.0f); GL.glVertex3f(-1.0f, -1.0f, 1.0f);
// Right face
GL.glTexCoord2f(1.0f, 0.0f); GL.glVertex3f( 1.0f, -1.0f, -1.0f);
GL.glTexCoord2f(1.0f, 1.0f); GL.glVertex3f( 1.0f, 1.0f, -1.0f);
GL.glTexCoord2f(0.0f, 1.0f); GL.glVertex3f( 1.0f, 1.0f, 1.0f);
GL.glTexCoord2f(0.0f, 0.0f); GL.glVertex3f( 1.0f, -1.0f, 1.0f);
// Left Face
GL.glTexCoord2f(0.0f, 0.0f); GL.glVertex3f(-1.0f, -1.0f, -1.0f);
GL.glTexCoord2f(1.0f, 0.0f); GL.glVertex3f(-1.0f, -1.0f, 1.0f);
GL.glTexCoord2f(1.0f, 1.0f); GL.glVertex3f(-1.0f, 1.0f, 1.0f);
GL.glTexCoord2f(0.0f, 1.0f); GL.glVertex3f(-1.0f, 1.0f, -1.0f);
GL.glEnd();
As you can see the glTexCoord2f() is to assign a texture point to a quad point. It is fairly easy when you notice that 0.0, 0.0 texture coordinate is the bottom left corner and -1.0f, -1.0f is also the left corner for the quad.
But the best way to get a good grip on the texture coordinates is to experiment with it. You could make a textured triangle for example. When you do that you must notice that 0.5, 1.0 is the triangle top coordinate for the texture otherwise you get a miss formed texture.
Summary
As you could see we covered basic texture mapping and it was quite easy. You could now make some great things like buildings etcetera.