I hope AS: Main tutorials are still running. I haven't been on here for a while. If not, oh well. Enjoy anyway.
I got bored and was thinking about top-view games like the old Zelda and Pokemon games. I thought there must be some way to load the maps from another source and dynamically, rather than building the huge map inside the Flash itself. That would make it huge, laggy and ugly. No, there has to be a cleaner way to doing this. Turns out there is, and it's actually pretty simple.
I made an example map. The engine holds all of the map tiles, which I have taken from Pokemon as an example. Each block is 16x16 pixels. There is no map data inside the engine, only one tile in the library; nothing is arranged. The data is loaded via text file.
Here is the engine.
The map file to load is http://www.64upload.com/files/436_map.tx t.
The secret lies within array slicing. I'm sure I'm not the first one to do this, but I did start this from scratch. Here's now it works. The text file is loaded with a bunch of 5-segment strings, separated by a semi-colon.
For example, three tiles of map data might be as so:
1,1,1,0,0;
2,1,0,0,1;
2,1,0,1,1
The engine separates each of those three segments, and then further slices it grabbing the five values inside each. The values mean Frame of tile, Sub-frame of tile, Blocks the player, _x tile position, _y tile position. With those values, you could specify the first frame of your tile movieclip to grass, and then the second frame of that grass child movieclip to be, I don't know, a darker shade of grass perhaps. The third value controls whether or not the player would be able to walk onto that time, or be blocked by it. The fourth and fifth control the physical position. Not to be confused with literal _x and _y positions, instead they are essentially _x and _y positions multiplied by the width of the tile (in my case, 16 pixels).
To be able to grab the data from the map text file, you need to load it into Flash. These are the actions on the frame before loading the map:
var map = new LoadVars();
map.onData = function(raw) {
lvl = raw;
nextFrame(); //Go to the actual level frame.
};
function findVars() {
map.load(lvlLoad.text); //Grabs the URL specified in the text box.
}
Clicking a button activates the findVars function. The second frame gets a bit more complicated.
function loadlevel(script) {
compSplits = script.split(";"); //Splits the 5-piece segments into an array.
numSquares = compSplits.length; //Uses an array function to find the number of squares to be created.
for (i=0; i<numSquares; i++) { //This for loop repeats for every tile.
attachMovie("land","square"+i,i); //Attaches the tile movieclip from the library onto the stage.
attrTemp = compSplits[i].split(","); //Splits the 5 components apart.
_root["square"+i].gotoAndStop(attrTemp[0 ]); //Takes the main tile frame to the specified value from the txt.
_root["square"+i].innerMc.gotoAndStop(at trTemp[1]); //Applied the sub-frame inside the main tile frame.
_root["square"+i].hit = attrTemp[2]; //Toggles clipping.
_root["square"+i]._x = (attrTemp[3]*_root["square"+i]._width); //X position
_root["square"+i]._y = (attrTemp[4]*_root["square"+i]._height); //Y position
}
}
loadlevel(lvl); //Calls the load level function with the file loaded in the previous frame.
I'm not teaching how to create a full game engine, just the mapping section. The upside to this system is that it cuts down on file size, there seems to be no lag whatsoever and one other important quality. Since it's dynamic and pretty easy to control, anyone could create their own custom maps and share them among one another. Many games I've played apply the same principle.
I hope you've learned something from this. It's not a free script I'm giving you, rather a way to apply something like array slicing to map building. Also, if you use my code for reference, keep in mind the word wrap on the forums may alter the formatting of the code.
