Повороот камеры

Камера в Phaser играет ключевую роль при создании динамичных сцен и интерактивных миров. Она определяет, какая часть игровой сцены видна игроку в данный момент. Phaser предоставляет мощный API для управления камерами, позволяя реализовывать плавные переходы, следование за объектами, эффекты масштабирования и вращения.

Основные понятия камеры

В Phaser существует несколько типов камер, но основной является Main Camera, доступная через this.cameras.main в контексте сцены. Камера обладает следующими важными свойствами:

  • Положение (x, y) — координаты верхнего левого угла камеры в мире.
  • Размер (width, height) — область сцены, отображаемая камерой.
  • Масштаб (zoom) — коэффициент увеличения сцены. Значение по умолчанию 1.
  • Вращение (rotation) — угол поворота камеры в радианах.
  • Скроллинг (scrollX, scrollY) — смещение камеры относительно мира, используемое при следовании за объектом.

Перемещение и следование камеры

Для перемещения камеры можно использовать прямое изменение координат:

this.cameras.main.scrollX = 100;
this.cameras.main.scrollY = 50;

Однако чаще применяется метод startFollow, позволяющий камере автоматически следовать за объектом:

this.cameras.main.startFollow(player, true, 0.1, 0.1);

Параметры функции:

  • player — объект, за которым следует камера.
  • roundPixels — округление координат для предотвращения размытия.
  • lerpX, lerpY — коэффициенты сглаживания движения по осям X и Y (значения от 0 до 1). Чем ближе к 1, тем быстрее камера догоняет объект.

Для остановки следования используется метод:

this.cameras.main.stopFollow();

Поворот камеры

Ключевое свойство для вращения камеры — rotation. Значение задается в радианах:

this.cameras.main.rotation = Math.PI / 4; // поворот на 45 градусов

Для анимации поворота используется твиннинг через Camera:

this.tweens.add({
    targets: this.cameras.main,
    rotation: Math.PI,
    duration: 2000,
    ease: 'Sine.easeInOut'
});

Особенности:

  • Поворот камеры осуществляется относительно центра камеры (centerX, centerY), а не сцены.
  • Поворот влияет на все объекты, видимые камерой.
  • Одновременное масштабирование и вращение может создавать эффекты «крутящегося зума».

Масштабирование и эффекты

Для изменения масштаба используется свойство zoom:

this.cameras.main.setZoom(2); // увеличиваем в 2 раза

Можно комбинировать с поворотом:

this.cameras.main.setZoom(1.5).setRotation(Math.PI / 6);

Функции плавного изменения масштаба:

this.cameras.main.zoomTo(3, 1500); // увеличиваем до 3 за 1.5 секунды

Методы zoomTo и pan позволяют создавать динамичные переходы:

this.cameras.main.pan(400, 300, 1000, 'Power2');
this.cameras.main.zoomTo(1, 500, 'Linear');
  • pan(x, y, duration, ease) — плавное смещение центра камеры.
  • zoomTo(zoom, duration, ease) — плавное изменение масштаба.
  • ease — функция сглаживания движения ('Linear', 'Sine.easeInOut' и др.).

Ограничение движения камеры

Для предотвращения выхода камеры за пределы мира используется метод:

this.cameras.main.setBounds(0, 0, worldWidth, worldHeight);

Параметры:

  • x, y — начальные координаты зоны.
  • width, height — размеры зоны, в пределах которой камера может перемещаться.

Это особенно полезно для платформеров и top-down игр.

Эффекты камеры

Phaser поддерживает различные визуальные эффекты камеры:

  1. Shake — тряска камеры:
this.cameras.main.shake(500, 0.02);
  • 500 — длительность в миллисекундах.
  • 0.02 — сила тряски.
  1. Flash — вспышка экрана:
this.cameras.main.flash(300, 255, 0, 0);
  • 300 — длительность.
  • RGB значения задают цвет вспышки.
  1. Fade — плавное затемнение или появление:
this.cameras.main.fadeOut(1000, 0, 0, 0);
this.cameras.main.fadeIn(1000, 255, 255, 255);

Несколько камер

Phaser позволяет создавать несколько камер в одной сцене:

const cam1 = this.cameras.add(0, 0, 400, 300);
const cam2 = this.cameras.add(400, 0, 400, 300);
  • x, y — позиция камеры на экране.
  • width, height — размеры камеры.
  • Камеры могут отображать одни и те же объекты или иметь разные слои.

Методы управления для каждой камеры идентичны main камере.

Практические советы

  • Для плавного следования объектов использовать небольшие lerpX и lerpY, чтобы камера не дергалась.
  • При вращении или масштабировании проверять, что объекты остаются в кадре.
  • Ограничение камеры через setBounds предотвращает «проваливание» в пустое пространство.
  • Комбинирование pan, zoomTo, shake и fade позволяет создавать кинематографические эффекты.

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

Оглавление