Objective 3D

Textures and Shaders

Objective 3D includes convenience classes for loading and manipulating shaders and textures. This tutorial will start where the basic tutorial left off, and add a texture to the quad that will be colored by a shader. If you didn't complete the basic tutorial you can download the files to work with.

Creating and mapping a texture

  1. Add the image to your project. The download for this tutorial uses a file called "colormap.png"
  2. Declare a texture in the header file for your project. Again, this tutorial assumes that you are starting with the files from the basic tutorial.
    O3D_Texture *t;
  3. We want to load our texture in the prepareOpenGL method of our implementation file; we can do this with the following line of code:

    t = [[O3D_Texture alloc] initWithBitmap:[[NSBundle mainBundle] pathForResource:@"colormap.png" ofType:nil]];

    This assumes the bitmap file will be located in the Resources folder of your application, which is the default behavior if you've added the file to your project.

  4. Tell OpenGL to enable textures in our prepareOpenGL method
    glEnable( GL_TEXTURE_2D );
  5. Next we want to bind our texture (tell OpenGL to use it) before we draw our quad in our drawRect method. We do this with the simple command:
    [t bind];
  6. Finally, we need tell OpenGL which corners of our texture are mapped to which corners of our quad. We do this with a call to glTexCoord2 before we define each vertex of our quad. The code for this is as follows:

    glBegin(GL_QUADS);
    {
    glTexCoord2f(0.0f, 0.0f);
    glVertex3f(-.2, -.2,  -2);
    
    glTexCoord2f(1, 0.0f);
    glVertex3f( .2, -.2,  -2);
    
    glTexCoord2f(1, 1); 
    glVertex3f( .2,  .2,  -2);
    
    glTexCoord2f(0.0f, 1);
    glVertex3f(-.2,  .2,  -2);
    }
    glEnd();
    			
  7. Build and run! You should see the image appear on the surface of your quad. You can also download the files and try building / manipulating them.

Using a shader

This will NOT be a tutorial on how to write shaders. You can use the very simple shaders included in the project to try out this tutorial. This tutorial starts from where we left off after the texture tutorial.

  1. Bring the test.vert and the test.frag shader files into your project.

  2. Drag the test.vert and the test.frag shader files into the copy files build phase of your project. Alternatively, leave them wherever you want on your hard drive and enter the absolute path in the next step.

  3. Load the shader files in your prepareOpenGL method:

    s = [[O3D_Shader alloc] initWithVertexPath:[[NSBundle mainBundle] pathForResource:@"test.vert" ofType:nil]
    	fragmentPath:[[NSBundle mainBundle] pathForResource:@"test.frag" ofType:nil]];
    			

    Remember to release s in your dealloc method.

  4. That's all there is to it! This shader removes all the red information from your textures / colors. You can also pass ints and floats to the shaders using the setUniformFloat(s) / setUniformInt(s) methods.