Tutorial: Create a Platform Game in AS2 – Part 3
Categories: Flash
Table of Contents
Step 3: Programming the Level
Now that we’ve set up all of the blocks onto the stage, we can actually add some code to them. The first thing we’re going to do is to make it so the blocks are the only thing that the main guy can stand on. Replace this code in the mainJump() function:
//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;
}
with this:
//if main hits a block, then stop jumping
//this loop will check a hit test with any block
for(var cBlock:String in blockHolder){
//cBlock is simply the name of the chosen block
//we can use this to access and do what we want with it
if(mcMain.hitTest(blockHolder[cBlock]) && mcMain._y <= hitBlock._y){
mainOnGround = true;
//stop jumping
mainJumping = false;
//and set the guys coordinates to be on top of the block
mcMain._y = blockHolder[cBlock]._y - mcMain._height;
//break out of the loop to save processor power
break;
}
}
Now, we have to make the character fall when he isn't on a block. First, define a variable, mainOnGround at the top, and set it as a false boolean. Then, set it to true if mcMain hits a block in the mainJump() function. Hopefully, I don't have to walk you through this one. Next, add the following code to the main onEnterFrame() function:
//checking if he isn't on the ground
//run a loop checking if he's touching blocks
for(var cBlock:String in blockHolder){
//checking hit test and if main is above the brick
if(mcMain.hitTest(blockHolder[cBlock]) && mcMain._y < blockHolder[cBlock]._y){
//this time, we just make mainOnGround true
mainOnGround = true;
//and break from the loop
break;
}
mainOnGround = false;
}
//then we make him fall if he isn't on the ground
if(!mainOnGround){
mainJumping = true;
}
The next thing we're going to do is make the guy bounce off of the bricks if he hits them below. Otherwise, he'd somehow get on top of the bricks from below, which we don't want. To do this, we're going to have to change the for loop in the mainJump() function. Here's what you should replace it with:
for(var cBlock:String in blockHolder){
//cBlock is simply the name of the chosen block
//we can use this to access and do what we want with it
if(mcMain.hitTest(blockHolder[cBlock])){
//if main is falling down
if(jumpSpeed > 0){
//stop jumping
mainJumping = false
//and set the guy's coordinates to be on the top of the block
mcMain._y = blockHolder[cBlock]._y - 25;
//he's now on solid ground
mainOnGround = true;
//break out of the loop to save processing power
break;
} else {
jumpSpeed = Math.abs(jumpSpeed);
//making the main guy get away from the block
mcMain._y = blockHolder[cBlock]._y + blockHolder[cBlock]._height + 1;
}
}
}
Now, if you test it out, the guy bounces when hitting the block. Now, the last thing we're going to do is make the background move with the character if he moves too far to the left or right. In order to do this, I'm going to change around lvlArray1 so the changes are more necessary. Here's what I'll change it to:
var lvlArray1:Array = new Array(
0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,
0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,
0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,
0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,
0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,1,1,1,1,1,
0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,
0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,1,1,1,1,1,0,0,0,0,0,
0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,1,1,1,1,1,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,
0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,
0,0,0,0,0,0,0,0,0,0,0,0,0,1,1,1,1,1,0,0,0,0,0,0,0,1,1,1,1,1,0,0,0,0,0,0,0,0,0,0,0,0,0,0,
0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,
0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,
0,0,0,0,0,0,1,1,1,1,1,1,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,1,1,1,1,1,0,0,0,0,0,0,0,0,0,0,
0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,
0,0,X,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,
0,0,1,1,1,1,1,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0
);
Now, we have to edit the createLvl function first it centers the main character and actually makes this code go to work. Replace the current function with this code:
function createLvl():Void{
//finding the array of the current level we're on
//this is just a way to dynamically select an Array within the document
var lvlArray:Array = _root['lvlArray'+lvlCurrent];
//we have to find how far this level will span
//this will be used so we know when to move to the next row
//there will always be 16 rows, so this is how we find it out
//of course, this will make the level formatting very strict
var lvlColumns:Number = Math.ceil(lvlArray.length/16);
//now we can create the level
for(var i:Number=0;i
This code makes me very happy. The screen will now center on the main character in every level, no matter where you place him. Next, we want the actual background to move instead of the character when he moves so we can keep track of him at all times. This'll be easy. In the main onEnterFrame() function, replace:
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
}
with:
if(Key.isDown(37) || Key.isDown(65)){ //if the "A" key or Left Arrow Key is Down
blockHolder._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
blockHolder._x -= mainSpeed; //then move the guy to the right
}
Pretty easy, eh? Now there's only one problem I want to fix before I end this lesson. The character doesn't really jump high enough. So, we're just going to recode this part a bit:
//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;
Replace it with this:
//if we're already jumping, then continue to do so
if(jumpSpeed < 0){
jumpSpeed *= 1 - jumpSpeedLimit/125;
if(jumpSpeed > -jumpSpeedLimit*.2){
jumpSpeed *= -1;
}
}
if(jumpSpeed > 0 && jumpSpeed <= jumpSpeedLimit){
jumpSpeed *= 1 + jumpSpeedLimit/50;
}
mcMain._y += jumpSpeed;
Also, change the jumpSpeedLimit to 20, eh?
Now, we're done with the intense block programming. Next lesson, we'll add some stuff to the level, like ladders and other obstacles. We also have to make it so that when we run into a wall, we're stopped by it. Stay tuned...
Final Product
“Now, we have to make the character fall when he isn’t on a block. First, define a variable, mainOnGround at the top, and set it as a false boolean. Then, set it to true if mcMain hits a block in the mainJump() function. Hopefully, I don’t have to walk you through this one. Next, add the following code to the main onEnterFrame() function:”
yeah well guess whut…. that sets me way off…. i set up a variable and it still lets my guy float around….
and then when i decide to skip it to find it out later i go to the next thing which screws things over even more…
February 3rd, 2009 at 4:29 am
uhh i have this same problem if you could say it in steps how to do it
March 31st, 2009 at 7:23 am
i have the same, when i aim left or right from block, it doesnt fall at all.
but if i change mainJumping to true, it falls but cant jump again. Whats the problem?
April 8th, 2009 at 1:29 pm
I’ve got the same problem aswell.
April 17th, 2009 at 2:40 pm
I’ve got the same problem!
May 6th, 2009 at 2:49 am
i also have this issue. what is going wrong?
May 11th, 2009 at 11:31 am
“i have the same, when i aim left or right from block, it doesnt fall at all.
but if i change mainJumping to true, it falls but cant jump again. Whats the problem?”
Yep, I have that too.
Would be great if you could find a solution for that 🙂
May 15th, 2009 at 6:23 pm
Make sure the size of your main char and the blocks are the same 😉
Both in the code and on the screen.
When I fixed this everything was working for me again
May 15th, 2009 at 6:30 pm
can someone show me the code for \\\Now, we have to make the character fall when he isn’t on a block. First, define a variable, mainOnGround at the top, and set it as a false boolean. Then, set it to true if mcMain hits a block in the mainJump() function. Hopefully, I don’t have to walk you through this one. Next, add the following code to the main onEnterFrame() function:/// its so confusing!
June 14th, 2009 at 1:49 am
ive got it all going up to now thanks
July 31st, 2009 at 4:25 am
HOW DO YOU DEFINE A VARIABLE?!?!
September 27th, 2009 at 12:50 am
Look at my comment in the last part to check if my comment can solve your problems 🙂
October 1st, 2009 at 3:45 pm
I have the problem the same as the rest of you. I’m not sure exactly where to put it. It just says add the code to the onEnterFrame ()function. I also am not sure what the variable we’re supposed to put right before that either. I put it in false and true and it doesn’t effect anything either way.
November 25th, 2009 at 10:54 pm
omg I got up to here and it all works but when you said now, we have to define a variable mainOnGround at the top, I got lost cause I don’t know how to do that
May 1st, 2010 at 3:02 am