О чем этот пример

Работа с координатами — фундаментальная задача в игровой разработке. Метод `setTo()` класса `Phaser.Math.Vector2` предоставляет гибкий и лаконичный способ задания позиций точек, объектов и векторов направления. Этот подход не только улучшает читаемость кода, но и помогает избегать ошибок при обновлении координат в динамичных сценах, например при перемещении персонажа или расчёте траекторий. Понимание всех вариантов использования метода позволит вам писать более чистый и эффективный код для игровой логики.

Версия Phaser: код и демо в этой статье рассчитаны на Phaser 3.90.0.

Живой запуск

Ниже встроен рабочий билд примера. Оригинальный источник: GitHub.

Исходный код


class Example extends Phaser.Scene
{
    create ()
    {
        const graphics = this.add.graphics({ fillStyle: { color: 0x2266aa } });

        const point = new Phaser.Math.Vector2(400, 300);
        graphics.fillPointShape(point, 10);

        point.setTo();
        graphics.fillPointShape(point, 15);

        point.setTo(100);
        graphics.fillPointShape(point, 20);

        point.setTo(200, 100);
        graphics.fillPointShape(point, 25);
    }
}

const config = {
    width: 800,
    height: 600,
    type: Phaser.AUTO,
    parent: 'phaser-example',
    scene: Example
};

const game = new Phaser.Game(config);

Что такое Vector2 и зачем он нужен

В Phaser класс Phaser.Math.Vector2 представляет собой двумерный вектор. Он широко используется для описания координат точки на плоскости (x, y), а также для задания направлений, скоростей и других физических величин. В отличие от хранения координат в простых переменных, работа через Vector2 предоставляет множество полезных методов для математических операций.

// Создание вектора (точки) с начальными координатами
const point = new Phaser.Math.Vector2(400, 300);

В данном примере создаётся вектор, представляющий точку с координатами x=400, y=300. Это центр сцены для конфигурации 800x600. Этот вектор и будет основным объектом для манипуляций.

Базовое использование метода setTo()

Метод setTo() — это основной способ изменения координат существующего вектора. Он заменяет текущие значения `xиyна новые. Главное преимущество — отсутствие необходимости создавать новый экземплярVector2` при каждом изменении позиции, что экономит ресурсы.

В примере из исходника видно, как точка последовательно рисуется с разными координатами и размерами.

// Сначала рисуем исходную точку (400, 300)
graphics.fillPointShape(point, 10);

После этого к вектору point применяется метод setTo() с разными аргументами, что мгновенно меняет его внутреннее состояние.

Различные сигнатуры вызова метода setTo()

Метод setTo() поддерживает три варианта вызова, что делает его чрезвычайно гибким. В исходном примере демонстрируются все три способа.

1. **Вызов без аргументов:** Устанавливает координаты вектора в (0, 0).

point.setTo(); // Теперь point.x = 0, point.y = 0
    graphics.fillPointShape(point, 15); // Рисуем в левом верхнем углу

2. **Вызов с одним аргументом:** Устанавливает обе координаты `xиy` в одно переданное значение. Это полезно для размещения объектов на диагонали или сброса в одну точку.

point.setTo(100); // Теперь point.x = 100, point.y = 100
    graphics.fillPointShape(point, 20); // Рисуем точку по координатам (100, 100)

3. **Вызов с двумя аргументами:** Классический способ задать координаты независимо. Это самый частый сценарий использования.

point.setTo(200, 100); // Устанавливаем point.x = 200, point.y = 100
    graphics.fillPointShape(point, 25); // Рисуем точку по новым координатам

Используя нужную сигнатуру, вы можете уменьшить количество строк кода и сделать намерения более понятными.

Практическое применение в играх

Где это может пригодиться? Практически везде, где объект меняет позицию.

* **Телепортация объекта:** Мгновенное перемещение спрайта или зоны взаимодействия в новую точку. * **Сброс позиции:** Возврат снаряда, врага или игрока на стартовую позицию (например, setTo(0, 0) или setTo(spawnX, spawnY)). * **Обновление цели для ИИ:** Переназначение точки, к которой движется неигровой персонаж. * **Работа с физикой:** Обновление вектора скорости или ускорения тела (body.setVelocity() часто принимает Vector2).

Важно помнить, что setTo() изменяет исходный вектор, а не создаёт новый. Это называется "мутабельный" (изменяемый) метод. Если вам нужно сохранить старое значение, предварительно скопируйте вектор с помощью .clone().

Что попробовать дальше

Метод setTo() — это простой, но мощный инструмент для управления координатами в Phaser. Его различные формы вызова помогают писать лаконичный и выразительный код. Для экспериментов попробуйте: 1. Создать анимацию перемещения объекта, циклически вызывая setTo() с новыми координатами внутри update(). 2. Использовать метод для задания контрольных точек кривой Безье при расчёте траектории полёта. 3. Комбинировать setTo() с другими методами Vector2, например add() или scale(), для сложных перемещений.