Creating a Vertical Shooter (Part I)

Vertical shooters are also known as Fixed Shooter.
A fixed shooter has players only able to control their two-dimensional position on the screen and sometimes the direction they are facing*
*Wikipedia
So, we will create a game using our super hero Pawel to kill dragons that are coming from one side of the screen.
Let's start.
- We need a sprite to make it walk, in this case I use a movieclip of Pawel and as he is a knight, the instance name is knight


On another layer, in the first frame of our timeline we need the following actionscript:

//---- variables ----
var steps:Number = 5;
var spriteX:Number = 265;
var spriteY:Number = 265;
//---- functions ----
function checkKeys() {
if (Key.isDown(Key.RIGHT)) {
spriteX += steps;
} else if (Key.isDown(Key.LEFT)) {
spriteX -= steps;
}
}
function updatePawel() {
knight._x = spriteX;
knight._y = spriteY;
}
this.onEnterFrame = function() {
checkKeys();
updatePawel();
};

Ok, our hero is moving from side to side on the screen but, can still move even outside of the stage!
we can animate the legs and the arms so it will look better and it will add the option of throwing arrows (we don't have arrows yet).


If we edit our movieclip, should have 3 layers; The arms and legs will be movieclips (inside of our movieclip Pawel) and will have their respective instance names.
So, let's update our script (first frame of the main timeline):

//---- variables ----
var steps:Number = 5;
var spriteX:Number = 265;
var spriteY:Number = 265;
//---- functions ----
function checkKeys() {
if (Key.isDown(Key.RIGHT) && spriteX<510) {
spriteX += steps;
knight.legs.play();
} else if (Key.isDown(Key.LEFT) && spriteX>40) {
spriteX -= steps;
knight.legs.play();
}
if (Key.isDown(Key.UP)) {
knight.arms.play();
}
}
function updatePawel() {
knight._x = spriteX;
knight._y = spriteY;
}
this.onEnterFrame = function() {
checkKeys();
updatePawel();
};

First we declare the variables, steps are the number of pixels our hero will move, spriteX and spriteY will help us to give value to the X and Y position of our hero.
The first function checks if we are pressing the keys that are making our hero to do things;
if (Key.isDown(Key.RIGHT) && spriteX<510){
spriteX += steps;
knight.legs.play();
}
means that only if we press the Right arrowKey and our hero is not outside of the stage, our hero will move to the right (remember, steps = 5 pixels) and the legs animation will play.
else if (Key.isDown(Key.LEFT) && spriteX>40) {
spriteX -= steps;
knight.legs.play();
}
same as above but in this case the conditional is if the Left arrowKey of our keyboard is pressed and the hero is not outside of the stage, the hero will move to the left by 5 pixels and the legs movieclip will play.
if (Key.isDown(Key.UP)) {
knight.arms.play();
}
If we press the Up arrowKey on our keyboard, the animation in our arms movieclip will play.
function updatePawel() {
knight._x = spriteX;
knight._y = spriteY;
}
This function is to telling flash that our hero will take the X and Y values of the variables spriteX and spriteY to change our heros position.
this.onEnterFrame = function() {
checkKeys();
updatePawel();
};
On real time, flash will be checking if we are pressing the keys or if our hero is moving.
Check the swf here

Next part of this "tutorial" coming soon

salut!