OpenGL ES: Part 1

Well it’s certainly been an interesting Week! WWDC was this week and Apple has released the preliminary documentation for iOS 5.0.  Because of that what I was going to write about this week actually changed. I was going to talk about setting up an OpenGL project and getting an image on the screen. Well, I am still going to talk about that but less in depth than I was going to. You see, iOS 5 has some new classes in it that are going to make using OpenGL even easier! GLKit is a new framework that will make it much easier to set up views with OpenGL. It also looks like it will provide a texture loader which is nice.

However that’s not out yet and covered under NDA so that’s not what I’ll be talking about! Though it is really nice that it’s coming because one of the biggest barriers to entry is how much initial setup you have to do before you can start tinkering. I definitely learn from seeing and doing so getting something up and running is pretty important to me. Because of this I created an Xcode template which I think will speed the process along. It’s really simple, it consists of an EAGLView and a Texture2D class that can be used to load images into OpenGL to be used as textures.

Now the first thing I want to say is that the goal of this template is just to be a place to get stuff up and running and to draw something to the screen. It makes it easy to tinker and start getting a feel for OpenGL.  A real application is going to want to structure certain parts differently.  You’ll want a way to manage your textures, and batch objects to be drawn. Binding textures is an expensive operation so you want to do it as infrequently as possible.

Consider this quazi-Tetris puzzle game of some sort I have below. Now imagine each of those shapes is its own sprite. If you wanted to render this board one easy to implement way would be to simply start in the top left and move left to right, top to bottom rendering each object you haven’t yet drawn the first time you get to it. That would look something like this:

You can see in this example that almost every time we have to swap which texture is current being used by OpenGL.  Only in one case are we drawing the same texture twice in a row. This results in a lot of texture swapping which is very poor for performance. So instead what we might do is make a queue of all the objects that need to be drawn and then sort that queue. The benefit to this is that we’re drawing all instances of one texture concurrently minimizing the number of texture swaps:

Now taking this to it’s logical conclusion the best scenario would be if we just loaded one texture and never swapped it out for another. But how would we do this? Well the solution is to make a texture atlas combining all of your sprites onto a single image. Then when you go to render one of the sprites you only render a portion of the total texture. The benefit is that you only have to load one texture:

The drawbacks are that it’s going to take more memory to store that texture, if you have a large game with lots of sprites you might not be able to make them all fit on one atlas. The iPhone 3GS and up support textures of 2048px x 2048px. Also you might have certain images that are used consistently while others are dependent on the progress of the game. Consider a platformer, you might have the level elements in one atlas and the character’s sprites in a separate atlas. Thats why the best approach is a hybrid between 2 and 3.

I actually don’t have time to write as much as I would like to this week because I’ve got to get going to watch a friend of mine do standup. I’m going to post the template I made even though I haven’t explained what’s going on yet. All it does is set up OpenGL and draw an image to the screen. You can use this for starting OpenGL projects to play around.  It’s going to be a work in progress and as I give things more structure I’m going to improve it.

I should add that the Texture2D class is really simple. It expects only images who’s height and width are powers of 2. Once I saw that Apple would have their own texture loader class I figured it wasn’t really worth putting the effort into making it super complex.

Just download the template here: << TEMPLATE >>

and extract it to this folder:
~/Library/Developer/Xcode/Templates/Project Templates/

If the Project Templates folder doesn’t exist just make one.

All of the tutorials I posted last week explain what’s going on here setting up OpenGL. So if you’re confused with anything I’d check them out.

Comments are closed.