Game Development Reference
In-Depth Information
Figure 5-4 . The CCParallaxNode lets you create an illusion of depth
Note Why does parallaxing create the illusion of depth? Because our minds are
trained to this effect. Imagine you're traveling in a car at high speed and look-
ing out a side window. You notice the trees next to the road (closest to you) zip-
ping by so fast you can hardly focus on a single one. Look a little further, and
you'll see the barnyard passing you by at a seemingly much slower rater. Then
look to the mountains at the horizon, and you'll hardly notice you're moving
past them at all. This is the parallax effect in a three-dimensional world, where
there are an infinite number of parallax layers. In a 2D game we have to (very
roughly) simulate the same effect with around two to eight parallax layers. Each
layer tries to fool your mind into thinking that it's a certain distance away from
your viewpoint, simply because it's moving at certain speeds relative to other
layers. It works surprisingly well.
Cocos2d has a specialized node you can use to create this effect. The code to create a
CCParallaxNode in Listing 5-17 is found in the Parallax01 project.
Listing 5-17. The CCParallaxNode Requires a Lot of Setup Work, but the Results Are
Worth It
// Load the sprites for each parallax layer, from background to foreground.
CCSprite* para1 = [CCSprite spriteWithFile:@"parallax1.png"];
CCSprite* para2 = [CCSprite spriteWithFile:@"parallax2.png"];
CCSprite* para3 = [CCSprite spriteWithFile:@"parallax3.png"];