Tilemap/tileset system

Before we can do anything with the tileset, we need to create a tilemap layer first. See how we do that here.

Note that we can only operate with the tileset/tilemap system when the tilemap layer is selected.

Know the tileset window

Artwork by TransientCode
  1. The available tiles

  2. Tile brush

  3. Tile eraser

  4. Tile bucket

  5. Tile eye dropper

  6. More button

  7. Tile name change

  8. Export tileset

  9. Tile per row setter

  10. Canvas grid - this options determines the visibility of the grid and tile numbers on the canvas

  11. Add new tile - new tile will be added after the selected tile or at the end if nothing is selected

  12. Remove the selected tiles

Assign tile to the tilemap

To assign tiles to the grid on the canvas, we need to first select the tile(s). Tap on a tile to select it. To select multiple tiles, tap on the box next to the More (...) button, then tap on each tile to toggle its selection.

The selected tiles will have a border around them. Now select a tile tool (brush or tile bucket) and then draw the tiles onto the canvas.

When multiple tiles are selected, the app will assign the tiles randomly to the canvas using the selected tiles as the randomization pool.

We can also move the assignment around with the move tool. If there is an active selection, it will move all tiles selected by that selection, if there isn't one, it will only move 1 tile at a time.

Removing an assignment is the same as assigning tiles, but we need to select the eraser button instead of the brush/tile bucket.

We can use the tile eyedropper to select a tile on the canvas, similar to how we pick a color using color eyedropper.

Reorder tiles

To reorder tiles within the tileset, we need to long press on a tile, and then drag it to the new position. If the dragged tile is one of the selected tiles, it will move all selected tiles together. The assignment on the tilemap grid will be updated automatically to match the new order.

Import/Export

There are 2 supported file types for tilesets:

  • pxts: Pixquare's own tileset file format, for effortless transfer within Pixquare

  • png: For better compatibility with other software and game engines

We can also convert regular layers into tilemap layers. To do that active the contextual menu, then tap "New tilemap layer".

Tileset exporting

To access this menu, select the "..." button of the tileset panel, then "Export"

These tinkerings are only needed for png format. We can select "Individual PNGs" to export the tiles into individual pngs instead of in one sheet.

Tileset importing

We can import tilesets when we create new tilemap layers. And again, pxts file will just work, while png importing will require tinkering like the above image.

Tileset merge

Tap on the merge icon to start the process. We can only merge tilesets with the same tile size. When merging, the receiving tileset will have the tiles of the merged tileset while the merged tileset remains unchanged.

What else?

That's it, we can now start drawing and see the magic of the tileset system.

We can animate tilemap layers just like regular layers.

Last updated

Was this helpful?