A Tile Source can be used by a Tilemap component to paint tiles onto a grid area or it can be used as the graphics source for a Sprite or Particle Effect component. You can also use the Collision Shapes from the tile source in a Tilemap for collision detection and physics simulation.
You need an image containing all the tiles. Each tile must have the exact same dimensions and be placed in a grid. Defold supports spacing between the tiles and a margin around each tile.
Once you have the source image created, you can create a Tile Source:
To define an animation in a tile source the animation frame tiles must lie next to each other in a sequence left to right. The sequence can wrap from one row to the next. All newly created tile sources have a default animation named “anim”. You can add new animations by right clicking the tile source root in the Outline and selecting Add ▸ Animation.
Selecting an animation displays the animation Properties.
The identity of the animation. Must be unique for the tile source.
The first tile of the animation. Numbering starts at 1 in the top left corner and goes to the right, line by line down to the bottom right corner.
The last tile of the animation.
Specifies how the animation should play:
Nonedoes not play back at all, the first image is displayed.
Once Forwardplays the animation one time from the first to the last image.
Once Backwardplays the animation one time from the last to the first image.
Once Ping Pongplays the animation one time from the first to the last image and then back to the first image.
Loop Forwardplays the animation repeatedly from the first to the last image.
Loop Backwardplays the animation repeatedly from the last to the first image.
Loop Ping Pongplays the animation repeatedly from the first to the last image and then back to the first image.
The playback speed of the animation, expressed in frames per second (FPS).
Flips the animation horizontally.
Flips the animation vertically.
Defold uses an image specified in the Collision property to generate a convex shape for each tile. The shape will outline the part of the tile that has color information, i.e. is not 100% transparent.
Often it is sensible to use the same image for collision as the one containing the actual graphics, but you are free to specify a separate image if you want collision shapes that differ from the visuals. When you specify a collision image, the preview is updated with an outline on each tile indicating the generated collision shapes.
The tile source outline lists collision groups that you have added to the tile source. New tile source files will get one “default” collision group added. You can add new groups by right clicking the tile source root in the Outline and selecting Add ▸ Collision Group.
To select the tile shapes that should belong to a certain group, select the group in th Outline, then click each tile that you wish to assign to the group. The outline of the tile and shape is colored with the group’s color. The color is automatically assigned to the group in the editor.
To remove a tile from its collision group, select the tile source root element in the Outline, then click the tile.