Drawing simple shapes – Open GL Tutorial 1 by Osama Hosam

Introduction:

I’m going to introduce a series of lessons about OpenGL. The series will start from drawing simple shapes to developing a complete game with games AI and level difficulties. In our work, we are going to use GLUT library for drawing objects. GLUT library is more advanced than classic GLU, it has much functionality that saved time and made programming in OpenGL more interesting and easy. In this lesson we will introduce how to develop new OpenGL project form scratch. Also we are going to show you how to draw a simple line and triangle.

The needed background and tools:

To work smoothly with our lessons, you should learn the basics of C++, as OpenGL library is implemented by using C++ and we are going to use the Visual C++ environment. To be able to run our examples, on your machine you should install Visual C++ and Install GLUT and OpenGL libraries.

You can download glut from Glut website and use the installation instructions for windows athttp://www.cs.csustan.edu/~rsc/SDSU/GLUTinstall.html.

Creating your first OpenGL project:

Open a new project in Visual C++ 6 and select the “Win32 Console Application”, then select a name and a path for your project. As shown in Fig. 1

Then, select the “A simple application” to select a simple console application, as shown in Fig. 2

The created project will contain only the following code segment

#include "stdafx.h"
int main(int argc, char* argv[])
{
return 0;
}

We need to include the GLUT library and by using code, and link to OpenGL, Glu, and Glut libraries as shown in the following code

#include "stdafx.h"
#include
#pragma comment (lib, "opengl32.lib") /* link with Microsoft OpenGL lib */
#pragma comment (lib, "glu32.lib") /* link with OpenGL Utility lib */
#pragma comment (lib, "glut32.lib") /* link with Win32 GLUT lib */

So far, we have done all setup needed to write our OpenGL program.

OpenGL program structure:

Now, we need to know the basic shape of typical OpenGL program, any OpenGL program should have the following structure

Initialization function: this function will initialize the environment of OpenGL to be ready for drawing shapes, this function will be called only once in the beginning of running the program.

Resize function: will be used to reset the OpenGL window to the desired parameters. This function will be activated whenever you resize your window.

Display function: This function is responsible for rendering the OpenGL scene; this function will be repeated endlessly as long as the program is running.

Main function: this function contains instructions for creating the OpenGL window and looping for ever. The loop can be controlled by a timer function; we will show how to implement that in the next lessons. This can be shown by the following code segment

void init(void)
{
//initialization code will be written here       
}
void resize (int width, int height)
{
//resizing window code will be written here
}
void display(void)
{
//rendering the scene
}
int main(int argc, char* argv[])
{
//The body of the program
return 0;    
}

Drawing simple shapes

Our work in this lesson will be focused on 2D applications, in the next lessons we will show how to draw objects in 3D environments. We will show what will be included in the above explained functions.

Initialization: In this function we will set the background color of the window to black, you can select any color you want.

void init(void)
{
glClearColor (0.0, 0.0, 0.0, 0.0);
glHint(GL_PERSPECTIVE_CORRECTION_HINT, GL_NICEST);
}

glClearColor is the function which sets the window’s background color. glHint specifies the behavior, GL_PRESPECTIVE_CORRECTION_HINT is the behavior to be controlled. GL_NICEST is the desired behavior, the default values for both of them are GL_DONT_CARE.

Resizing: when the user wants to change the window size, specified calculations should be calculated. The aspect ratio should be changed due to the change in the window size

void resize (int w, int h)
{
glViewport (0, 0, (GLsizei) w, (GLsizei) h);
glMatrixMode (GL_PROJECTION);
glLoadIdentity ();
gluOrtho2D (0, w, 0, h);
glMatrixMode (GL_MODELVIEW);
glLoadIdentity ();
}

glViewport is the function to specify the portion of the window which will display the OpenGL scene. In our example we selected the whole window to be our view port. Many View ports can be selected to display different scenes in the same window; this will be shown in the advanced lessons. The work of the glViewport can be shown in Fig. 3

The functions glMatrixmode, glLoadIdentity, and gluOrtho2D define an orthogonal projection to be used to map the contents of the rectangular area (2D) of the world coordinate to the screen. And the range of x-coordinates will be from 0 to w (width) and y-coordinates from 0 to h (height). The origin will be at the lower left corner of the window. Anything in the real world will range from 0 to w and 0 to h will lie inside the window and will be displayed, anything drawn outside this range will not displayed in the window.

Displaying: In this step we need to draw simple shapes, we are going to draw simple line and triangle. As we said in the resizing step, we need to define coordinates inside the range w, h so we will be able to display the object inside the window or the view-port.

void display(void)
{
glClear(GL_COLOR_BUFFER_BIT );
glLoadIdentity();
glBegin(GL_LINES);
glVertex2i(180,15);
glVertex2i(10,145);
glEnd();
glBegin(GL_TRIANGLES);
glVertex2i(200,200);
glVertex2i(100,75);
glVertex2i(250,100);
glEnd();
glutSwapBuffers();
}

glClear clears the buffer bit of the memory, then we drawn a Line by using to end vertices in 2D. For the triangle we have used the three vertices of its corners. See Fig. 4 for the results

In the coming lessons we will add some colors and movements to the shapes.

Source Code:

Click here to download the source code for the lesson