|
The following video walks you through simple level editing
Dim lights
Embed Embed this video on your site
Transcript for low-bandwidth users:
Hi, my name is Clint.
Today I will be walking you through an introduction on how to edit a level for the Platformer Starter Kit.
When you first run the Platformer Starter Kit demo game, you will notice that one of the levels off of the menu is a fairly blank and uninteresting level. This is meant to be a starting place for creating your own levels, so let's walk through how to do that.
To begin, go ahead and open up Tiled.
Tiled is a popular open-source map editor that we use to help us create and edit levels. It exports levels in an XML format that the Platformer Starter Kit reads quite nicely.
There are two versions of Tiled -- one is done with QT, and the other is done in Java. Both versions work very well, I've happily used both of them, and they each will run on Windows Mac and Linux. For this lesson I will be using the newer QT version, but pretty much all of what I have to say will apply to the older and more stable Java version as well.
So to begin, go to File -> Open, and navigate to the Platformer Demo folder. In there, go to assets, then tilemaps. There are a bunch of levels in this folder for you to browse and learn from, but for now let's open up starter_map_1.tmx. This is the nearly empty starter level that you saw earlier -- if you scroll down, you can see the content of the level.
If you look over on the right side in the layer tab, there are three layers. You can have as many layers as you want, but all of the example game stuff uses three layers. Unless you have a specific need for more layers, I recommend that you stick with this format to begin with.
There is a tile layer called "bg" that is the background layer, and a tile layer called "fg" that is the foreground layer. Everything in the background layer displays behind the player, and everything in the foreground layer displays in front of the player, so that the player will appear to walk behind whatever is in this layer.
There is a third layer called "objects" which we won't be explaining in this tutorial, but suffice it to say that the objects layer defines everything that we can interact with in a level. They're used to do special things, but for basic level creation of adding platforms and whatnot, it's not necessary to change this object layer.
There are two tools that I'm going to teach you about. The first is the "drawing" or "rubber stamp" tool. This lets you draw tiles in the world. To use it, first make sure that it's selected in the toolbar, then select the layer that you want to draw on. You can organize your levels however you want, but in this example we're going to put our basic structural elements on the background layer, and use the foreground for more decorative elements.
Now that we've selected the tool, and selected our layer, now select the tiles that you want to draw with. Click on a single tile, then click on the map to place that tile. One great thing about the Rubber Stamp tool is that you don't have to just place a single tile though -- you can also place a whole group of tiles. In the tileset, click and drag in the upper left corner to grab this block of six ground tiles. Now you can paint with this like a large brush in the world.
You don't have to get these large brushes just from the tileset though -- you can copy from the tiles that you've already placed. From this large tower, use the right mouse button to right-click and drag and select the right edge of this tower. Now use this larger section to extend the tower out to the right to make a larger hill.
Next I'm going to teach you how to make a tunnel through this hill using the eraser tool. Click on the eraser tool in the toolbar, then make a tunnel through the bottom of the hill.
Now let's experiment with the foreground layer. As said before, the foreground layer is used to place stuff for the player to walk behind. In the top center of the tile set, select this green decorative hill. Place a copy of it on the background layer, then in the layers tab, select the foreground layer. Place another copy of this hill here, slightly offset, so that the player will look like he is walking between them.
Alright, now that we've done this, go ahead and save your level. Then go back to Flash Builder. Because the level is an embedded asset, Flash might not have recognized that you changed it, so make sure to rebuild the game from the Project menu.
Go back to our level, and you can see the changes that you made in action.
Thanks for watching this tutorial, and we hope you have fun making levels!
|
