Использование тайловых карт
Использование тайловых карт - это простой и быстрый способ создания 2D уровней. Все сводится к тому, что вы взаимодействуете с набором тайлов (tiles
) - одинаковых плиток, которые могут быть помещены на графическую сетку столько раз, сколько нужно - представьте, что работаете с редактором карт, собирая карту из состыкующихся друг с другом фрагментов:
К тайлам могут быть добавлены коллизии, что позволит расширить взаимодействие объектов с тайлами в игровом 2D мире.
Создание тайла
В первую очередь нужно создать набор тайлов (tileset
). Ниже представлены изображения, которые мы будем использовать. По соображениям оптимизации все они собраны в одном изображении (“упакованы” на одну текстуру). Благодаря “упаковке” мы можем собрать воедино несколько спрайтов и получить палитру тайлов.
Создайте новый проект в Godot и переместите подготовленное изображение (в формате PNG) в каталог проекта. Затем, в окне импорта изображения, в настройках импорта, отключите Filter
, чтобы в последствии избежать проблем с “артефактами”. Mipmaps
также должен быть отключен, если нет, отключите его.
Создадим ресурс TileSet
. Хотя этот ресурс изначально содержит все свойства текстуры, довольно сложно каждый раз редактировать их. Вот как это будет выглядеть при просмотре настроек ресурса:
Достаточно много свойств. Хоть этот вариант и рабочий, но уйдет довольно много времени на использование данного способа. Самый простой вариант использовать и настраивать набор тайлов, а для этого нужно экспортировать его из специально созданной сцены!
Сцена TileSet
Создайте новую сцену с корневым узлом Node
или Node2D
. Для каждого тайла, который вы хотите создать, добавьте узел спрайта в качестве дочернего элемента. Так как плитки имеют размер 50x50, вы должны включить сетку (View -> Show Grid
или клавиша G
) и включить привязку (иконка Use Snap
или клавиша S
). Перемещение тайлов с помощью мыши может быть неточным, удобней использовать клавиши стрелок.
Если в исходном изображении несколько тайлов, обязательно используйте свойство Region Rect
, чтобы настроить, какая часть текстуры должна использоваться.
Наконец, задайте имя спрайта. Это гарантирует, что при последующих изменениях в наборе тайлов (например, при добавлении коллизии, изменении области и т. д.), Тайл будет по-прежнему правильно идентифицироваться и обновляться. Его имя должно быть уникальным!
Большая часть требований, отражено на скриншоте ниже:
Продолжайте добавлять все тайлы, при необходимости корректируя смещения (если у вас несколько фрагментов в исходной текстуре). Важно помнить, что их имена должны быть уникальными.
Коллизии
Чтобы добавить коллизии к тайлам, создайте дочерний элемент StaticBody2D
для каждого спрайта. Это статический узел обработки столкновений. Затем создайте CollisionShape2D
или CollisionPolygon
в качестве дочернего элемента StaticBody2D
. Рекомендуется использовать CollisionPolygon
, его легче редактировать.
Наконец, отредактируйте CollisionPolygon
, что позволит использовать коллизии и уберет значок предупреждения рядом с этим узлом. Используйте привязку к сетке используя Snap
. Убедитесь, что края полигона столкновений выровнены по краям тайла правильно (для редактирования используйте вершины полигона), это позволит персонажу беспрепятственно идти от тайла к тайлу. Важно! Не масштабируйте и не двигайте сам узел полигона. Параметры, относительно родительского спрайта, должны быть: Offset - 0,0
, scale - 1,1
и rotation - 0
.
Добавьте коллизии для всех тайлов. Обратите внимание, BG
- всего лишь фон, и он не использует коллизии.
ОК! Все сделано! Сохраните эту сцену для возможности редактирования в будущем. Назовите его tileset_edit.scn
или как-то в этом роде.
Экспорт TileSet
В созданной и открытой сцене следующим шагом будет создание набора тайлов. В меню Scene
выберите Scene> Convert To> Tile Set
:
Затем выберите имя файла, например, mytiles.tres
. Убедитесь, что включена опция Merge With Existing
. Таким образом, каждый раз, когда файл с тайлами перезаписывается, все существующие тайлы обновляются (определяются по уникальному имени, называйте свои тайлы правильно!).
Использование набора тайлов в тайловой карте
Создайте новую сцену, используя Node или Node2d, а затем создайте TileMap
в качестве дочернего элемента.
Перейдите в свойства TileSet
этого узла и укажите созданный ранее набор тайлов:
Также установите размер ячеек 50
(это размер тайлов). Quadrant (квадрант) - это настраиваемое значение, которое указывает сколько тайлов должен рисовать движок и выводить на видимую область экрана, по умолчанию оно равно 16х16
. Это значение изначально настроено правильно и не нуждается в изменении, но в определенных случаях, для точной настройки производительности можно прибегнуть к редактированию этого параметра (если вы знаете, что делаете).
Картина вашего мира
Убедитесь, что выбран узел TileMap
. На экране появится красная сетка, позволяющая рисовать на ней выбранный тайл, который расположены на палитре слева.
Чтобы избежать случайного перемещения и выбора узла tilemap
(учитывая, что это огромный узел), рекомендуется заблокировать его, используя кнопку блокировки:
Если вы случайно разместили тайл не там, где хотели, всегда можно удалить его с помощью правой кнопки мыши в редакторе tilemap
.
Вы также можете перевернуть и повернуть спрайты в редакторе TileMap
(примечание: отражение спрайтов в TileSet
не будет иметь должного эффекта). Значки в углу редактора позволяют “отзеркалить” и повернуть выбранный в настоящий момент тайл - вы также можете использовать клавиши A и S, чтобы отразить спрайт по горизонтали и по вертикали. Но для некоторых видов плиток отражение может быть удобной и компактной функцией.
Артефакты смещения и масштабирования
Использование одной текстуры для всех фрагментов тайлового набора, скорее всего, приведет к артефактам:
Это неизбежно, т.к. обусловлено спецификой работы аппаратного билинейного фильтра. Итак, чтобы избежать этой ситуации, есть несколько обходных решений. Используйте то, которое вас устроит:
-
Отключить
Filter
иMipmaps
для текстуры плитки или всех текстур в окне настроекИмпорта изображений
. -
Включить
Pixel Snap
(установите значениеtrue
).Project > Project Settings > Rendering > Quality > 2d > Use Pixel Snap
-
Часто помогает масштабирование посредством уменьшения карты через
Viewport
. Хорошей отправной точкой может послужить простое добавление 2D камеры, и с помощью включенияCurrent
и игры с параметромZoom
добиться нужного результата. -
Вы можете использовать отдельное изображение для каждого тайла. Это позволит удалить все артефакты, но данный способ скажется на производительности и времени, которое будет затрачено.
http://docs.godotengine.org/en/3.0/tutorials/2d/using_tilemaps.html