iPhone Game Development - Chris Craft [68]
This technique is much easier than creating a 3-D generated world, but it can still be challenging to pull off without the right graphics. One interesting advantage to the 2-D option is that multiple tile sets can be created and used interchangeably. You could have a snow level, desert level, and jungle level very easily. Once you have one level working, all you really need for a new level is the graphics. Even though this technique is easier, it's an option that is best left until you have a few iPhone applications under your belt.
The next technique is pretty clever and very easy to do. You have probably seen an animated GIF image on the Internet. Imagine that you have an image of a road and that it is almost twice as wide as the iPhone's screen, which is 320 pixels wide. You could then move this image left and right very easily and create the illusion of a moving road.
There are a few questions. Will it be fast enough? Will it be realistic enough? And will it be fun? If not, we will have to find another solution. Another way to think of this technique is to imagine you have a piece of paper with an image of an iPhone printed on it. Now imagine you cut out the iPhone screen from this piece of paper. If you had a somewhat larger image of a road printed on another piece of paper, you would be able to hold it under the iPhone picture and create a simple moving road effect. It's a simple but powerful idea.
The last technique is another brainy solution to our problem. This is an important skill that you should try to learn and apply whenever possible. Instead of working harder and longer, try to find ways to work smarter. Take the problem at hand and look for ways to make it simpler. Sometimes you may find a way that completely collapses the problem into a much smaller and manageable task.
In this case, we have effectively taken the 2-D option and simplified it from having 150 tiles that are 32 pixels by 32 pixels to having 15 bands that are 320 pixels by 32 pixels. Even if we had 480 bands that were 320 pixels by 1 pixel, the code complexity has collapsed. The idea will work, but we will need to test it to see if it is good enough for our players. Another way to think of this method is to imagine you have a piece of paper with an image of an iPhone printed on it. Now imagine you cut out the iPhone screen from this piece of paper. Next, consider if you had a somewhat larger image of a road printed on another piece of paper, and you took this road image and cut it into 15 strips of paper. Now if you took these bands of road and put them under the iPhone picture, you could move the bands left and right independently and create the illusion of a moving, winding road.
As an experiment, let's try making two versions of AmuckRacer, one that uses the full-screen animation and the other that uses the river of image bands, and see which we like better. Sometimes the best way to decide which way is the best is to try them both. Usually you will learn something along the way that will make you glad you went the extra mile.
Full-screen animation
The full-screen animation method can be broken down into two agile development iteration steps: First, have the image move to the left and right over time, and second, have the image animate its motion over time. We could do these steps in any order, but let's add horizontal motion before we add animation to the image since it's a simpler step.
The game loop
One of the most basic game patterns is the concept of the game loop. At its simplest, there is a loop that calls an update method and then a draw method until the game ends. Figure 5.13 shows a basic game loop. A more advanced game loop might do much more and look something like the following code:
while( playerHasntExit )
{
checkForUserInput();
runAI();
moveEnemies();
resolveCollisions();
drawGraphics();
playSounds();
}
FIGURE 5.13
A basic game loop
There are two ways you can create