LeCodesdocs

Tilemap

Узел тайловой сетки: атлас-текстура, нарезанная на ячейки, разложенная на равномерной сетке, загруженная один раз и отрисованная нативно с покадровым отсечением по виду — рисуй большой уровень одним узлом. Расширяет Node2D, поэтому имеет полный трансформ, иерархию и поверхность слоёв.

Обзор

TypeScript
const tiles = await Texture2D.load(asset('./tiles.png'))

const map = new Tilemap({
  texture: tiles,
  cols: 20, rows: 5,          // размер карты в тайлах
  tile: 32,                   // каждая ячейка 32×32 мировые единицы
  atlas: [8, 4],              // текстура содержит 8×4 тайла
  data: [                     // строка 0 = ВЕРХНЯЯ строка; -1 = пусто
    -1, -1, -1, /* … cols*rows элементов … */
     0,  1,  1, /* … */
  ],
})
map.position = [0, 0]         // НИЖНИЙ-ЛЕВЫЙ угол карты
scene.add(map)

Создание

TypeScript
new Tilemap(options: {
  texture: Texture2D
  cols: number                     // ширина карты в тайлах
  rows: number                     // высота карты в тайлах
  tile: number | [w, h]            // экранный размер ячейки в мировых единицах (число = квадрат)
  atlas: [atlasCols, atlasRows]    // как текстура нарезана на тайлы
  data: number[] | Int32Array      // построчные индексы атласа, длина cols*rows; -1 = пусто
})

map.cols, map.rows                 // только чтение
  • data — построчно, строка 0 сверху карты (читается как текст уровня в исходнике), хотя мировой Y смотрит вверх.
  • Индексы атласа тоже считаются построчно по сетке атласа: 0 — верхний-левый тайл атласа.
  • position узла — нижний-левый угол карты.

Редактирование ячеек

TypeScript
map.setTile(x: number, y: number, index: number): this   // координаты сетки как в data (строка 0 = верх)

Устанавливает одну ячейку в индекс атласа (-1 очищает). Дёшево — сетка живёт нативно.

Ограничения

Tilemap — это статическая равномерная сетка. Не предоставляется (на момент текущего исходника):

  • анимированные тайлы — меняй ячейки сам через setTile при необходимости
  • коллизия на тайл — строй коллизию уровня отдельно, напр. невидимые Node2D с боксами/сегментами Shape2D и статическими телами Physics2D
  • отражение/поворот на тайл — запеки зеркальные/повёрнутые варианты в атлас

Смотрите также

  • Node2D — трансформ, слой (унаследованы).
  • Texture2D — загрузка атласа.
  • 2D-физика — статическая геометрия коллизий для уровней.
  • Scene2D — слои, Y-сортировка.
← НазадФизика 2DДальше →Texture2D