Making Your First Maps
NOTE: This tutorial is based on project lime-tutorials.
Being able to make a map in Tiled and load it up in Berry is the most important aspect and luckily it is very simple.
Tiled is completely free and can be downloaded from here. Please note, I am not in any way connected to the developers of Tiled, if you experience a bug with it feel free to email me however don?t be suprised if I simply put you in contact with them.
After downloading the package simply install it like any other program and start it up.
Selecting File >> New >> New Map will bring up the following window:
Leave the Orientation as Orthogonal, while setting the Map Size to Width 40 and Height 25 and the Tile Size to Width 32 and Height 32. Before you create a new map you must ensure your map will be in the correct format, currently Berry supports XML and CSV. Orthogonal maps are the easiest to create and are used for plenty of game types to keep you occupied at present. The Tile Size is measured in pixels while the Map Size is measured in tiles, so we are creating a map that is 1280 wide pixels and 800 pixels high.
After clicking OK you should find your screen now looks something like this:
Tilesets are the building blocks of your map, in Corona they are implemented as sprite sheets. You can have as many tilesets as you like all with different source images. External tilesets are not supported.
To get you started, here is a sample tileset provided by Game Art 2d for use in these tutorials. Simply download it and save it in the root of your games directory.
To add one, simply select Map >> New Tileset to bring up the following window:
Now hit Browse? and select that file. Once selected make sure Tile Width and Tile Height are both 130 (measured in pixels) and both Margin and Spacing is set to 2. Now just hit the OK button.
When you have done this you will notice you have a new tileset located in the bottom right of Tiled.
With your tileset loaded into Tiled your next step is to actually add your tiles, you do this by drawing them in. You have two brush types at your disposal, Stamp and Fill, for now simply leave it on Stamp like in the picture below.
To draw a tile you first have to select it, to do so just tap it in the tileset and then just tap in the dotted grid to draw it. Try creating a map that looks something like this:
Once you are happy with your creation you should go ahead and save it, naturally you should be doing this often as per any computer work.
Map need to be saved in JSON format. For now Berry supports only one type of files.
The actual loading of your map is very simple, first off make sure you have actually placed the Berry folder in your games directory and then include the library as usual:
berry = require( 'pl.ldurniat.berry' )Note: the berry variable should be global as you see here, not local.
Now load up your map data:
local map = berry.loadMap( 'map_name.json', 'path/to/images' )Second argument is optional. After loading up your map you will not have any visual objects created, this allows you to load up multiple maps at once yet only creating the visual data later one at a time, to actually create the visual representation simply use the next line of code:
local visual = berry.createVisual( map )
Please remember to update your orientation settings in your build.settings file as this map has been designed for landscape screens.
Congratulations, you just made your first mobile capable tile map! Does it give you a warm and fuzzy feeling inside? No? Then check out the second tutorial to add a bit more excitement to your map.
Resources: Tiled-map-for-Berry.