State is a term that is used in many different ways in game programming. For example, we will create a state manager later in the chapter that will manage different states, or modes, in the game. Another way to define state is a set of conditions. For example, when we set things up to render in 3D, this is one set of conditions or state. When we set up things to render in 2D, this is another set of conditions or state.

The trick to being able to render in both 2D and 3D is to be able to set up one state, and then change to another state. OpenGL saves state in matrices. In order to change from one state to another, we need a way to save the current matrix, set up another matrix, and then return to the previous matrix once we are done.

OpenGL provides two methods to save the current state and then retrieve it later:

A stack is a structure that allows you to put data on the top of it (a push), and then later retrieve the item from the top of it (a pop). A stack is useful when you want to save data in order, then later retrieve it in reverse order.

Let's say that we start with an initial set of conditions called State A:

A call to glPushMatrix() will put State A on the stack:

Next, we set up the conditions for State B. If we want to save this state, we issue another glPushMatrix() call:

Now we have two items on the stack, and it should also be very clear why it is called a stack! We could then define State C. This sequence of steps can continue on as needed, creating a render state and then pushing it to the stack. In general, we want to unload the stack in the reverse order that we loaded it in. This is known as a FILO stack: first in, last out.

We take things off of the stack with the glPopMatrix() command:

The result replaces State C, restoring the rendering settings to State B:

Another call to glPopMatrix() empties the stack and restores the rendering settings to State A:

The model view allows 32 matrices to be put onto the stack. Each view has its own stack, so the projection view has a separate stack from the model view. Also, if you issue glPopMatrix and there is no matrix on the stack, you will receive an error. In other words, don't try to pop more than you have pushed!

We are now going to set up our code to be able to render in both 3D and 2D. Open SpaceRacer3D.cpp. We are going to split up the rendering into two functions: Render3D, and Render2D. Then, we are going to call these from the main Render function. Let's start with Render3D. Add the following code just above the Render function (you can just cut it from the Render function):

void Render3D()
{
 if (gameState == GS_Running)
 {
  for (unsigned int i = 0; i < asteroids.size(); i++)
  {
   asteroids[i]->Render();
  }
  ship->Render();
 }
}

Next, we will create two support functions to turn 2D rendering on and off. The first will be Enable2D. Add the following function above the Render3D function:

void Enable2D()
{
  glColor3f(1.0f, 1.0f, 1.0f);
  glEnable(GL_TEXTURE_2D);
  
  glMatrixMode(GL_PROJECTION);
  glPushMatrix();
  glLoadIdentity();
  glOrtho(0, SCREEN_WIDTH, SCREEN_HEIGHT, 0, 0, 1);
  
  glMatrixMode(GL_MODELVIEW);
  glPushMatrix();
  glLoadIdentity();
  
  glPushAttrib(GL_DEPTH_BUFFER_BIT);
  glDisable(GL_DEPTH_TEST);
}

Enable2D performs the tasks that are necessary to change the rendering mode to 2D:

So, setting things up for 2D rendering involves four steps:

Now, we are ready to code the Disable2D function. Create this new function just below the Enable2D function that we just created:

void Disable2D()
{
  glPopAttrib();
  
  glMatrixMode(GL_PROJECTION);
  glPopMatrix();
  
  glMatrixMode(GL_MODELVIEW);
  glPopMatrix();
  
  glDisable(GL_TEXTURE_2D);
}

It shouldn't be too surprising that Disable2D performs actions in the reverse order that we performed them in Enable2D:

Now, it is time to create our Render2D function. Add the following code just above the Render3D function:

void Render2D()
{
  Enable2D();
  // Future 2D rendering code here
  Disable2D();
}

The funny thing is that we don't have any 2D content to render yet! Later in the chapter, we will fill in the rest of the content of this function. The important thing to note here is that this function will take care of enabling 2D rendering with the call to Enable2D. Then the code will be added to render our 2D content. Finally, we will turn off 2D rendering with the call to Disable2D.

Now that we have all of the necessary supporting code to render in 2D and 3D, we will modify the Render function:

void Render()
{
  glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT);
  glMatrixMode(GL_MODELVIEW);
  glLoadIdentity();
  Render3D();
  Render2D();
  SwapBuffers(hDC);
}

You will notice how simple this is now:

If you run the game now, you should notice that nothing has changed. As we haven't created any 2D content to render, the 3D content will display just as it did before. Now we are ready add our 2D content. Along the way we will flesh out some additional features to make a more complete game.