mirror of
https://github.com/Relintai/pandemonium_engine_docs.git
synced 2025-01-04 14:49:52 +01:00
LayeredTileMap docs markdown port.
This commit is contained in:
parent
4ffba3b0f0
commit
c81f1cdf2c
@ -1,30 +1,24 @@
|
||||
.. _doc_using_tilemaps:
|
||||
|
||||
Using LayeredTileMaps
|
||||
==============
|
||||
# Using LayeredTileMaps
|
||||
|
||||
.. seealso::
|
||||
This page assumes you have created or downloaded a LayeredTileSet already. If not,
|
||||
please read [using_tilesets.md](using_tilesets.md) first as you will need a LayeredTileSet
|
||||
to create a LayeredTileMap.
|
||||
|
||||
This page assumes you have created or downloaded a LayeredTileSet already. If not,
|
||||
please read :ref:`doc_using_tilesets` first as you will need a LayeredTileSet
|
||||
to create a LayeredTileMap.
|
||||
|
||||
Introduction
|
||||
------------
|
||||
## Introduction
|
||||
|
||||
A tilemap is a grid of tiles used to create a game's layout. There are several
|
||||
benefits to using :ref:`LayeredTileMap <class_LayeredTileMap>` nodes to design your levels.
|
||||
benefits to using LayeredTileMap nodes to design your levels.
|
||||
First, they make it possible to draw the layout by "painting" the tiles onto a
|
||||
grid, which is much faster than placing individual :ref:`Sprite2D <class_Sprite2D>`
|
||||
grid, which is much faster than placing individual Sprite
|
||||
nodes one by one. Second, they allow for much larger levels because they are
|
||||
optimized for drawing large numbers of tiles. Finally, you can add collision,
|
||||
occlusion, and navigation shapes to tiles, adding greater functionality to
|
||||
the LayeredTileMap.
|
||||
|
||||
Specifying the LayeredTileSet in the LayeredTileMap
|
||||
-------------------------------------
|
||||
## Specifying the LayeredTileSet in the LayeredTileMap
|
||||
|
||||
If you've followed the previous page on :ref:`doc_using_tilesets`, you should
|
||||
If you've followed the previous page on [using_tilesets.md](using_tilesets.md), you should
|
||||
have a LayeredTileSet resource that is built-in to the LayeredTileMap node. This is good for
|
||||
prototyping, but in a real world project, you will generally have multiple
|
||||
levels reusing the same tileset.
|
||||
@ -33,14 +27,11 @@ The recommended way to reuse the same LayeredTileSet in several LayeredTileMap n
|
||||
the LayeredTileSet to an external resource. To do so, click the dropdown next to the LayeredTileSet
|
||||
resource and choose **Save**:
|
||||
|
||||
.. figure:: img/using_tilemaps_save_tileset_to_resource.webp
|
||||
:align: center
|
||||
:alt: Saving the built-in LayeredTileSet resource to an external resource file
|
||||
|
||||
|
||||
Saving the built-in LayeredTileSet resource to an external resource file
|
||||
Saving the built-in LayeredTileSet resource to an external resource file
|
||||
|
||||
Creating LayeredTileMap layers
|
||||
-----------------------
|
||||
## Creating LayeredTileMap layers
|
||||
|
||||
As of Godot 4.0, you can place several *layers* in a single LayeredTileMap node. For
|
||||
example, this allows you to distinguish foreground tiles from background tiles
|
||||
@ -52,11 +43,9 @@ to create additional layers if you only need a single layer, but if you wish to
|
||||
do so now, select the LayeredTileMap node and unfold the **Layers** section in the
|
||||
inspector:
|
||||
|
||||
.. figure:: img/using_tilemaps_create_layers.webp
|
||||
:align: center
|
||||
:alt: Creating layers in a LayeredTileMap node (example with "background" and "foreground")
|
||||
|
||||
|
||||
Creating layers in a LayeredTileMap node (example with "background" and "foreground")
|
||||
Creating layers in a LayeredTileMap node (example with "background" and "foreground")
|
||||
|
||||
Each layer has several properties you can adjust:
|
||||
|
||||
@ -82,42 +71,36 @@ Each layer has several properties you can adjust:
|
||||
You can reorder layers by drag-and-dropping the "three horizontal bars" icon on
|
||||
the left of the entries in the **Layers** section.
|
||||
|
||||
.. note::
|
||||
Note:
|
||||
|
||||
You can create, rename or reorder layers in the future without affecting
|
||||
existing tiles. Be careful though, as *removing* a layer will also remove
|
||||
all tiles that were placed on the layer.
|
||||
You can create, rename or reorder layers in the future without affecting
|
||||
existing tiles. Be careful though, as *removing* a layer will also remove
|
||||
all tiles that were placed on the layer.
|
||||
|
||||
Opening the LayeredTileMap editor
|
||||
--------------------------
|
||||
## Opening the LayeredTileMap editor
|
||||
|
||||
Select the LayeredTileMap node, then open the LayeredTileMap panel at the bottom
|
||||
of the editor:
|
||||
|
||||
.. figure:: img/using_tilemaps_open_tilemap_editor.webp
|
||||
:align: center
|
||||
:alt: Opening the LayeredTileMap panel at the bottom of the editor. The LayeredTileMap node must be selected first.
|
||||
|
||||
|
||||
Opening the LayeredTileMap panel at the bottom of the editor. The LayeredTileMap node must be selected first.
|
||||
Opening the LayeredTileMap panel at the bottom of the editor. The LayeredTileMap node must be selected first.
|
||||
|
||||
Selecting tiles to use for painting
|
||||
-----------------------------------
|
||||
## Selecting tiles to use for painting
|
||||
|
||||
First, if you've created additional layers above, make sure you've selected the
|
||||
layer you wish to paint on:
|
||||
|
||||
.. figure:: img/using_tilemaps_select_layer.webp
|
||||
:align: center
|
||||
:alt: Selecting a layer to paint on in the LayeredTileMap editor
|
||||
|
||||
|
||||
Selecting a layer to paint on in the LayeredTileMap editor
|
||||
Selecting a layer to paint on in the LayeredTileMap editor
|
||||
|
||||
.. tip::
|
||||
Tip:
|
||||
|
||||
In the 2D editor, the layers you aren't currently editing from the same
|
||||
LayeredTileMap node will appear grayed out while in the LayeredTileMap editor. You can
|
||||
disable this behavior by clicking the icon next to the layer selection menu
|
||||
(**Highlight Selected LayeredTileMap Layer** tooltip).
|
||||
In the 2D editor, the layers you aren't currently editing from the same
|
||||
LayeredTileMap node will appear grayed out while in the LayeredTileMap editor. You can
|
||||
disable this behavior by clicking the icon next to the layer selection menu
|
||||
(**Highlight Selected LayeredTileMap Layer** tooltip).
|
||||
|
||||
You can skip the above step if you haven't created additional layers, as the
|
||||
first layer is automatically selected when entering the LayeredTileMap editor.
|
||||
@ -126,19 +109,17 @@ Before you can place tiles in the 2D editor, you must select one or more tiles
|
||||
in the LayeredTileMap panel located at the bottom of the editor. To do so, click a tile
|
||||
in the LayeredTileMap panel, or hold down the mouse button to select multiple tiles:
|
||||
|
||||
.. figure:: img/using_tilemaps_select_single_tile_from_tileset.webp
|
||||
:align: center
|
||||
:alt: Selecting a tile in the LayeredTileMap editor by clicking it
|
||||
|
||||
|
||||
Selecting a tile in the LayeredTileMap editor by clicking it
|
||||
Selecting a tile in the LayeredTileMap editor by clicking it
|
||||
|
||||
.. tip::
|
||||
Tip:
|
||||
|
||||
Like in the 2D and LayeredTileSet editors, you can pan across the LayeredTileMap panel using
|
||||
the middle or right mouse buttons, and zoom using the mouse wheel or buttons in
|
||||
the top-left corner.
|
||||
Like in the 2D and LayeredTileSet editors, you can pan across the LayeredTileMap panel using
|
||||
the middle or right mouse buttons, and zoom using the mouse wheel or buttons in
|
||||
the top-left corner.
|
||||
|
||||
You can also hold down :kbd:`Shift` to append to the current selection. When
|
||||
You can also hold down `Shift` to append to the current selection. When
|
||||
selecting more than one tile, multiple tiles will be placed every time you
|
||||
perform a painting operation. This can be used to paint structures composed of
|
||||
multiple tiles in a single click (such as large platforms or trees).
|
||||
@ -147,31 +128,24 @@ The final selection does not have to be contiguous: if there is empty space
|
||||
between selected tiles, it will be left empty in the pattern that will be
|
||||
painted in the 2D editor.
|
||||
|
||||
.. figure:: img/using_tilemaps_select_multiple_tiles_from_tileset.webp
|
||||
:align: center
|
||||
:alt: Selecting multiple tiles in the LayeredTileMap editor by holding down the left mouse button
|
||||
|
||||
|
||||
Selecting multiple tiles in the LayeredTileMap editor by holding down the left mouse button
|
||||
Selecting multiple tiles in the LayeredTileMap editor by holding down the left mouse button
|
||||
|
||||
If you've created alternative tiles in your LayeredTileSet, you can select them for
|
||||
painting on the right of the base tiles:
|
||||
|
||||
.. figure:: img/using_tilemaps_use_alternative_tile.webp
|
||||
:align: center
|
||||
:alt: Selecting an alternative tile in the LayeredTileMap editor
|
||||
|
||||
|
||||
Selecting an alternative tile in the LayeredTileMap editor
|
||||
Selecting an alternative tile in the LayeredTileMap editor
|
||||
|
||||
Lastly, if you've created a *scenes collection* in the LayeredTileSet, you can place scene tiles in the LayeredTileMap:
|
||||
|
||||
.. figure:: img/using_tilemaps_placing_scene_tiles.webp
|
||||
:align: center
|
||||
:alt: Placing a scene tile containing particles using the LayeredTileMap editor
|
||||
|
||||
|
||||
Placing a scene tile containing particles using the LayeredTileMap editor
|
||||
Placing a scene tile containing particles using the LayeredTileMap editor
|
||||
|
||||
Painting modes and tools
|
||||
------------------------
|
||||
## Painting modes and tools
|
||||
|
||||
Using the toolbar at the top of the LayeredTileMap editor, you can choose between
|
||||
several painting modes and tools. These modes affect operation when clicking in
|
||||
@ -179,34 +153,32 @@ the 2D editor, **not** the LayeredTileMap panel itself.
|
||||
|
||||
From left to right, the painting modes and tools you can choose are:
|
||||
|
||||
Selection
|
||||
^^^^^^^^^
|
||||
### Selection
|
||||
|
||||
Select tiles by clicking a single tile, or by holding down the left mouse button to
|
||||
select multiple with a rectangle in the 2D editor. Note that empty space cannot be
|
||||
selected: if you create a rectangle selection, only non-empty tiles will be selected.
|
||||
|
||||
To append to the current selection, hold :kbd:`Shift` then select a tile.
|
||||
To remove from the current selection, hold :kbd:`Ctrl` then select a tile.
|
||||
To append to the current selection, hold `Shift` then select a tile.
|
||||
To remove from the current selection, hold `Ctrl` then select a tile.
|
||||
|
||||
The selection can then be used in any other painting mode to quickly create copies
|
||||
of an already-placed pattern.
|
||||
|
||||
You can remove the selected tiles from the LayeredTileMap by pressing :kbd:`Del`.
|
||||
You can remove the selected tiles from the LayeredTileMap by pressing `Del`.
|
||||
|
||||
You can toggle this mode temporarily while in Paint mode by holding :kbd:`Ctrl`
|
||||
You can toggle this mode temporarily while in Paint mode by holding `Ctrl`
|
||||
then performing a selection.
|
||||
|
||||
.. tip::
|
||||
Tip:
|
||||
|
||||
You can copy and paste tiles that were already placed by performing a
|
||||
selection, pressing :kbd:`Ctrl + C` then pressing :kbd:`Ctrl + V`.
|
||||
The selection will be pasted after left-clicking. You can press
|
||||
:kbd:`Ctrl + V` another time to perform more copies this way.
|
||||
Right-click or press :kbd:`Escape` to cancel pasting.
|
||||
You can copy and paste tiles that were already placed by performing a
|
||||
selection, pressing `Ctrl + C` then pressing `Ctrl + V`.
|
||||
The selection will be pasted after left-clicking. You can press
|
||||
`Ctrl + V` another time to perform more copies this way.
|
||||
Right-click or press `Escape` to cancel pasting.
|
||||
|
||||
Paint
|
||||
^^^^^
|
||||
### Paint
|
||||
|
||||
The standard Paint mode allows you to place tiles by clicking or holding
|
||||
down the left mouse button.
|
||||
@ -218,24 +190,23 @@ If you have selected multiple tiles in the LayeredTileMap or using the Selection
|
||||
they will be placed every time you click or drag the mouse while holding down
|
||||
the left mouse button.
|
||||
|
||||
.. tip::
|
||||
Tip:
|
||||
|
||||
While in Paint mode, you can draw a line by holding :kbd:`Shift` *before*
|
||||
holding down the left mouse button, then dragging the mouse to the line's end
|
||||
point. This is identical to using the Line tool described below.
|
||||
While in Paint mode, you can draw a line by holding `Shift` *before*
|
||||
holding down the left mouse button, then dragging the mouse to the line's end
|
||||
point. This is identical to using the Line tool described below.
|
||||
|
||||
You can also draw a rectangle by holding :kbd:`Ctrl` and :kbd:`Shift`
|
||||
*before* holding down the left mouse button, then dragging the mouse to the
|
||||
rectangle's end point. This is identical to using the Rectangle tool
|
||||
described below.
|
||||
You can also draw a rectangle by holding `Ctrl` and `Shift`
|
||||
*before* holding down the left mouse button, then dragging the mouse to the
|
||||
rectangle's end point. This is identical to using the Rectangle tool
|
||||
described below.
|
||||
|
||||
Lastly, you can pick existing tiles in the 2D editor by holding :kbd:`Ctrl`
|
||||
then clicking on a tile (or holding and dragging the mouse).
|
||||
This will switch the currently painted tile(s) to the tile(s) you've just clicked.
|
||||
This is identical to using the Picker tool described below.
|
||||
Lastly, you can pick existing tiles in the 2D editor by holding `Ctrl`
|
||||
then clicking on a tile (or holding and dragging the mouse).
|
||||
This will switch the currently painted tile(s) to the tile(s) you've just clicked.
|
||||
This is identical to using the Picker tool described below.
|
||||
|
||||
Line
|
||||
^^^^
|
||||
### Line
|
||||
|
||||
After selecting Line Paint mode, you can draw in a line that is
|
||||
always 1 tile thick (no matter its orientation).
|
||||
@ -246,16 +217,13 @@ If you have selected multiple tiles in the LayeredTileMap or using the Selection
|
||||
you can place them in a repeating pattern across the line.
|
||||
|
||||
You can toggle this mode temporarily while in Paint or Eraser mode by holding
|
||||
:kbd:`Shift` then drawing.
|
||||
`Shift` then drawing.
|
||||
|
||||
.. figure:: img/using_tilesets_line_tool_multiple_tiles.webp
|
||||
:align: center
|
||||
:alt: Using the line tool after selecting two tiles to draw platforms diagonally
|
||||
|
||||
|
||||
Using the line tool after selecting two tiles to draw platforms diagonally
|
||||
Using the line tool after selecting two tiles to draw platforms diagonally
|
||||
|
||||
Rectangle
|
||||
^^^^^^^^^
|
||||
### Rectangle
|
||||
|
||||
After selecting Rectangle Paint mode, you can draw in an axis-aligned
|
||||
rectangle.
|
||||
@ -267,10 +235,9 @@ If you have selected multiple tiles in the LayeredTileMap or using the Selection
|
||||
you can place them in a repeating pattern within the rectangle.
|
||||
|
||||
You can toggle this mode temporarily while in Paint or Eraser mode by holding
|
||||
:kbd:`Ctrl` and :kbd:`Shift` then drawing.
|
||||
`Ctrl` and `Shift` then drawing.
|
||||
|
||||
Bucket Fill
|
||||
^^^^^^^^^^^
|
||||
### Bucket Fill
|
||||
|
||||
After selecting Bucket Fill mode, you can choose whether painting should be
|
||||
limited to contiguous areas only by toggling the **Contiguous** checkbox that
|
||||
@ -291,26 +258,22 @@ with empty tiles.
|
||||
If you have selected multiple tiles in the LayeredTileMap or using the Selection tool,
|
||||
you can place them in a repeating pattern within the filled area.
|
||||
|
||||
.. figure:: img/using_tilemaps_bucket_fill.webp
|
||||
:align: center
|
||||
:alt: Using the Bucket Fill tool
|
||||
|
||||
|
||||
Using the Bucket Fill tool
|
||||
Using the Bucket Fill tool
|
||||
|
||||
Picker
|
||||
^^^^^^
|
||||
### Picker
|
||||
|
||||
After selecting Picker mode, you can pick existing tiles in the 2D editor by
|
||||
holding :kbd:`Ctrl` then clicking on a tile. This will switch the currently
|
||||
holding `Ctrl` then clicking on a tile. This will switch the currently
|
||||
painted tile to the tile you've just clicked. You can also pick multiple tiles
|
||||
at once by holding down the left mouse button and forming a rectangle selection.
|
||||
Only non-empty tiles can be picked.
|
||||
|
||||
You can toggle this mode temporarily while in Paint mode by holding :kbd:`Ctrl`
|
||||
You can toggle this mode temporarily while in Paint mode by holding `Ctrl`
|
||||
then clicking or dragging the mouse.
|
||||
|
||||
Eraser
|
||||
^^^^^^
|
||||
### Eraser
|
||||
|
||||
This mode is combined with any other painting mode (Paint, Line, Rectangle,
|
||||
Bucket Fill). When eraser mode is enabled, tiles will be replaced by empty tiles
|
||||
@ -319,8 +282,7 @@ instead of drawing new lines when left-clicking.
|
||||
You can toggle this mode temporarily while in any other mode by right-clicking
|
||||
instead of left-clicking.
|
||||
|
||||
Painting randomly using scattering
|
||||
----------------------------------
|
||||
## Painting randomly using scattering
|
||||
|
||||
While painting, you can optionally enable *randomization*. When enabled,
|
||||
a random tile will be chosen between all the currently selected tiles when
|
||||
@ -335,66 +297,56 @@ LayeredTileMap).
|
||||
|
||||
Example when using Paint mode:
|
||||
|
||||
.. figure:: img/using_tilemaps_scatter_tiles.webp
|
||||
:align: center
|
||||
:alt: Selecting from several times to randomly choose, then painting by holding down the left mouse button
|
||||
|
||||
|
||||
Selecting from several times to randomly choose, then painting by holding down the left mouse button
|
||||
Selecting from several times to randomly choose, then painting by holding down the left mouse button
|
||||
|
||||
Example when using Bucket Fill mode:
|
||||
|
||||
.. figure:: img/using_tilemaps_bucket_fill_scatter.webp
|
||||
:align: center
|
||||
:alt: Using Bucket Fill tool with a single tile, but with randomization and scattering enabled
|
||||
|
||||
|
||||
Using Bucket Fill tool with a single tile, but with randomization and scattering enabled
|
||||
Using Bucket Fill tool with a single tile, but with randomization and scattering enabled
|
||||
|
||||
.. note::
|
||||
Note:
|
||||
|
||||
Eraser mode does not take randomization and scattering into account.
|
||||
All tiles within the selection are always removed.
|
||||
Eraser mode does not take randomization and scattering into account.
|
||||
All tiles within the selection are always removed.
|
||||
|
||||
Saving and loading premade tile placements using patterns
|
||||
---------------------------------------------------------
|
||||
## Saving and loading premade tile placements using patterns
|
||||
|
||||
While you can copy and paste tiles while in Select mode, you may wish to save
|
||||
premade *patterns* of tiles to place together in a go. This can be done on a
|
||||
per-LayeredTileMap basis by choosing the **Patterns** tab of the LayeredTileMap editor.
|
||||
|
||||
To create a new pattern, switch to Select mode, perform a selection and press
|
||||
:kbd:`Ctrl + C`. Click on empty space within the Patterns tab (a blue focus
|
||||
rectangle should appear around the empty space), then press :kbd:`Ctrl + V`:
|
||||
`Ctrl + C`. Click on empty space within the Patterns tab (a blue focus
|
||||
rectangle should appear around the empty space), then press `Ctrl + V`:
|
||||
|
||||
.. figure:: img/using_tilemaps_create_pattern.webp
|
||||
:align: center
|
||||
:alt: Creating a new pattern from a selection in the LayeredTileMap editor
|
||||
|
||||
|
||||
Creating a new pattern from a selection in the LayeredTileMap editor
|
||||
Creating a new pattern from a selection in the LayeredTileMap editor
|
||||
|
||||
To use an existing pattern, click its image in the **Patterns** tab, switch to
|
||||
any painting mode, then left-click somewhere in the 2D editor:
|
||||
|
||||
.. figure:: img/using_tilemaps_use_pattern.webp
|
||||
:align: center
|
||||
:alt: Placing an existing pattern using the LayeredTileMap editor
|
||||
|
||||
|
||||
Placing an existing pattern using the LayeredTileMap editor
|
||||
Placing an existing pattern using the LayeredTileMap editor
|
||||
|
||||
Like multi-tile selections, patterns will be repeated if used with the Line,
|
||||
Rectangle or Bucket Fill painting modes.
|
||||
|
||||
.. note::
|
||||
Note:
|
||||
|
||||
Despite being edited in the LayeredTileMap editor, patterns are stored in the
|
||||
LayeredTileSet resource. This allows reusing patterns in different LayeredTileMap nodes
|
||||
after loading a LayeredTileSet resource saved to an external file.
|
||||
Despite being edited in the LayeredTileMap editor, patterns are stored in the
|
||||
LayeredTileSet resource. This allows reusing patterns in different LayeredTileMap nodes
|
||||
after loading a LayeredTileSet resource saved to an external file.
|
||||
|
||||
Handling tile connections automatically using terrains
|
||||
------------------------------------------------------
|
||||
## Handling tile connections automatically using terrains
|
||||
|
||||
To use terrains, the LayeredTileMap node must feature at least one terrain set and a
|
||||
terrain within this terrain set. See
|
||||
:ref:`doc_using_tilesets_creating_terrain_sets` if you haven't created a terrain
|
||||
`doc_using_tilesets_creating_terrain_sets` if you haven't created a terrain
|
||||
set for the LayeredTileSet yet.
|
||||
|
||||
There are 3 kinds of painting modes available for terrain connections:
|
||||
@ -411,48 +363,39 @@ more artist control during painting. For instance, Path can allow roads to be
|
||||
directly adjacent to each other without being connected to each other, while
|
||||
Connect will force both roads to be connected.
|
||||
|
||||
.. figure:: img/using_tilemaps_terrain_select_connect_mode.webp
|
||||
:align: center
|
||||
:alt: Selecting Connect mode in the LayeredTileMap editor's Terrains tab
|
||||
|
||||
|
||||
Selecting Connect mode in the LayeredTileMap editor's Terrains tab
|
||||
Selecting Connect mode in the LayeredTileMap editor's Terrains tab
|
||||
|
||||
.. figure:: img/using_tilemaps_terrain_select_path_mode.webp
|
||||
:align: center
|
||||
:alt: Selecting Path mode in the LayeredTileMap editor's Terrains tab
|
||||
|
||||
|
||||
Selecting Path mode in the LayeredTileMap editor's Terrains tab
|
||||
Selecting Path mode in the LayeredTileMap editor's Terrains tab
|
||||
|
||||
Lastly, you can select specific tiles from the terrain to resolve conflicts in
|
||||
certain situations:
|
||||
|
||||
.. figure:: img/using_tilemaps_terrain_paint_specific_tiles.webp
|
||||
:align: center
|
||||
:alt: Painting with specific tiles in the LayeredTileMap editor's Terrains tab
|
||||
|
||||
|
||||
Painting with specific tiles in the LayeredTileMap editor's Terrains tab
|
||||
Painting with specific tiles in the LayeredTileMap editor's Terrains tab
|
||||
|
||||
Any tile that has at least one of its bits set to a value set to the
|
||||
corresponding terrain ID will appear in the list of tiles to choose from.
|
||||
|
||||
Handling missing tiles
|
||||
----------------------
|
||||
## Handling missing tiles
|
||||
|
||||
If you remove tiles in the LayeredTileSet that are referenced in a LayeredTileMap, the LayeredTileMap
|
||||
will display a placeholder to indicate that an invalid tile ID is placed:
|
||||
|
||||
.. figure:: img/using_tilemaps_missing_tiles.webp
|
||||
:align: center
|
||||
:alt: Missing tiles in the LayeredTileMap editor due to the LayeredTileSet reference being broken
|
||||
|
||||
|
||||
Missing tiles in the LayeredTileMap editor due to the LayeredTileSet reference being broken
|
||||
Missing tiles in the LayeredTileMap editor due to the LayeredTileSet reference being broken
|
||||
|
||||
These placeholders are **not** visible in the running project, but the tile data
|
||||
is still persisted to disk. This allows you to safely close and reopen such
|
||||
scenes. Once you re-add a tile with the matching ID, the tiles will appear with
|
||||
the new tile's appearance.
|
||||
|
||||
.. note::
|
||||
Note:
|
||||
|
||||
Missing tile placeholders may not be visible until you select the LayeredTileMap
|
||||
node and open the LayeredTileMap editor.
|
||||
Missing tile placeholders may not be visible until you select the LayeredTileMap
|
||||
node and open the LayeredTileMap editor.
|
||||
|
||||
@ -1,55 +1,42 @@
|
||||
.. _doc_using_tilesets:
|
||||
|
||||
Using LayeredTileSets
|
||||
==============
|
||||
# Using LayeredTileSets
|
||||
|
||||
Introduction
|
||||
------------
|
||||
## Introduction
|
||||
|
||||
A tilemap is a grid of tiles used to create a game's layout. There are several
|
||||
benefits to using :ref:`LayeredTileMap <class_LayeredTileMap>` nodes to design your levels.
|
||||
benefits to using `LayeredTileMap` nodes to design your levels.
|
||||
First, they let you draw a layout by "painting" tiles onto a grid,
|
||||
which is much faster than placing individual :ref:`Sprite2D
|
||||
<class_Sprite2D>` nodes one by one. Second, they allow for larger levels
|
||||
which is much faster than placing individual `Sprite` nodes one by one.
|
||||
Second, they allow for larger levels
|
||||
because they are optimized for drawing large numbers of tiles.
|
||||
Finally, they allow you to add greater functionality to your tiles with
|
||||
collision, occlusion, and navigation shapes.
|
||||
|
||||
To use tilemaps, you will need to create a LayeredTileSet first. A LayeredTileSet is a
|
||||
collection of tiles that can be placed in a LayeredTileMap node. After creating a
|
||||
LayeredTileSet, you will be able to place them :ref:`using the LayeredTileMap editor
|
||||
<doc_using_tilemaps>`.
|
||||
LayeredTileSet, you will be able to place them using the LayeredTileMap editor.
|
||||
|
||||
To follow this guide, you will need an image containing your tiles where every
|
||||
tile has the same size (large objects can be split into several tiles). This
|
||||
image is called a *tilesheet*. Tiles do not have to be square: they can be
|
||||
rectangular, hexagonal, or isometric (pseudo-3D perspective).
|
||||
|
||||
Creating a new LayeredTileSet
|
||||
----------------------
|
||||
## Creating a new LayeredTileSet
|
||||
|
||||
.. _doc_creating_tilesets_using_tilesheet:
|
||||
|
||||
Using a tilesheet
|
||||
^^^^^^^^^^^^^^^^^
|
||||
### Using a tilesheet
|
||||
|
||||
This demonstration will use the following tiles taken from
|
||||
`Kenney's "Abstract Platformer" pack <https://kenney.nl/assets/abstract-platformer>`__.
|
||||
[Kenney's "Abstract Platformer" pack](https://kenney.nl/assets/abstract-platformer).
|
||||
We'll use this particular *tilesheet* from the set:
|
||||
|
||||
.. figure:: img/using_tilesets_kenney_abstract_platformer_tile_sheet.webp
|
||||
:align: center
|
||||
:alt: Tilesheet example with 64×64 tiles
|
||||
|
||||
Tilesheet with 64×64 tiles. Credit: [Kenney](https://kenney.nl/assets/abstract-platformer)
|
||||
|
||||
Tilesheet with 64×64 tiles. Credit: `Kenney <https://kenney.nl/assets/abstract-platformer>`__
|
||||
Create a new **LayeredTileMap** node, then select it and create a new `LayeredTileSet` resource in the inspector:
|
||||
|
||||
Create a new **LayeredTileMap** node, then select it and create a new LayeredTileSet resource in the inspector:
|
||||
|
||||
|
||||
.. figure:: img/using_tilesets_create_new_tileset.webp
|
||||
:align: center
|
||||
:alt: Creating a new LayeredTileSet resource within the LayeredTileMap node
|
||||
|
||||
Creating a new LayeredTileSet resource within the LayeredTileMap node
|
||||
Creating a new LayeredTileSet resource within the LayeredTileMap node
|
||||
|
||||
After creating the LayeredTileSet resource, click the value to unfold it in the
|
||||
inspector. The default tile shape is Square, but you can also choose Isometric,
|
||||
@ -62,11 +49,9 @@ area on the tilesheet.
|
||||
|
||||
Set the tile size to 64×64 in the inspector to match the example tilesheet:
|
||||
|
||||
.. figure:: img/using_tilesets_specify_size_then_edit.webp
|
||||
:align: center
|
||||
:alt: Setting the tile size to 64×64 to match the example tilesheet
|
||||
|
||||
|
||||
Setting the tile size to 64×64 to match the example tilesheet
|
||||
Setting the tile size to 64×64 to match the example tilesheet
|
||||
|
||||
If relying on automatic tiles creation (like we're about to do here), you must
|
||||
set the tile size **before** creating the *atlas*. The atlas will
|
||||
@ -76,58 +61,43 @@ determine which tiles from the tilesheet can be added to a LayeredTileMap node
|
||||
Open the **LayeredTileSet** panel at the bottom of the editor, then click the "+" icon
|
||||
in the bottom-left corner to add a new atlas:
|
||||
|
||||
.. figure:: img/using_tilesets_create_new_atlas.webp
|
||||
:align: center
|
||||
:alt: Creating a new atlas in a LayeredTileSet resource using the bottom panel
|
||||
|
||||
|
||||
Creating a new atlas in a LayeredTileSet resource using the bottom panel
|
||||
Creating a new atlas in a LayeredTileSet resource using the bottom panel
|
||||
|
||||
After creating an atlas, you must assign a tilesheet texture to it.
|
||||
This can be done by choosing it on the left column of the bottom panel, then
|
||||
clicking the value of the **Texture** property and choosing **Quick Load** (or **Load**).
|
||||
Specify the path to the image file using the file dialog that appears.
|
||||
|
||||
.. figure:: img/using_tilesets_load_tilesheet.webp
|
||||
:align: center
|
||||
:alt: Loading a tilesheet image in the newly created LayeredTileSet atlas
|
||||
|
||||
|
||||
Loading a tilesheet image in the newly created LayeredTileSet atlas
|
||||
Loading a tilesheet image in the newly created LayeredTileSet atlas
|
||||
|
||||
After specifying a valid image, you will be asked whether to create tiles
|
||||
automatically. Answer **Yes**:
|
||||
|
||||
.. figure:: img/using_tilesets_create_tiles_automatically.webp
|
||||
:align: center
|
||||
:alt: Automatically creating tiles based on tilesheet image content
|
||||
|
||||
Automatically creating tiles based on tilesheet image content
|
||||
|
||||
|
||||
This will automatically create tiles according to the tile size you specified
|
||||
earlier in the LayeredTileSet resource. This greatly speeds up initial tile setup.
|
||||
|
||||
.. note::
|
||||
Note:
|
||||
|
||||
When using automatic tile generation based on image contents, parts of the
|
||||
tilesheet that are *fully* transparent will not have tiles generated.
|
||||
- When using automatic tile generation based on image contents, parts of the tilesheet that are *fully* transparent will not have tiles generated.
|
||||
|
||||
If there are tiles from the tilesheet you do not wish to be present in atlas,
|
||||
choose the Eraser tool at the top of the tileset preview, then click the tiles
|
||||
you wish to remove:
|
||||
|
||||
.. figure:: img/using_tilesets_eraser_tool.webp
|
||||
:align: center
|
||||
:alt: Using the Eraser tool to remove unwanted tiles from the LayeredTileSet atlas
|
||||
|
||||
|
||||
Using the Eraser tool to remove unwanted tiles from the LayeredTileSet atlas
|
||||
Using the Eraser tool to remove unwanted tiles from the LayeredTileSet atlas
|
||||
|
||||
You can also right-click a tile and choose **Delete**, as an alternative to the
|
||||
Eraser tool.
|
||||
|
||||
.. tip::
|
||||
|
||||
Like in the 2D and LayeredTileMap editors, you can pan across the LayeredTileSet panel using
|
||||
the middle or right mouse buttons, and zoom using the mouse wheel or buttons in
|
||||
the top-left corner.
|
||||
Tip: Like in the 2D and LayeredTileMap editors, you can pan across the LayeredTileSet panel using the middle or right mouse buttons, and zoom using the mouse wheel or buttons in the top-left corner.
|
||||
|
||||
If you wish to source tiles from several tilesheet images for a single LayeredTileSet,
|
||||
create additional atlases and assign textures to each of them before continuing.
|
||||
@ -136,11 +106,9 @@ tilesheets is recommended for better usability).
|
||||
|
||||
You can adjust properties for the atlas in the middle column:
|
||||
|
||||
.. figure:: img/using_tilesets_properties.webp
|
||||
:align: center
|
||||
:alt: Adjusting LayeredTileSet atlas properties in the dedicated inspector (part of the LayeredTileSet panel)
|
||||
|
||||
|
||||
Adjusting LayeredTileSet atlas properties in the dedicated inspector (part of the LayeredTileSet panel)
|
||||
Adjusting LayeredTileSet atlas properties in the dedicated inspector (part of the LayeredTileSet panel)
|
||||
|
||||
The following properties can be adjusted on the atlas:
|
||||
|
||||
@ -167,14 +135,11 @@ coordinates). To regenerate tiles automatically from the tilesheet, use the
|
||||
three vertical dots menu button at the top of the LayeredTileSet editor and choose
|
||||
**Create Tiles in Non-Transparent Texture Regions**:
|
||||
|
||||
.. figure:: img/using_tilesets_recreate_tiles_automatically.webp
|
||||
:align: center
|
||||
:alt: Recreating tiles automatically after changing atlas properties
|
||||
|
||||
|
||||
Recreating tiles automatically after changing atlas properties
|
||||
Recreating tiles automatically after changing atlas properties
|
||||
|
||||
Using a collection of scenes
|
||||
^^^^^^^^^^^^^^^^^^^^^^^^^^^^
|
||||
### Using a collection of scenes
|
||||
|
||||
Since Godot 4.0, you can place actual *scenes* as tiles. This allows you to use
|
||||
any collection of nodes as a tile. For example, you could use scene tiles to
|
||||
@ -182,51 +147,40 @@ place gameplay elements, such as shops the player may be able to interact with.
|
||||
You could also use scene tiles to place AudioStreamPlayer2Ds (for ambient
|
||||
sounds), particle effects, and more.
|
||||
|
||||
.. warning::
|
||||
Warning:
|
||||
|
||||
Scene tiles come with a greater performance overhead compared to atlases, as
|
||||
every scene is instanced individually for every placed tile.
|
||||
|
||||
It's recommended to use only scene tiles when necessary. To draw sprites in a
|
||||
tile without any kind of advanced manipulation,
|
||||
:ref:`use atlases instead <doc_creating_tilesets_using_tilesheet>`.
|
||||
- Scene tiles come with a greater performance overhead compared to atlases, as every scene is instanced individually for every placed tile.
|
||||
- It's recommended to use only scene tiles when necessary. To draw sprites in a tile without any kind of advanced manipulation, use atlases instead.
|
||||
|
||||
For this example, we'll create a scene containing a CPUParticles2D root node.
|
||||
Save this scene to a scene file (separate from the scene containing the
|
||||
LayeredTileMap), then switch to the scene containing the LayeredTileMap node. Open the LayeredTileSet
|
||||
editor, and create a new **Scenes Collection** in the left column:
|
||||
|
||||
.. figure:: img/using_tilesets_creating_scene_collection.webp
|
||||
:align: center
|
||||
:alt: Creating a scenes collection in the LayeredTileSet editor
|
||||
|
||||
|
||||
Creating a scenes collection in the LayeredTileSet editor
|
||||
Creating a scenes collection in the LayeredTileSet editor
|
||||
|
||||
After creating a scenes collection, you can enter a descriptive name for the
|
||||
scenes collection in the middle column if you wish. Select this scenes
|
||||
collection then create a new scene slot:
|
||||
|
||||
.. figure:: img/using_tilesets_scene_collection_create_scene_tile.webp
|
||||
:align: center
|
||||
:alt: Creating a scene tile after selecting the scenes collection in the LayeredTileSet editor
|
||||
|
||||
|
||||
Creating a scene tile after selecting the scenes collection in the LayeredTileSet editor
|
||||
Creating a scene tile after selecting the scenes collection in the LayeredTileSet editor
|
||||
|
||||
Select this scene slot in the right column, then use **Quick Load** (or
|
||||
**Load**) to load the scene file containing the particles:
|
||||
|
||||
.. figure:: img/using_tilesets_adding_scene_tile.webp
|
||||
:align: center
|
||||
:alt: Creating a scene slot, then loading a scene file into it in the LayeredTileSet editor
|
||||
|
||||
|
||||
Creating a scene slot, then loading a scene file into it in the LayeredTileSet editor
|
||||
Creating a scene slot, then loading a scene file into it in the LayeredTileSet editor
|
||||
|
||||
You now have a scene tile in your LayeredTileSet. Once you switch to the LayeredTileMap
|
||||
editor, you'll be able to select it from the scenes collection and paint it like
|
||||
any other tile.
|
||||
|
||||
Merging several atlases into a single atlas
|
||||
-------------------------------------------
|
||||
## Merging several atlases into a single atlas
|
||||
|
||||
Using multiple atlases within a single LayeredTileSet resource can sometimes be useful,
|
||||
but it can also be cumbersome in certain situations (especially if you're using
|
||||
@ -237,20 +191,16 @@ To do so, you must have more than one atlas created in the LayeredTileSet resour
|
||||
Use the "three vertical dots" menu button located at the bottom of the list of
|
||||
atlases, then choose **Open Atlas Merging Tool**:
|
||||
|
||||
.. figure:: img/using_tilesets_open_atlas_merging_tool.webp
|
||||
:align: center
|
||||
:alt: Opening the atlas merging tool after creating multiple atlases
|
||||
|
||||
|
||||
Opening the atlas merging tool after creating multiple atlases
|
||||
Opening the atlas merging tool after creating multiple atlases
|
||||
|
||||
This will open a dialog, in which you can select several atlases by holding
|
||||
:kbd:`Shift` or :kbd:`Ctrl` then clicking on multiple elements:
|
||||
`Shift` or `Ctrl` then clicking on multiple elements:
|
||||
|
||||
.. figure:: img/using_tilesets_atlas_merging_tool_dialog.webp
|
||||
:align: center
|
||||
:alt: Using the atlas merging tool dialog
|
||||
|
||||
|
||||
Using the atlas merging tool dialog
|
||||
Using the atlas merging tool dialog
|
||||
|
||||
Choose **Merge** to merge the selected atlases into a single atlas image (which
|
||||
translates to a single atlas within the LayeredTileSet). The unmerged atlases will be
|
||||
@ -258,34 +208,24 @@ removed within the LayeredTileSet, but *the original tilesheet images will be ke
|
||||
the filesystem*. If you don't want the unmerged atlases to be removed from the
|
||||
LayeredTileSet resource, choose **Merge (Keep Original Atlases)** instead.
|
||||
|
||||
.. tip::
|
||||
Tip:
|
||||
|
||||
LayeredTileSet features a system of *tile proxies*. Tile proxies are a mapping
|
||||
table that allows notifying the LayeredTileMap using a given LayeredTileSet that a given
|
||||
set of tile identifiers should be replaced by another one.
|
||||
- LayeredTileSet features a system of *tile proxies*. Tile proxies are a mapping table that allows notifying the LayeredTileMap using a given LayeredTileSet that a given set of tile identifiers should be replaced by another one.
|
||||
- Tile proxies are automatically set up when merging different atlases, but they can also be set manually thanks to the **Manage Tile Proxies** dialog you can access using the "three vertical dots" menu mentioned above.
|
||||
- Manually creating tile proxies may be useful when you changed an atlas ID or want to replace all tiles from an atlas by the ones from another atlas. Note that when editing a LayeredTileMap, you can replace all cells by their corresponding mapped value.
|
||||
|
||||
Tile proxies are automatically set up when merging different atlases, but
|
||||
they can also be set manually thanks to the **Manage Tile Proxies** dialog
|
||||
you can access using the "three vertical dots" menu mentioned above.
|
||||
|
||||
Manually creating tile proxies may be useful when you changed an atlas ID or
|
||||
want to replace all tiles from an atlas by the ones from another atlas. Note
|
||||
that when editing a LayeredTileMap, you can replace all cells by their
|
||||
corresponding mapped value.
|
||||
|
||||
Adding collision, navigation and occlusion to the LayeredTileSet
|
||||
---------------------------------------------------------
|
||||
## Adding collision, navigation and occlusion to the LayeredTileSet
|
||||
|
||||
We've now successfully created a basic LayeredTileSet. We could start using in the
|
||||
LayeredTileMap node now, but it currently lacks any form of collision detection.
|
||||
This means the player and other objects could walk straight through the floor or
|
||||
walls.
|
||||
|
||||
If you use :ref:`2D navigation <doc_navigation_overview_2d>`, you'll also need
|
||||
If you use 2D navigation, you'll also need
|
||||
to define navigation polygons for tiles to generate a navigation mesh that
|
||||
agents can use for pathfinding.
|
||||
|
||||
Lastly, if you use :ref:`doc_2d_lights_and_shadows` or GPUParticles2D, you may
|
||||
Lastly, if you use 2D Lights and Shadows or GPUParticles2D, you may
|
||||
also want your LayeredTileSet to be able to cast shadows and collide with particles.
|
||||
This requires defining occluder polygons for "solid" tiles on the LayeredTileSet.
|
||||
|
||||
@ -295,57 +235,41 @@ resource first. To do so, select the LayeredTileMap node, click the LayeredTileS
|
||||
value in the inspector to edit it then unfold **Physics Layers** and choose
|
||||
**Add Element**:
|
||||
|
||||
.. figure:: img/using_tilesets_create_physics_layer.webp
|
||||
:align: center
|
||||
:alt: Creating a physics layer in the LayeredTileSet resource inspector (within the LayeredTileMap node)
|
||||
|
||||
|
||||
Creating a physics layer in the LayeredTileSet resource inspector (within the LayeredTileMap node)
|
||||
Creating a physics layer in the LayeredTileSet resource inspector (within the LayeredTileMap node)
|
||||
|
||||
If you also need navigation support, now is a good time to create a navigation layer:
|
||||
|
||||
.. figure:: img/using_tilesets_create_navigation_layer.webp
|
||||
:align: center
|
||||
:alt: Creating a navigation layer in the LayeredTileSet resource inspector (within the LayeredTileMap node)
|
||||
|
||||
|
||||
Creating a navigation layer in the LayeredTileSet resource inspector (within the LayeredTileMap node)
|
||||
Creating a navigation layer in the LayeredTileSet resource inspector (within the LayeredTileMap node)
|
||||
|
||||
If you need support for light polygon occluders, now is a good time to create an occlusion layer:
|
||||
|
||||
.. figure:: img/using_tilesets_create_occlusion_layer.webp
|
||||
:align: center
|
||||
:alt: Creating an occlusion layer in the LayeredTileSet resource inspector (within the LayeredTileMap node)
|
||||
|
||||
|
||||
Creating an occlusion layer in the LayeredTileSet resource inspector (within the LayeredTileMap node)
|
||||
Creating an occlusion layer in the LayeredTileSet resource inspector (within the LayeredTileMap node)
|
||||
|
||||
.. note::
|
||||
Note:
|
||||
|
||||
Future steps in this tutorial are tailored to creating collision polygons,
|
||||
but the procedure for navigation and occlusion is very similar.
|
||||
Their respective polygon editors behave in the same way, so these steps are
|
||||
not repeated for brevity.
|
||||
|
||||
The only caveat is that the tile's occlusion polygon property is part of a
|
||||
**Rendering** subsection in the atlas inspector. Make sure to unfold this
|
||||
section so you can edit the polygon.
|
||||
- Future steps in this tutorial are tailored to creating collision polygons, but the procedure for navigation and occlusion is very similar. Their respective polygon editors behave in the same way, so these steps are not repeated for brevity.
|
||||
- The only caveat is that the tile's occlusion polygon property is part of a **Rendering** subsection in the atlas inspector. Make sure to unfold this section so you can edit the polygon.
|
||||
|
||||
After creating a physics layer, you have access to the **Physics Layer** section
|
||||
in the LayeredTileSet atlas inspector:
|
||||
|
||||
.. figure:: img/using_tilesets_selecting_collision_editor.webp
|
||||
:align: center
|
||||
:alt: Opening the collision editor while in Select mode
|
||||
|
||||
|
||||
Opening the collision editor while in Select mode
|
||||
Opening the collision editor while in Select mode
|
||||
|
||||
You can quickly create a rectangle collision shape by pressing :kbd:`F` while
|
||||
You can quickly create a rectangle collision shape by pressing `F` while
|
||||
the LayeredTileSet editor is focused. If the keyboard shortcut doesn't work, try
|
||||
clicking in the empty area around the polygon editor to focus it:
|
||||
|
||||
.. figure:: img/using_tilesets_using_default_rectangle_collision.webp
|
||||
:align: center
|
||||
:alt: Using default rectangle collision shape by pressing :kbd:`F`
|
||||
|
||||
|
||||
Using default rectangle collision shape by pressing :kbd:`F`
|
||||
Using default rectangle collision shape by pressing `F`
|
||||
|
||||
In this tile collision editor, you have access to all the 2D polygon editing tools:
|
||||
|
||||
@ -361,31 +285,21 @@ In this tile collision editor, you have access to all the 2D polygon editing too
|
||||
You can use the default rectangle shape to quickly create a triangle-shaped
|
||||
collision shape by removing one of the points:
|
||||
|
||||
.. figure:: img/using_tilesets_creating_triangle_collision.webp
|
||||
:align: center
|
||||
:alt: Creating a triangle collision shape by right-clicking one of the corners to remove it
|
||||
|
||||
|
||||
Creating a triangle collision shape by right-clicking one of the corners to remove it
|
||||
Creating a triangle collision shape by right-clicking one of the corners to remove it
|
||||
|
||||
You can also use the rectangle as a base for more complex shapes by adding more points:
|
||||
|
||||
.. figure:: img/using_tilesets_drawing_custom_collision.webp
|
||||
:align: center
|
||||
:alt: Drawing a custom collision for a complex tile shape
|
||||
|
||||
|
||||
Drawing a custom collision for a complex tile shape
|
||||
Drawing a custom collision for a complex tile shape
|
||||
|
||||
.. tip::
|
||||
Tip:
|
||||
|
||||
If you have a large tileset, specifying the collision for each tile
|
||||
individually could take a lot of time. This is especially true as LayeredTileMaps
|
||||
tend to have many tiles with common collision patterns (such as solid blocks
|
||||
or 45-degree slopes). To apply a similar collision shape to several tiles
|
||||
quickly, use functionality to
|
||||
:ref:`assign properties to multiple tiles at once <doc_using_tilemaps_assigning_properties_to_multiple_tiles>`.
|
||||
If you have a large tileset, specifying the collision for each tile individually could take a lot of time. This is especially true as LayeredTileMaps tend to have many tiles with common collision patterns (such as solid blocks or 45-degree slopes). To apply a similar collision shape to several tiles quickly, use functionality to assign properties to multiple tiles at once.
|
||||
|
||||
Assigning custom metadata to the LayeredTileSet's tiles
|
||||
------------------------------------------------
|
||||
## Assigning custom metadata to the LayeredTileSet's tiles
|
||||
|
||||
You can assign custom data on a per-tile basis using *custom data layers*.
|
||||
This can be useful to store information specific to your game, such as the damage
|
||||
@ -394,21 +308,16 @@ destroyed using a weapon.
|
||||
|
||||
The data is associated with the tile in the LayeredTileSet: all instances of the placed
|
||||
tile will use the same custom data. If you need to create a variant of a tile
|
||||
that has different custom data, this can be done by :ref:`creating an
|
||||
alternative tile <doc_using_tilesets_creating_alternative_tiles>` and changing
|
||||
the custom data for the alternative tile only.
|
||||
that has different custom data, this can be done by creating an
|
||||
alternative tile and changing the custom data for the alternative tile only.
|
||||
|
||||
.. figure:: img/using_tilesets_create_custom_data_layer.webp
|
||||
:align: center
|
||||
:alt: Creating a custom data layer in the LayeredTileSet resource inspector (within the LayeredTileMap node)
|
||||
|
||||
|
||||
Creating a custom data layer in the LayeredTileSet resource inspector (within the LayeredTileMap node)
|
||||
Creating a custom data layer in the LayeredTileSet resource inspector (within the LayeredTileMap node)
|
||||
|
||||
.. figure:: img/using_tilesets_custom_data_layers_example.webp
|
||||
:align: center
|
||||
:alt: Example of configured custom data layers with game-specific properties
|
||||
|
||||
|
||||
Example of configured custom data layers with game-specific properties
|
||||
Example of configured custom data layers with game-specific properties
|
||||
|
||||
You can reorder custom data without breaking existing metadata: the LayeredTileSet
|
||||
editor will update automatically after reordering custom data properties.
|
||||
@ -416,41 +325,25 @@ editor will update automatically after reordering custom data properties.
|
||||
Note that in the editor, property names do not appear (only their index, which
|
||||
matches the order in which they are defined). For example, with the custom data
|
||||
layers example shown above, we're assigning a tile to have the
|
||||
``damage_per_second`` metadata set to ``25`` and the ``destructible`` metadata
|
||||
to ``false``:
|
||||
`damage_per_second` metadata set to `25` and the `destructible` metadata
|
||||
to `false`:
|
||||
|
||||
.. figure:: img/using_tilesets_edit_custom_data.webp
|
||||
:align: center
|
||||
:alt: Editing custom data in the LayeredTileSet editor while in Select mode
|
||||
|
||||
|
||||
Editing custom data in the LayeredTileSet editor while in Select mode
|
||||
Editing custom data in the LayeredTileSet editor while in Select mode
|
||||
|
||||
:ref:`Tile property painting <doc_using_tilemaps_using_tile_property_painting>`
|
||||
can also be used for custom data:
|
||||
Tile property painting can also be used for custom data:
|
||||
|
||||
.. figure:: img/using_tilesets_paint_custom_data.webp
|
||||
:align: center
|
||||
:alt: Assigning custom data in the LayeredTileSet editor using tile property painting
|
||||
|
||||
|
||||
Assigning custom data in the LayeredTileSet editor using tile property painting
|
||||
Assigning custom data in the LayeredTileSet editor using tile property painting
|
||||
|
||||
.. _doc_using_tilesets_creating_terrain_sets:
|
||||
## Creating terrain sets (autotiling)
|
||||
|
||||
Creating terrain sets (autotiling)
|
||||
----------------------------------
|
||||
Note:
|
||||
|
||||
.. note::
|
||||
|
||||
This functionality was implemented in a different form as *autotiling* in Godot 3.x.
|
||||
Terrains are essentially a more powerful replacement of autotiles. Unlike
|
||||
autotiles, terrains can support transitions from one terrain to another, as
|
||||
a tile may define several terrains at once.
|
||||
|
||||
Unlike before, where autotiles were a specific kind of tiles, terrains are
|
||||
only a set of properties assigned to atlas tiles. These properties are then
|
||||
used by a dedicated LayeredTileMap painting mode that selects tiles featuring
|
||||
terrain data in a smart way. This means any terrain tile can be either
|
||||
painted as terrain or as a single tile, like any other.
|
||||
- This functionality was implemented in a different form as *autotiling* in Godot 3.x. Terrains are essentially a more powerful replacement of autotiles. Unlike autotiles, terrains can support transitions from one terrain to another, as a tile may define several terrains at once.
|
||||
- Unlike before, where autotiles were a specific kind of tiles, terrains are only a set of properties assigned to atlas tiles. These properties are then used by a dedicated LayeredTileMap painting mode that selects tiles featuring terrain data in a smart way. This means any terrain tile can be either painted as terrain or as a single tile, like any other.
|
||||
|
||||
A "polished" tileset generally features variations that you should use on
|
||||
corners or edges of platforms, floors, etc. While these can be placed manually,
|
||||
@ -464,95 +357,76 @@ Terrains are grouped into terrain sets. Each terrain set is assigned a mode from
|
||||
**Match Corners and Sides**, **Match Corners** and **Match sides**. They define how
|
||||
terrains are matched to each other in a terrain set.
|
||||
|
||||
.. note::
|
||||
Note:
|
||||
|
||||
The above modes correspond to the previous bitmask modes autotiles used in
|
||||
Godot 3.x: 2×2, 3×3 or 3×3 minimal. This is also similar to what
|
||||
the `Tiled <https://www.mapeditor.org/>`__ editor features.
|
||||
- The above modes correspond to the previous bitmask modes autotiles used in Godot 3.x: 2×2, 3×3 or 3×3 minimal. This is also similar to what the [Tiled](https://www.mapeditor.org/) editor features.
|
||||
|
||||
Select the LayeredTileMap node, go to the inspector and create a new terrain set within the LayeredTileSet *resource*:
|
||||
|
||||
.. figure:: img/using_tilesets_create_terrain_set.webp
|
||||
:align: center
|
||||
:alt: Creating a terrain set in the LayeredTileSet resource inspector (within the LayeredTileMap node)
|
||||
|
||||
|
||||
Creating a terrain set in the LayeredTileSet resource inspector (within the LayeredTileMap node)
|
||||
Creating a terrain set in the LayeredTileSet resource inspector (within the LayeredTileMap node)
|
||||
|
||||
After creating a terrain set, you **must** create one or more terrains *within* the terrain set:
|
||||
|
||||
.. figure:: img/using_tilesets_create_terrain.webp
|
||||
:align: center
|
||||
:alt: Creating a terrain within the terrain set
|
||||
|
||||
|
||||
Creating a terrain within the terrain set
|
||||
Creating a terrain within the terrain set
|
||||
|
||||
In the LayeredTileSet editor, switch to Select mode and click a tile. In the middle
|
||||
column, unfold the **Terrains** section then assign a terrain set ID and a
|
||||
terrain ID for the tile. ``-1`` means "no terrain set" or "no terrain", which
|
||||
means you must set **Terrain Set** to ``0`` or greater before you can set
|
||||
**Terrain** to ``0`` or greater.
|
||||
terrain ID for the tile. `-1` means "no terrain set" or "no terrain", which
|
||||
means you must set **Terrain Set** to `0` or greater before you can set
|
||||
**Terrain** to `0` or greater.
|
||||
|
||||
.. note::
|
||||
Note:
|
||||
|
||||
Terrain set IDs and terrain IDs are independent from each other. They also
|
||||
start from ``0``, not ``1``.
|
||||
- Terrain set IDs and terrain IDs are independent from each other. They also start from `0`, not `1`.
|
||||
|
||||
.. figure:: img/using_tilesets_configure_terrain_on_tile.webp
|
||||
:align: center
|
||||
:alt: Configuring terrain on a single tile in the LayeredTileSet editor's Select mode
|
||||
|
||||
|
||||
Configuring terrain on a single tile in the LayeredTileSet editor's Select mode
|
||||
Configuring terrain on a single tile in the LayeredTileSet editor's Select mode
|
||||
|
||||
After doing so, you can now configure the **Terrain Peering Bits** section which
|
||||
becomes visible in the middle column. The peering bits determine which tile will
|
||||
be placed depending on neighboring tiles. ``-1`` is a special value which refers
|
||||
be placed depending on neighboring tiles. `-1` is a special value which refers
|
||||
to empty space.
|
||||
|
||||
For example, if a tile has all its bits set to ``0`` or greater, it will only
|
||||
For example, if a tile has all its bits set to `0` or greater, it will only
|
||||
appear if *all* 8 neighboring tiles are using a tile with the same terrain ID.
|
||||
If a tile has its bits set to ``0`` or greater,
|
||||
but the top-left, top and top-right bits are set to ``-1``, it will only appear
|
||||
If a tile has its bits set to `0` or greater,
|
||||
but the top-left, top and top-right bits are set to `-1`, it will only appear
|
||||
if there is empty space on top of it (including diagonally).
|
||||
|
||||
.. figure:: img/using_tilesets_configure_terrain_peering_bits.webp
|
||||
:align: center
|
||||
:alt: Configuring terrain peering bits on a single tile in the LayeredTileSet editor's Select mode
|
||||
|
||||
|
||||
Configuring terrain peering bits on a single tile in the LayeredTileSet editor's Select mode
|
||||
Configuring terrain peering bits on a single tile in the LayeredTileSet editor's Select mode
|
||||
|
||||
An example configuration for a full tilesheet may look as follows:
|
||||
|
||||
.. figure:: img/using_tilesets_terrain_example_tilesheet.webp
|
||||
:align: center
|
||||
:alt: Example full tilesheet for a sidescrolling game
|
||||
|
||||
|
||||
Example full tilesheet for a sidescrolling game
|
||||
Example full tilesheet for a sidescrolling game
|
||||
|
||||
.. figure:: img/using_tilesets_terrain_example_tilesheet_configuration.webp
|
||||
:align: center
|
||||
:alt: Example full tilesheet for a sidescrolling game with terrain peering bits visible
|
||||
|
||||
|
||||
Example full tilesheet for a sidescrolling game with terrain peering bits visible
|
||||
Example full tilesheet for a sidescrolling game with terrain peering bits visible
|
||||
|
||||
.. _doc_using_tilemaps_assigning_properties_to_multiple_tiles:
|
||||
|
||||
Assigning properties to multiple tiles at once
|
||||
----------------------------------------------
|
||||
## Assigning properties to multiple tiles at once
|
||||
|
||||
There are two ways to assign properties to multiple tiles at once.
|
||||
Depending on your use cases, one method may be faster than the other:
|
||||
|
||||
Using multiple tile selection
|
||||
^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
|
||||
### Using multiple tile selection
|
||||
|
||||
If you wish to configure various properties on several times at once,
|
||||
choose the **Select** mode at the top of the LayeredTileSet editor:
|
||||
|
||||
After doing this, you can select multiple tiles on the right column by holding
|
||||
:kbd:`Shift` then clicking on tiles. You can also perform rectangle selection by
|
||||
`Shift` then clicking on tiles. You can also perform rectangle selection by
|
||||
holding down the left mouse button then dragging the mouse. Lastly, you can
|
||||
deselect tiles that were already selected (without affecting the rest of the
|
||||
selection) by holding :kbd:`Shift` then clicking on a selected tile.
|
||||
selection) by holding `Shift` then clicking on a selected tile.
|
||||
|
||||
You can then assign properties using the inspector in the middle column of the
|
||||
LayeredTileSet editor. Only properties that you change here will be applied to all
|
||||
@ -562,16 +436,11 @@ selected tiles will remain different until you edit them.
|
||||
With numerical and color properties, you will also see a preview of the
|
||||
property's value on all tiles in the atlas after editing a property:
|
||||
|
||||
.. figure:: img/using_tilesets_select_and_set_tile_properties.webp
|
||||
:align: center
|
||||
:alt: Selecting multiple tiles using the Select mode, then applying properties
|
||||
|
||||
|
||||
Selecting multiple tiles using the Select mode, then applying properties
|
||||
Selecting multiple tiles using the Select mode, then applying properties
|
||||
|
||||
.. _doc_using_tilemaps_using_tile_property_painting:
|
||||
|
||||
Using tile property painting
|
||||
^^^^^^^^^^^^^^^^^^^^^^^^^^^^
|
||||
### Using tile property painting
|
||||
|
||||
If you wish to apply a single property to several tiles at once,
|
||||
you can use the *property painting* mode for this purpose.
|
||||
@ -580,46 +449,37 @@ Configure a property to be painted in the middle column, then
|
||||
click on tiles (or hold down the left mouse button) in the right column
|
||||
to "paint" properties onto tiles.
|
||||
|
||||
.. figure:: img/using_tilesets_paint_tile_properties.webp
|
||||
:align: center
|
||||
:alt: Painting tile properties using the LayeredTileSet editor
|
||||
|
||||
|
||||
Painting tile properties using the LayeredTileSet editor
|
||||
Painting tile properties using the LayeredTileSet editor
|
||||
|
||||
Tile property painting is especially useful with properties that are
|
||||
time-consuming to set manually, such as collision shapes:
|
||||
|
||||
.. figure:: img/using_tilesets_paint_tile_properties_collision.webp
|
||||
:align: center
|
||||
:alt: Painting a collision polygon, then left-clicking tiles to apply it
|
||||
|
||||
|
||||
Painting a collision polygon, then left-clicking tiles to apply it
|
||||
Painting a collision polygon, then left-clicking tiles to apply it
|
||||
|
||||
.. _doc_using_tilesets_creating_alternative_tiles:
|
||||
|
||||
Creating alternative tiles
|
||||
--------------------------
|
||||
## Creating alternative tiles
|
||||
|
||||
Sometimes, you want to use a single tile image (found only once within the
|
||||
atlas), but configured in different ways. For example, you may want to use the
|
||||
same tile image, but rotated, flipped, or modulated with a different color. This
|
||||
can be done using *alternative tiles*.
|
||||
|
||||
.. tip::
|
||||
Tip:
|
||||
|
||||
Since Godot 4.2, you don't have to create alternative tiles to rotate or
|
||||
flip tiles anymore. You can rotate any tile while placing it in the
|
||||
LayeredTileMap editor by using the rotation/flip buttons in the LayeredTileMap editor
|
||||
toolbar.
|
||||
Since Godot 4.2, you don't have to create alternative tiles to rotate or
|
||||
flip tiles anymore. You can rotate any tile while placing it in the
|
||||
LayeredTileMap editor by using the rotation/flip buttons in the LayeredTileMap editor
|
||||
toolbar.
|
||||
|
||||
To create an alternative tile, right-click a base tile in the atlas displayed by
|
||||
the LayeredTileSet editor, then choose **Create an Alternative Tile**:
|
||||
|
||||
.. figure:: img/using_tilesets_create_alternative_tile.webp
|
||||
:align: center
|
||||
:alt: Creating an alternative tile by right-clicking a base tile in the LayeredTileSet editor
|
||||
|
||||
|
||||
Creating an alternative tile by right-clicking a base tile in the LayeredTileSet editor
|
||||
Creating an alternative tile by right-clicking a base tile in the LayeredTileSet editor
|
||||
|
||||
If currently in Select mode, the alternative tile will already be selected
|
||||
for editing. If not currently in Select mode, you can still create alternative
|
||||
@ -630,11 +490,9 @@ If you don't see the alternative tile, pan over to the right of the atlas image,
|
||||
as alternative tiles always appear on the right of base tiles of a given atlas
|
||||
in the LayeredTileSet editor:
|
||||
|
||||
.. figure:: img/using_tilesets_configure_alternative_tile.webp
|
||||
:align: center
|
||||
:alt: Configuring an alternative tile after clicking it in the LayeredTileSet editor
|
||||
|
||||
|
||||
Configuring an alternative tile after clicking it in the LayeredTileSet editor
|
||||
Configuring an alternative tile after clicking it in the LayeredTileSet editor
|
||||
|
||||
After selecting an alternative tile, you can change any properties using the
|
||||
middle column like you would on a base tile. However, the list of exposed
|
||||
@ -643,9 +501,9 @@ properties is different compared to base tiles:
|
||||
- **Alternative ID:** The unique numerical identifier for this alternative tile.
|
||||
Changing it will break existing LayeredTileMaps, so be careful! This ID also controls
|
||||
the sorting in the list of alternative tiles displayed in the editor.
|
||||
- **Rendering > Flip H:** If ``true``, the tile is horizontally flipped.
|
||||
- **Rendering > Flip V:** If ``true``, the tile is vertically flipped.
|
||||
- **Rendering > Transpose:** If ``true``, the tile is rotated 90 degrees
|
||||
- **Rendering > Flip H:** If `true`, the tile is horizontally flipped.
|
||||
- **Rendering > Flip V:** If `true`, the tile is vertically flipped.
|
||||
- **Rendering > Transpose:** If `true`, the tile is rotated 90 degrees
|
||||
*counter-clockwise* and then flipped vertically. In practice, this means that
|
||||
to rotate a tile by 90 degrees clockwise without flipping it, you should
|
||||
enable **Flip H** and **Transpose**. To rotate a tile by 180 degrees
|
||||
@ -661,15 +519,13 @@ properties is different compared to base tiles:
|
||||
- **Y Sort Origin:** The vertical offset to use for tile sorting based on its Y
|
||||
coordinate (in pixels). This allows using layers as if they were on different
|
||||
height for top-down games. Adjusting this can help alleviate issues with
|
||||
sorting certain tiles. Only effective if **Y Sort Enabled** is ``true`` on
|
||||
sorting certain tiles. Only effective if **Y Sort Enabled** is `true` on
|
||||
the LayeredTileMap layer the tile is placed on.
|
||||
|
||||
You can create an additional alternative tile variant by clicking the large "+"
|
||||
icon next to the alternative tile. This is equivalent to selecting the base tile
|
||||
and right-clicking it to choose **Create an Alternative Tile** again.
|
||||
|
||||
.. note::
|
||||
Note:
|
||||
|
||||
When creating an alternative tile, none of the properties from the base tile
|
||||
are inherited. You must set properties again on the alternative tile if you
|
||||
wish those to be identical on the base tile and the alternative tile.
|
||||
- When creating an alternative tile, none of the properties from the base tile are inherited. You must set properties again on the alternative tile if you wish those to be identical on the base tile and the alternative tile.
|
||||
|
||||
Loading…
Reference in New Issue
Block a user