Sei sulla pagina 1di 10

FIRST PART: In this part we are going to learn the basics of Movie Clips and character movement.

First create a new document in Flash, click "File" > "New...", select "ActionScript 2.0" and click Ok.

Create a Movie Clip by right clicking your library tab and selecting "New Symbol...", make sure "Movie
Clip" is selected and choose a name.

Flash will create and open the Movie Clip for editing, so just paste an image or draw a space ship with
Flash's drawing tools.

After drawing your ship, get back to the main timeline by click on "Scene 1":

Now drag your Movie Clip from the library to the Stage, select it and give it an instance name.

I am going to name it "Ship". So "Ship" is how I am going to call this Movie Clip instance inside my code.

We just made our ship, so let's make it move.


Right click the first frame in your timeline and select "Actions". Type this:

this.onEnterFrame = function()
{
if (Key.isDown(Key.RIGHT))
{
Ship._x += 10;
} else if (Key.isDown(Key.LEFT))
{
Ship._x -= 10;
} else if (Key.isDown(Key.UP))
{
Ship._y -= 10;
} else if (Key.isDown(Key.DOWN))
{
Ship._y += 10;
}
}

Press Ctrl + Enter and test it, use the arrow key to move your ship around.

Here is how this code works:

this.onEnterFrame = function()
{
...
}

This is a very simple event from flash; the code inside it will be executed every time flash enters this
frame.

if (Key.isDown(Key.RIGHT))
{
Ship._x += 10; //_x -= 10 would move the ship to the left.
}

This check if the right key is pressed, then move the Ship 10 pixels to the right.

else if (Key.isDown(Key.Up))
{
Ship._y -= 10; // _y += 10 would move the ship down.
}

If the up arrow key is pressed, the ship will move up.

It's the same thing as before, but this time we added "else" before "if" because we don't want the ship
to move in two directions at the same time.

In case you want the ship to move freely remove the "else" and try to move it.

We are done with movement! In the next tutorial we are going to make our ship fire bullets.
SECOND PART: we are going to enable the ship to shoot.

Previously we made our ship fly; now we are going to make it shoot and set limits to where it can go.

First we need to make our bullets, right click the library tab, select "New Symbol… " and give it the name
"Bullet".

Before clicking OK, click Advanced, select "Export for Actionscript" and make sure the identifier is
"Bullet".

We do this because we need to export the Bullet Movie Clip during running time to create many bullets
and we will use the name determined in identifier to call it later.

Draw a small bullet, and position it like this:

This is called registration point, in the stage this is the position of the Bullet Movie Clip.

Now open the actions window of the first frame of the Movie Clip and paste this code:

this.onEnterFrame = function()
{
this._x += 12;
if (this._x > 550)
{
this.removeMovieClip();
}
}

"this" is the Movie Clip instance, so if we duplicate 100 bullets each bullet will have the same code.

this._x += 12;
Every frame, the bullet will move 12 pixels to the right.

if (this._x > 550)


{
this.removeMovieClip();
}

If the bullet passed the limits of the screen (550px) it's no longer visible, so we remove it by using this
method "removeMovieClip()"

Now go to the main timeline, select the first frame and open the actions windows. You will see the
previous codes that we have written. Add this code to the old one so we can fire our bullets:

var i = 0;
this.onEnterFrame = function()
{
.
.
.
else if (Key.isDown(Key.DOWN))
{
Ship._y += 5;
}
if (Key.isDown(Key.SPACE))
{
i++;
_root.attachMovie("Bullet", "Bullet" + i, _root.getNextHighestDepth());
_root["Bullet" + i]._x = Ship._x + 3;
_root["Bullet" + i]._y = Ship._y;
}
}

THIRD PART: we are going to make enemy ships.


Create a new Movie Clip and draw your enemy ship, don't forget to set the identifier to "Enemy" and
select "Export to Actionscript".

Now drag the enemy Movie Clip to the stage, give it an instance name of "Enemy0", right click it and
select "Actions".Paste this:

onClipEvent(load)
{
function reset()
{
var timer = 12;
this._y = Math.random() * 300
this._x = 550
mySpeed = Math.ceil(Math.random() * 6) + 1;
}
reset();
}

This part of the code creates a function called reset() when the Movie Clip loads for the first time.
Inside reset() we set this._y to a random number between 0 and 300, this._x to 550 and the speed of
our enemy to a random number between 1 and 6.
And paste this:

onClipEvent(enterFrame)
{
//in every frame the enemy move left in the speed defined in the reset function.
this._x -= mySpeed;
if (this._x < -10)
{
//if the enemy is not on the screen, we reset it.
reset();
}
//if our timer is bigger than 12 we get a new
if (timer >= 12)
{
//direction to the Ship.
var dir = Math.ceil(Math.random() * 2)
//We get a random number, 1 or 2. 1 is up, 2 is down.
//Then we set timer to 0, so we only get a new dir when timer is bigger than 12
timer = 0;
}
if (dir == 1)
{
//if dir = 1, we move the ship up.
this._y -= 3;
} else if(dir == 2)
{
//if dir = 2, we move the ship down.
this._y += 3;
}
//increase timer by 1, so the timer gets equal to 12 and we get a new direction.
timer++
}

This is a VERY basic AI that will be improved when we let the enemy know when it killed our ship or if it
was killed by us.

We only have one enemy, so let's make more.

Add this code in the main timeline before the rest of the code.

var nrEnemies = 3;
for (i = 1; i < nrEnemies; i++)
{
_root.Enemy.duplicateMovieClip("Enemy" + i, _root.getNextHighestDepth());
}

The variable nrEnemies represents the number of enemies in the screen at the same time.

for (i = 1; i < nrEnemies; i++)


{
...
}

The "for loop" will run the code inside it depending on nrEnemies.
FOURTH PART: we will add lives, scores and game over to our game.
Let's start with score.

Open the main timeline code and add this variable:

var score = 0;

Now open the Bullet's code and add this:

this.onEnterFrame = function()
{
this._x += 9;
if (this._x > 550)
{
this.removeMovieClip();
}
for (i = 0; i < _root.nrEnemies; i++)
{
if (this.hitTest(_root["Enemy" + i]))
{
_root["Enemy" + i].reset();
_root.score += 10;
this.removeMovieClip();
}
}
}

This is the code we used before to know if a bullet hits an enemy, so we can put the score for killing an
enemy there.

If you want the player to lose points for getting killed, just add "_root.score -= PointsToLose" to the
code that checks if the player was killed.

The score is done; we just need to show the player his score.
To do that, select the Text Tool and draw it on the stage.

Write "Score:"
Now draw another Text box on the stage. Select this new Text box and change these properties:
Run the game and see how it works.

Now let's make our ship have lives. Add another variable in the main code:

var lives = 3;

LAST PART: we are going to add sound and a pause key.

Before we start with sound we need to make some changes. You may have noticed that our ship shoots
bullets as much as the player press the space bar, that's not right as it makes the game much easier.
To prevent that, we are going to add a timer and the ship will shoot as much as WE want.
First add a new variable:

var timer = 8;

Now make these changes:

this.onEnterFrame = function()
{
timer++;
.
.
.
if (Key.isDown(Key.SPACE))
{
i++;
if(timer >= 8)
{
_root.attachMovie("Bullet", "Bullet" + i, _root.getNextHighestDepth());
_root["Bullet" + i]._x = Ship._x + 3;
_root["Bullet" + i]._y = Ship._y;
timer = 0;
}
}
}

The code runs like this:


1. If timer >= 8 then shoot a bullet and set timer to 0
2. Now that timer = 0, the bullet wont shoot, so the player has to wait all the code to run at least 8
timer to shoot again (timer++ will increase timer by 1 every frame)
3. Timer will be bigger than 8 again and the player can shoot.
Before:

After:

We can add the sound now. You need to have an mp3 file that's going to be the sound played when you
fire. You can download one right here. Or simply download the source file that contains sound file.

Now that you have your sound, click File > Import > Import to library...
Select your mp3 file and click open, a new file should appear on the library. Right click it and click
"Linkage..."
Check "Export to Actionscript..." and set the Identifier to "shoot".
This is the same thing we did previously with the Bullet Movie Clip, we need the linkage to call this on
the code.

Add this to the shooting code:

if (Key.isDown(Key.SPACE))
{
i++;
if(timer >= 8)
{
_root.attachMovie("Bullet", "Bullet" + i, _root.getNextHighestDepth());
_root["Bullet" + i]._x = Ship._x + 3;
_root["Bullet" + i]._y = Ship._y;

var shoot_sound = new Sound();


shoot_sound.attachSound("shoot");
shoot_sound.start();

timer = 0;
}
}
The first thing we do is declare a new Sound():

var shoot_sound = new Sound();

Then we attach the sound we have on our library to this variable:

shoot_sound.attachSound("shoot");

And we tell our sound to play using the start() method:

shoot_sound.start();

Run the code (Ctrl + Enter) and see the results.

Now we are going to add a pause to our game.


Add a new variable to know whether we are paused or not:

var gpause = false;

Then make some changes to ALL codes.


Main code:

this.onEnterFrame = function()
{
if (!gpause)
{
//this is the rest of the code we did previously.
}
}

Enemy's code:

onClipEvent(enterFrame)
{
if (!_root.gpause)
{
this._x -= mySpeed;
if (this._x < -10)
{
reset();
}
}
}
Bullet's code:

this.onEnterFrame = function()
{
if (!_root.gpause)
{
//rest of the code we did
}
}

It's pretty simple; if gpause is false the code will run normally, but if gpause is true the code will not
run.

Add another code to the main timeline:

this.onEnterFrame = function()
{
if (!_root.gpause)
{
//rest of the code we did
}

if (Key.isDown(Key.CONTROL))
{
if (gpause)
{
gpause = false;
} else if (!gpause)
{
gpause = true;
}
}
}

If the players press "ctrl" we set gpause to true or false depending on the value of gpause.
This needs to be outside "if (!_root.gpause)" because we need to check if the user pressed the pause
key even if the game is paused.

The game is done! I hope you enjoyed developing it. And see you in the next series!

Potrebbero piacerti anche