Creating a simple game in FlashLite 2.0

by Manikantan


Warning: ksort() expects parameter 1 to be array, object given in /home/croozeus/public_html/blogs/wp-content/plugins/yet-another-related-posts-plugin/includes.php on line 256

In the following article, I describe how to create a simple Flash Lite 2.0 game called – Heli. Heli is one of the classic video games played with lot of craze by young and old alike. In this article, you will see how to write the code logic for such games.

Screenshot

Gameplay

The game is quite simple to play. You have a helicopter to control and take a long trip. The trip’s length is undefined. You have obstacles in between and you need to avoid the helicopter’s collision with these obstacles. More obstacles you cross, higher is your score. Simple Right ?

The code perspective

We need to control the helicopter( I use heli as a substitute, here on ) with a single key. No, sideways movement is permitted for the heli. I personally like to control the heli using keys like * or #. This is an addictive game, its better to assign non-frequently used keys for it and also convenient to have a corner key to control. Ok, now back to code. When we press the * ( as per my code) , the heli lifts up or raises and on normal circumstances ( when nothing is pressed), it dips.

if (Key.isDown(56)) {
heli._y -= Heli_Spd;
} else {
heli._y += Heli_Spd;
}

In addition to this, we also have the obstacles or walls moving constantly to the right. The speed, with which these move, need to be configured as per the game play. Because, the movement happens constantly we code the movement inside an onEnterFrame. We should also make sure that once they reach the left side of the screen, we need to regenerate them at the right side. This will give an illusion as if new obstacles are coming, but actually we reuse the same. Initial placement of these obstacles can be arbitrary, preferably randomly spaced and beyond the right side of the screen. To regenerate the obstacles randomly, use a RandomNumber function and assign it to the _x. and _y attributes of the obstacle. In the following code, w1, w2, w3 are the obstacles.

onEnterFrame = function () {
w1._x -= Speed;
w2._x -= Speed;
w3._x -= Speed;
if (w1._x+w1._width<0) {
Score++;
w1._x = randRange();
w1._y = randRangeY();
}
if (w2._x+w2._width<0) {
Score++;
w2._x = randRange();
w2._y = randRangeY();
}
 
if (w3._x+w3._width<0) {
Score++;
w3._x = randRange();
w3._y = randRangeY();
}
 
// 56 is keyCode for *
 
if (Key.isDown(56)) {
heli._y -= Heli_Spd;
} else {
heli._y += Heli_Spd;
}
};

Checking collision

You need to check for collision of the heli with the obstacles regularly or at every short interval of say, 100ms. So, run the collision checking in a setInterval function. To check for collisions , use the hitTest() and to check collision with the borders ( top and bottom ), use simpler _y comparision. For optimised methods of Collisions scrutiny, read here. Remember, once you get positive results for collision, make the heli invisible and in that place include activate a simple Explosion animated GIF.

id = setInterval(checkColl, 100);
function checkColl() {
coll = false;
if (heli._y<=44) {
coll = true;
}
 
if ((heli._y+heli._height)>=166) {
coll = true;
}
if (heli.hitTest(w1) || heli.hitTest(w2) || heli.hitTest(w3)) {
coll = true;
}
if (coll) {
trace("Coll");
heli._visible = false;
clearInterval(id);
xplod._x = heli._x ;
xplod._y = heli._y -15;
xplod.play();
}
}

Updating Scores

To keep track of scores, simple just count the number of obstacles that reached the left side of the screen ( _y = 0 ). That will be a direct approximation of the score. Display the score to a dynamic text field placed on the top-left region of the screen. As you may see from the tutorial, its better to bind a variable to the textfield.

Other Notes, Guidelines

Use PNG images for Heli as the background should not be seen.

Store the high scores, this will improve the interest among users.

Always have a Game Menu screen at the beginning.

Allow the user to exit at any point of the game.

This article describes only the core logic/code of the game. The design, looks, sounds are out of the scope of this article.

Download

For the game in SWF format, click here.

For the game source, click here.

The maximum score I made on it is 47.  See if you can beat it 🙂

Related posts:

  1. Creating Simple Car games As a sequel to my previous post on Gaming Tutorial,...
  2. Getting Started with Flash Lite 1.1 Game Development I found this wonderful tutorial on how to get started...
  3. Game Physics! I have always liked to link more mathematics in...
  4. Creating a customized Ticker Component in Flash Lite The Ticker is essentially a scrolling text that can be...
  5. Sweet Memories v1.00 (touch game) Sweet Memories is a memory card game for touch screen...

Related posts brought to you by Yet Another Related Posts Plugin.