Cocos2d for iPhone 0.99 Beginner’s Guide

Make mind-blowing 2D games for iPhone with this fast, flexible, and easy-to-use framework! A cool guide to learning cocos2d with iPhone to get you into the iPhone game industry quickly Learn all the aspects of cocos2d while building three different games Add a lot of trendy features such as particles and tilemaps to your games to captivate your players Full of illustrations, diagrams, and tips for building iPhone games, with clear step-by-step instructions and practical examples

(For more resources on Cocos2d, see here.)

Handling accelerometer input

Now that we have our three basic elements roughly defined, let’s focus on the player’s interaction with the hero. We will start by allowing the player to move the hero using the device’s built-in accelerometer.

The accelerometer opens a new world of interaction between the user and the device, allowing for a lot of interesting uses.

There are already lots of applications and games that use this feature in innovative ways. For example, in the game Rolando, players have to roll the main character around using the accelerometer, and here we will be doing something similar to that.

The accelerometer gives you data of the current tilting of the device in the three axes, that is the x, y, and z axes. Depending on the game you are making, you will be needing all that data or just the values for one or two of the axis.

Fortunately, Apple has made it very easy for developers to access the data provided by the accelerometer hardware.

Time for action – moving your hero with the accelerometer

We have to add a few lines of code in order to have our hero move. The end result will be the hero moving horizontally when the user tilts the device to the left or to the right. We will also do some checkovers, in order to avoid the hero moving out of the screen.

1. The first step involved in using the accelerometer is to enable it for the CCLayers that want to receive its input. Add the following line of code to the GameLayer’s init method:

   self.isAccelerometerEnabled = YES;

   Then we have to set the update interval for the accelerometer. This will set the interval at which the hardware delivers the data to the GameLayer.

2. Add the following line afterwards:

   [[UIAccelerometer sharedAccelerometer] setUpdateInterval:
   (1.0 / 60)];

   Now that our GameLayer is prepared to receive accelerometer input, we just have to implement the method that receives and handles it.

3. The following is the method that receives the input and makes our hero move. Add it to the GameLayer class:

   - (void)accelerometer:(UIAccelerometer*)accelerometer didAccelerate:(UIAcceleration*)acceleration
   {
     static float prevX=0, prevY=0;
     
   #define kFilterFactor 0.05f
     
     float accelX = (float) acceleration.x * kFilterFactor + (1- 
       kFilterFactor)*prevX;
      
     prevX = accelX;
   
   //If the hero object exists, we use the calculated accelerometer values to move him
      
     if(hero)
     {
   //We calculate the speed it will have and constrain it so it doesn't move faster than he is allowed to
   
       float speed = -20 * -accelX;
       if(speed > hero.movementSpeed)
         speed = hero.movementSpeed;
       else if(speed < -hero.movementSpeed)
         speed = -hero.movementSpeed;
   
   //We also check that the hero won't go past the borders of the screen, if he would exit the screen we don't move it
         
       if((accelX >0 || hero.mySprite.position.x 
         >hero.mySprite.textureRect.size.width / 2) && ( accelX <0 
         ||hero.mySprite.position.x <320- 
         hero.mySprite.textureRect.size.width / 2))
         [hero.mySprite setPosition:ccp(hero.mySprite.position.x 
           +speed,hero.mySprite.position.y)];
     }
   }

4. Run the game now. You should be able to move the hero by tilting you device, as shown in the following screenshot:

   

The iPhone simulator does not provide a way to simulate accelerometer input, so you won’t be able to test it in there; it won’t move at all.

What just happened?

Accelerometer input can be achieved quite easily and fast. In our example, we just used the x component of the accelerometer input to handle the hero’s position.

The accelX variable holds the current value of the x component. This value ranges from -1 to 1, so we multiply it by the speed of the hero, then we just add that result to the current position of the hero, giving the sense of motion.

We are also checking to make sure that the hero is not going off the screen before applying that movement.