Blog

17
Feb
Spaceship Tutorial Part 1: Moving it
Tutorials

So you would like to know how to make a game? Well, I can teach you but not in one sitting, that’s why this is part 1 of the Spaceship Tutorial.

Spaceship

Once you’re finished with these tutorials you’re gonna have a full Flash game (ActionScript 2.0, I’m old fashioned :P ), but there’s a lot to be learned so let’s get started!

Step 1. Preparation

First create a new document (CTRL + N, select Flash Document) and change the frame rate to 45 in the properties pane, this will make sure the game will run nice and smooth.

Step 2. Drawing the ship

First things first we’re going to need the spaceship to move, draw one yourself or use mine (download below).

Ship (drawn)

Once you’ve drawn your spaceship, select it and hit F8. In the new window tick MovieClip and press OK. Now your ship is a MovieClip, what that means is that it’s going to be interactive or animated.

MovieClip

Select the MovieClip and hit F9, that’s going to open the code screen where you can punch in some code that the spaceship is gonna execute.

Step 3. Making it move

Enter this code in the code window:

1
2
3
4
5
6
7
onClipEvent(enterFrame){
	if(Key.isDown(Key.LEFT)){
		_x -= 6;
	}else if(Key.isDown(Key.RIGHT)){
		_x += 6;
	}
}

Now the explanation of the code:

onClipEvent(enterFrame){

This line tells the code that the following actions have to constantly be executed.

if(Key.isDown(Key.LEFT)){

Now it checks if the left arrow key is held down, if so, then it executes the following line:

_x -= 6;

This tells the spaceship to subtract 6 pixels from it’s X axis.

}else if(Key.isDown(Key.RIGHT)){

This makes sure the left arrow key isn’t held and checks if the right arrow key is held, if so, it executes the next line:

_x += 6;

This adds 6 pixels to the X axis of the spaceship. And last but not least we close all open tags:

}
}

Step 4. Testing and finishing

Press CTRL + ENTER to test your game, now you should be able to move the spaceship left and right with the corrosponding keys! :) If you had problems feel free to ask questions below, if you want a sample download the source file here:

Source
Source

Next up we’re gonna make the spaceship shoot some lasers! Click here to read part 2!

Replies

B4rtj4h says: (reply)

Very Cool :D !
Kenney is the best

Anonymous says: (reply)

Awesome ur great!!

Jc says: (reply)

We need Part 2 :D

Kenney says: (reply)

Working on it! :)

send me some of your samples on my email
panglaoa@yahoo.com
ThANk YoU

dedi says: (reply)

great.. but how my plane did not come out the stage?
please help me.

Tileon says: (reply)

Thanks, this was perfect.

Tileon says: (reply)

Thanks this is perfect for starting out.

Serkan says: (reply)

How do you get a flash document? Thanks if you reply

John says: (reply)

I got this message;

1087: Syntax error: extra characters found after end of program.

What am I doing wrong?

thanks

Kenney says: (reply)

@Serkan
How do you get a Flash document? Well you create a new one by pressing CTRL + N if you’re on Windows.

@John
That actually looks like an ActionScript 3 error, make sure you’re coding in ActionScript 2.

adam says: (reply)

i went to ActionScript 2 but i got 1087: syntax error: extra charactars found after end of program on onClipEvent(enterFrame){

Kenney says: (reply)

@adam
That is absolutely an ActionScript 3 error, make sure your project gets published in ActionScript 2 format (it’s under publish settings).

sophie says: (reply)

when i tried to render my ship to test my game it said that it was only permitted for movie clip instances, but i made my ship a variable

Hi says: (reply)

This is great, because of your reasoning for each line, I worked out to make the ship go up and down too.

Kenney says: (reply)

Yeah, some tutorial just throw a block at code at you and are like “figure it out yourself”. I hate that.

gerald says: (reply)

wow!! I never thought the capabilities of this software.
thanks for the tutorial anyway.

shishir says: (reply)

onClipEvent(enterFrame){
if(Key.isDown(Key.LEFT)){
_x -= 6;
}else if(Key.isDown(Key.RIGHT)){
_x += 6;
}
if(Key.isDown(Key.UP)){
_y -= 6;
}else if(Key.isDown(Key.DOWN)){
_y += 6;
}
}

//this is the entire code to move the space ship in ne direction.

shishir says: (reply)

onClipEvent(enterFrame){
if(Key.isDown(Key.LEFT)){
_x -= 6;
}else if(Key.isDown(Key.RIGHT)){
_x += 6;
}
if(Key.isDown(Key.UP)){
_y -= 6;
}else if(Key.isDown(Key.DOWN)){
_y += 6;
}
}

//this is the code to move the space craft in ne direcction

gerald says: (reply)

does macromedia flash 8 has a actionscript 2 on it

Kenney says: (reply)

Yes, Macromedia Flash 8 uses ActionScript 2.

Kasey says: (reply)

Great tutorials how do you make it so the ship can’t go over the side. Cheers

ZedMaster says: (reply)

Im a visual lerner and i didnt understand any of this =( i need a video

Shahroz says: (reply)

does flash mx have actionscript 2 ??

    Kenney says: (reply)

    Yes, Flash MX supports ActionScript 2.

Chobit says: (reply)

Hey. I am following your tutorial and I have a question that doesn’t really concern your tutorial, but I think you know how to fix it, so here it goes: When I open my script window (f9) the background is all black. Therefore I cannot see what I write into the script. Do you know how to make the background white?

Kenney says: (reply)

Yep, you have to go to the Flash preferences and change the colors of the code window.

Chobit says: (reply)

Thanks alot Kenney

Curious says: (reply)

Hey!
I have a problem, I have added a menu-frame with levels which pops up when you die. So when you press the menu-bottom you get to a frame where I have 3 different levels; easy, normal and hard. The only differences between the levels is that the spawn-rate of the enemies is different, and to make this I have made 3 different files, 1 for each level.
My buttons are supposed to link to the other files where my other levels are.

The problem is that when I choose one of the levels, the enemies spawns twice as fast, and when I get back to the menu again after another death, and I choose another level, the enemies spawn 3 times as fast as it should do. It’s like the spawning refuses to reset, even though I have “clearInterval(enemy_interval);” on the menu-frame.

I would be very thankfull if someone could help me!

Kenney says: (reply)

clearInterval(“enemy_interval”);, remember to put quotes if you want to address names of things, like intervals.

Daithi says: (reply)

Hello,

Any chance of you doing a tutorial on drawing objects (spaceships, enemies etc)? Your tutorial is good, I like the way you’ve explainted each step.

Anonymous says: (reply)

I tried downloading your spaceship and for some reason it says unexpected file format?? and wont open

Kenney says: (reply)

I use Flash 8 so you must have a Flash version older than 8 which is crazy, update your Flash.

Kevin says: (reply)

Good tutorial so far. I’m mainly just trying to relearn everything I used to know, so it’s not hard to understand at all, but the only question I have is this: How do you get the ship to not go over the edge of the screen? I have an idea on how to do it, but the codes I’ve tried don’t respond, or result in an error message when I test it (no surprise there). How would I get it to work?

Ben says: (reply)

Did you use Illustrator to create the ship/other graphics?

Kenney says: (reply)

Nope, everything is made in Flash.

I didnt use that program before.

Muhammed Arshid says: (reply)

Thanks sior;

vlad says: (reply)

i keep gettin this message when i run the movie

**Error** Symbol=PlayerShip, layer=Layer 3, frame=1:Line 1: Clip events are permitted only for movie clip instances
onClipEvent(enterFrame){

Total ActionScript Errors: 1 Reported Errors: 1

why do i get this?

Kenney says: (reply)

You either didn’t select to start an ActionScript 2.0 project or you placed code at the wrong place.

vlad says: (reply)

how is the correct place to place action i put action on seperate layer above the ship layer in the movie clip symbol and ty for quick response

Kenney says: (reply)

You have to place the code ON the ship, so not ‘inside’ the ship. Click once on the ship, so it’s selected and then press F9 to add code to the ship.

In Flash (ActionScript 2.0 only) you can place code on frames and on buttons and MovieClips.

Monteiro says: (reply)

Is there a way to see the Axis on flash?

Kenney says: (reply)

I don’t know if that’s possible but there’s just 2 axis, X and Y. It isn’t hard :)

Monteiro says: (reply)

i know that ;D i just needed to see the coordinates of the x and y axis

DannyPG says: (reply)

Hey , I’m just learning to code in actionscript 3.0 and I am experimenting with how to use my skills for game design. Is it likely that you will do any tutorials on game design in 3.0? Or do you not know it? Thanks

    Kenney says: (reply)

    I know how to code in ActionScript 3.0 but I don’t feel I’m good enough to start teaching about it. I also tend to use old techniques which is generally a bad thing to teach.

    So sorry, no AS3 here :(



Leave a Reply