Tutorial: Create a Platform Game in AS2


Written By MrSun at 8:00 am - Saturday, January 03rd, 2009
Categories: Advanced Tutorials, All Tutorials, AS2, Flash, Game Development

Due to popular request, I’ve decided to make an AS2 version of my tutorial. For consistency, it will follow the same format as the AS3 version and will also use excerpts of the same text. Here we go.

Step 1: Basic Character Programming

Let’s first begin with the basic setup of our game. I’m going to make the background black and the frame rate 24 fps (like in previous tutorials). The first thing to make is our little character. I won’t be too artistic with this one, just a little white circle without any outline.
My character guy
Its dimensions are 25×25 pixels.

Next, convert it into a MovieClip and give it an instance name of mcMain. Now, we can add code to move this character.

Just create a new “actions” layer and place this code in the first frame (DON’T ADD IT TO THE MOVIECLIP):

var mainSpeed:Number = 7; //The speed of the character
onEnterFrame = function(){ //this function will run every frame (needed for moving the character
	if(Key.isDown(37) || Key.isDown(65)){ //if the "A" key or Left Arrow Key is Down
		mcMain._x -= mainSpeed;//then the move the guy left
	} else if(Key.isDown(39) || Key.isDown(68)){//if the "D" key or Right Arrow Key is Down
		mcMain._x += mainSpeed; //then move the guy to the right
	}
}

This code will simply make the character move left and right. Now, we have to make the character jump. We’ll accomplish this with a jump function and running it whenever the up key is down. First, we have to define a few variables at the top of the code:

//JUMPING VARIABLES
//whether or not the main guy is jumping
var mainJumping:Boolean = false;
//how quickly should the jump start off
var jumpSpeedLimit:Number = 15;
//the current speed of the jump;
var jumpSpeed:Number = jumpSpeedLimit;

Then, we’ll define a function which will make the guy jump. It’ll take some moderately complicated math. Add this code to the bottom of your code:

//THE JUMPING FUNCTION
function mainJump():Void{
	//if main isn't already jumping
	if(!mainJumping){
		if(Key.isDown(38) || Key.isDown(87)){
			//then start jumping
			mainJumping = true;
			jumpSpeed = jumpSpeedLimit*-1;
			mcMain._y += jumpSpeed;
		}
	} else {
		//if we're already jumping, then continue to do so
		if(jumpSpeed < 0){
			jumpSpeed *= 1 - jumpSpeedLimit/75;
			if(jumpSpeed > -jumpSpeedLimit*.2){
				jumpSpeed *= -1;
			}
		}
		if(jumpSpeed > 0 && jumpSpeed <= jumpSpeedLimit){
			jumpSpeed *= 1 + jumpSpeedLimit/50;
		}
		mcMain._y += jumpSpeed;
		//if main hits the floor, then stop jumping
		//we'll have to change this however when we create the blocks in the level
		if(mcMain._y >= Stage.height - mcMain._height){
			mainJumping = false;
			mcMain._y = Stage.height - mcMain._height;
		}
	}
}

Pretty intense, eh? The last thing we need to do in order to make the jumping work is to add the mainJump() function to the enterFrame. This is would we should change it to:

onEnterFrame = function(){ //this function will run every frame (needed for moving the character
	if(Key.isDown(37) || Key.isDown(65)){ //if the "A" key or Left Arrow Key is Down
		mcMain._x -= mainSpeed;//then the move the guy left
	} else if(Key.isDown(39) || Key.isDown(68)){//if the "D" key or Right Arrow Key is Down
		mcMain._x += mainSpeed; //then move the guy to the right
	}
	mainJump();
}

Congratulations! We’ve just made the character move and jump! Next time, we’ll create a level with blocks we can walk on!

Final Product

Source .fla File

22 Comments

mike:

This tutorial is quite helpful but lets say i would like to make a character accually walk, and jump as opposed to simply move. I would assume i would involve making a movie clip for walking and jumping followed by using action script to swap them in for the standing frame once a button is pressed.
The thing is i have no idea how to do what i just said above or if it was a correct assumption in the first place.
Also i was wondering if the same concept would apply to enimmies and world objects such as the bumpers.


larry:

newbie here but i copied the script in per word except but it gives me on/onClipEvent error on a few lines of code. how do i Implement this correctly?


Alex:

Not nay saying or anything, but surely for the jump scripting, couldn’t you just use this?

var yspeed = 1;
var gravity = 1;
var jump = -8;
onEnterFrame = function () {
mcMain._y += yspeed;
yspeed += gravity;
if(mcMain.hitTest(ground)){
if(Key.isDown(Key.UP)){
yspeed = jump;
} else {
yspeed = 0;
}
}
}


eriq xpyonedge:

hi, i have try making this game and its work. But then, i have a problem to change the keys. Can u give me the coding for change the directional keys to a,s,d,f keys…im still new new in as2~


carl:

how do i change the hight of the jump?


Anonymous:

i have written this for an hour and then nothing happened doesn’t work for me i guess


-.-:

the jump script doesnt work, my char moves but doesnt jump


noname:

do you have to write this out or could you copy and paste??


Paul:

Just experimenting with the code found here (Great tutorial by the way! thanks) and found this reallllly weird bug within an IF statement:

lvlHolder._x += mainSpeed;
lvlHolder._x += mainSpeed;
bgHolder._x -= .8 * mainSpeed;
bgHolder_Far._x -= .3 * mainSpeed;

…and pasting it here just revealed it to me. The first line was throwing a syntax error but appeared exactly the same as the next line, the whitespace before the “._x” isnt shown on my GUI!!! Pressing delete removed this invisible character, now fixed. Weird! Anyway, posting this comment incase others find the same bug.

Again… great tutorial!


:(:

None of it is working for me. I think flash hates me.


Chase:

I’ve been scouring (I don’t care if its mispelled) the nets for how to make a movieclip appear to be “running” while moving with the key function. I’ve accomplished the task of moving a figure, but I want it to look idle when idle and look like its running when its moving.

Please Help!!! [And rofl on the McCain part!]


qaiex:

I always have trubble with the “Void” whatever that is. im getting alot of error two :/ it never works


Dude:

the same thing happend to me at first but i knew how to fix it up.
you have to copy the last code instead of the on before it; so the final shape of the code should look like this:

var mainSpeed:Number = 7;
onEnterFrame = function(){ //this function will run every frame (needed for moving the character
if(Key.isDown(37) || Key.isDown(65)){ //if the “A” key or Left Arrow Key is Down
mcMain._x -= mainSpeed;//then the move the guy left
} else if(Key.isDown(39) || Key.isDown(68)){//if the “D” key or Right Arrow Key is Down
mcMain._x += mainSpeed; //then move the guy to the right
}
mainJump();
}
//JUMPING VARIABLES
//whether or not the main guy is jumping
var mainJumping:Boolean = false;
//how quickly should the jump start off
var jumpSpeedLimit:Number = 15;
//the current speed of the jump;
var jumpSpeed:Number = jumpSpeedLimit;
//THE JUMPING FUNCTION
function mainJump():Void{
//if main isn’t already jumping
if(!mainJumping){
if(Key.isDown(38) || Key.isDown(87)){
//then start jumping
mainJumping = true;
jumpSpeed = jumpSpeedLimit*-1;
mcMain._y += jumpSpeed;
}
} else {
//if we’re already jumping, then continue to do so
if(jumpSpeed -jumpSpeedLimit*.2){
jumpSpeed *= -1;
}
}
if(jumpSpeed > 0 && jumpSpeed = Stage.height – mcMain._height){
mainJumping = false;
mcMain._y = Stage.height – mcMain._height;
}
}
}


Dude:

and for you eric you can always use “for examble” :
if (Key.isDown(Key.LEFT)){ ….

or you can visit this website to view Key code values :
http://livedocs.adobe.com/flash/9.0/main/wwhelp/wwhimpl/common/html/wwhelp.htm?context=LiveDocs_Parts&file=00001136.html

((NOT ADVERTISING))

i am a newbie my self but i always use google and Flash Help topics to find answers !!
hehe


...:

Dude – the code that you left still does not work – (sorry if this is retarded, im a newbie)


ani:

Hi. Is it possible to add ur own images instead of creating circles? I ┬┤would like to have my own enemies and hero.


S:

I used the jump function and the caracter jumped but it didnt fall down again can someone help


DEI:

Very helpful. This is the smoothest jump tutorial I’ve seen. Thanks a lot!

I made a couple changes in order to give the character a higher jump.
In this line:
jumpSpeed *= 1 – jumpSpeedLimit/75;
I changed the 70 to 150, and in this line:
jumpSpeed *= 1 + jumpSpeedLimit/50;
I changed the 50 to 100.

Perhaps you could make it more clear to people how easy it is to adjust the character jump height?


Brandon:

I added both scripts in the same Action Frame, the second group of script blocks the first group of script. Like: if I put the script for moving left and right first, then below that i put the script for jumping, when i preview the game, the character only jumps. When I put the Jump script first and the movement script second, i can move left and right but not jump. What am I doing wrong?


DarkIce:

:( plz help. i have spent forever trying to make a platform game with lots of different tutorials and every time i try when i come to play it for test it my character doesnt move. :( help plz.


Carson:

i cant even get my character to walk >=(


«
»