Doodle Jump is definitely my favorite game on the Apple’s phone. The game play is only based on the accelerometer of the phone. The good news is that flash Player 10.1 and AIR 2.0 can access the accelerometer thanks to a new API. Traveling back from Germany, I got two hours in the train to test this new API and develop a little Flash game: Icare (“Icarius”). As the character in Greek mythology, Icare tries to escape Crete by flight… but he can only fall to his death at the end of the game.
It’s amazing to see that less than 180 lines of code are necessary to run this game. This is the beauty of Flash and ActionScript 3. The new Accelerometer API is quite simple:
var myAcc:Accelerometer = new Accelerometer(); myAcc.addEventListener(AccelerometerEvent.UPDATE, onAccUpdate); function onAccUpdate(evt:AccelerometerEvent):void{ accX = evt.accelerationX; }
In this game, I just need to get the acceleration on the X-axis. It will control Icare to make him fly to the left, or to the right. I’ve used an easing function to give a natural move to my character on every frame (ENTER_FRAME event):
MyIcare.x -= (MyIcare.x - (MyIcare.x + accX * 10))*0.6;
To generate the clouds (the sticks in the original Doodle Jump game and in my code), I’m using the Object pooling technic detailed in the Flash Optimization guide for mobile devices. First I create a Vector object that will store my five clouds:
var myVect:Vector.<MovieClip> = new Vector.<MovieClip>(5,true);
Then I loop on the MovieClips to create them once and store them in the Vector object:
for (var i:int=0; i< 5; i++){
tempStick = new stick;
tempStick.x = Math.random()*stage.stageWidth;
tempStick.y = 0 + i*stage.stageHeight/6;
myVect[i] = tempStick;
addChild(tempStick);
tempStick.cacheAsBitmap = true;
}
Storing the clouds/sticks optimizes your code, as you don’t need to re-instantiate the objects. When they are out of the screen, just move them.
for (var k:int=0; k< 5; k++){
tmpMc = myVect[k];
if(tmpMc.y > stage.stageHeight){
tmpMc.y = -5;
tmpMc.x = Math.random()*stage.stageWidth;
}
}
Now, here’s the fun part. Using Device Central CS5, I’m able to debug my application simulating the accelerometer! A new tab displays a 3D view of my phone, and I can play with it to emulate the orientation of my phone in the space. Then, I ‘m able thanks to Flash C5 to package and run my game on my Apple’s phone. Thanks to the private beta of AIR on Android, I’m also able to run my game on my Google’s phone. One code, several screens. I like that, don’t you?
Here is the source code of my application (I’ve packaged a classic Flash FLA file so that you can easily test my game using Device Central CS5): http://www.riagora.com/pvt_content/icare/accelerometer_icare_debug.fla
To get notified when the AIR beta for Android will be publicly available, click on this link.
Here is a video of my game running on my PC with Device Central CS5 for testing purposes, on my Apple’s phone, and on my Google’s phone.
I'm Michaël CHAIZE, Adobe Flash Platform Evangelist based in Paris. I'm a big fan of Rich Internet Applications and I promote the Flash Platform in the Enterprise world.
Andrew Trice
Christophe Coenraets
Greg Wilson
Holly Schinsky
Piotr Walczyszyn
Raymond Camden
Hi, I’ve told you about a little problem about Accelerometer. Everything looks right… I wonder what is wrong? I appreciate if you take a look.
http://android.developerscrew.com/example.zip
Thanks!
oh that’s funny. I made exactly the same mistake the first time I tried to play with the accelerometer API.
Move your accelerometer definition out of the constructor and it will work. You should obtain something like this:
private var accX:Number = 0;
private var accY:Number = 0;
private var acc:Accelerometer = new Accelerometer();
oh, that’s really funny but isn’t it weird
btw thanks a lot!
Hi!
My Flash CS3 cannot open your example source code. What progam should I use to open it ?
Please help.
Hi!
Can you tell me the code part, that not allows Icare to escape the upper part of screen ?
I made a similar game, but i cannot code that part.
Just please tell me, why all my comments always deleted? -.-
Please answer me here the reason:
joying@citromail.hu
I guess you need Flash CS5. You can get the trial version on adobe.com
The link to the source code is available. Basically, the trick consists in detecting if the character is in the middle of the screen. If it’s the case, then everything else must move except him
Sorry… I have to login in my admin console to approve the comments. Now you’ll automatically be approved, don’t worry
Hello, i have test the game on iPhone4, its really slow i think. Is there a workaround to make it faster.
It should be super fast. Have you activated the GPU mode ?
yes i have enabled GPU mode. With resolution standard the fps are 30 with resolution high the fps are about 13-15. Is there an other way to export to ipa.
http://imageshack.us/photo/my-images/838/icare.png/
first of all, it’s so helpful tut for me. And i want to ask you some questions.
i wanted to create accelerometer maze. But i have one problem. i don’t know how to make maze walls which are stoping acceleration of ball. Hope you can help me.