How to Create a Platform Game in AS3 – Part 2
Part 2: Creating the Level
Now, we have to set up blocks on stage that will account for a level. We’ll use an array to accomplish this manly feat. We’re also going to create some other level variables. Place this code at the top:
//LEVEL VARIABLES //the current lvl var lvlCurrent:int = 1; /*The key for the level arrays: 1: Regular Block X: Main Character */ //this variable will hold the character var X:String = 'MAIN'; //the array for level 1 var lvlArray1:Array = new Array( 1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,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,1, 1,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,1, 1,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,1, 1,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,1, 1,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,1, 1,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,1, 1,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,1, 1,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,1, 1,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,1, 1,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,1, 1,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,1, 1,0,0,0,0,0,0,1,1,1,1,0,0,0,0,0,0,0,0,0,0,1, 1,0,0,0,X,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,1, 1,0,0,1,1,1,1,0,0,0,0,0,0,0,0,0,0,0,0,0,0,1, 1,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,1 );
This is a pretty big array, but it won’t be too hard to understand, I hope. The next thing we have to do is to actually make a function which creates the level. We’ll make some more variables for this as well:
//current row that we are creating var row:int = 0;
Now, we have to create a class that will have all of the code for the blocks. Create a new external ActionScript file called “Block.as”. Then, place the following code into it:
package{ import flash.display.Sprite; import flash.display.MovieClip; import flash.events.*; //sprites are just movieclips without any frames in them public class Block extends Sprite{ //_root will signify the root of the document private var _root:Object; public function Block(){ //this code will only be run once addEventListener(Event.ADDED, beginClass); //this code will constantly be run addEventListener(Event.ENTER_FRAME, eFrame); } private function beginClass(event:Event):void{ //defining the root of the document _root = MovieClip(root); } private function eFrame(event:Event):void{ } } }
We’ll add on to this later but for now, we have to define the function that will place these bricks on stage. Place the following code at the end of the frame:
//creating the level //this guy will hold all of the blocks var blockHolder:Sprite = new Sprite(); //then we add him to stage addChild(blockHolder); function createLvl():void{ //getting the current level that we are on var lvlArray:Array = MovieClip(root)['lvlArray'+lvlCurrent]; //we have to find how far this level goes //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 lvl formatting very strict var lvlColumns:int = Math.ceil(lvlArray.length/16); //now we must create the level for(var i:int = 0;i<lvlArray.length;i++){ if(lvlArray[i] == 1){ //checking if we move onto the next row //this checks if i is divisible by the # of columns if(i/lvlColumns == int(i/lvlColumns)){ row ++; } //making a new block var newBlock:Block = new Block(); //drawing the block newBlock.graphics.beginFill(0xFFFFFF/*The color for shape*/,1/*The alpha for the shape*/); //turning the shape into a square newBlock.graphics.drawRect(0,0,25,25); //change the coordinates of the block newBlock.x = (i-(row-1)*lvlColumns)*newBlock.width; newBlock.y = (row-1)*newBlock.height; //then finally adding it to stage blockHolder.addChild(newBlock); } else if (lvlArray[i] == 'MAIN'){ mcMain.x = (i-(row-1)*lvlColumns)*newBlock.width; mcMain.y = (row-1)*newBlock.height; } } //reset the row for another use row = 0; } //running the createlvl funciton createLvl();
This is some pretty intense code. Look it over for a bit and try to comprehend it. This type of code is what you need to make if you want to become a better developer.
This concludes this part of the tutorial. Next time, we’ll add some code to these blocks and make them interact with the character. Stay tuned…