Game Development Reference
In-Depth Information
It is very important that the first tile be a road or wall tile, not a sprite tile if you are using Mappy to
create levels. We are going to be creating levels with two layers. The background layer will
contain wall and road tiles while the foreground layer will only contain only our game sprites. The
foreground will overlay on top of the background layer. All of the tiles on the foreground that do
not contain a sprite will be blank and will be exported from Mappy with the tile
id
of 0. When our
code parses the data for sprite placement, it will ignore any tile with an
id
of 0. If we have placed
a sprite at tile 0 on our tile sheet then it will never be placed into game. So, we have placed the
nonsprite road tile in the tile 0 spot. This concept will become clearer as we progress to the
section on Mappy.
6.
You will need to delete out the background color for the unused pixels behind the tiles to
have transparency around your sprite objects. The best method to accomplish this is to
use the erase tool in the 1
1 pixel configuration. Zoom in to 800% (or 8 to 1) and erase
just the dark pixels around the images. You will start to see the transparent background
show up where the deleted pixels once were. Other tools, such as the Fuzzy Select tool
can also be used for this purpose and may speed the process up immensely. The Magic
Wand tool in both Fireworks and Photoshop is also very much up to this task.
7.
Save this file as a PNG named
tank_sheet.png
. Make sure to check Merge Visible Layers
and not Flatten Image in the export dialog. Flatten will give the image a white
background, and Merge will keep the transparent background. The option you want to
use in Photoshop is Save For Web, while in Fireworks you can easily select Save As and
select the png option.
Creating a game level with Mappy
One of the most useful weapons in the arsenal of any game developer is a good map editor. We
like to rely on a great map editor called Mappy. The basic version of Mappy is free, but we highly
suggest spending the $19.00 it costs to register the full version.
Details on Mappy can be found at the Mappy web site (
http://www.tilemap.co.uk/
). Complete
instruction on all the features and nuances of Mappy is well beyond the scope of this topic. We
will go into enough detail so you will be able to use this as a starting point for you own projects
though. We will cover the very basic steps that anyone can use to create a level map with Mappy.
We are going to use the
tank_sheet.png
tile sheet we created in the previous section. The latest
version of Mappy needs an extra DLL to use PNG files properly. So you should take careful note
that there is a ZIP file of DLLs that will need to be downloaded and copied to the Mappy folder.
Once you have downloaded, unzipped, and placed the Mappy files in a folder (there is no official
install program), you will need to unzip the
libpng12.zip
file (which can be obtained at
http://www.tilemap.co.uk/pngfiles.html
) to use PNG files with the program.
Now, let's create our level tile map:
1.
Open Mappy.
2.
In the File menu, select New Map and set the tile size to 32
32 and the map size to 20
15. The No Tanks! levels will fit in a 640
480 screen, or 32
20 width times 32
15
height.
