Разработка игры на phaserjs - 10: добавление звезд⁠⁠

Добрый день, уважаемые читатели.

Предыдущие уроки:

Надо что то с этим сделать но пикабу не позволяет копировать ссылки а каждый раз вставлять их в ручноую это жжжжж.

Сегодня нашей целью будет добавление в игру целей. На данный момент мы реализовали полноценный мир с землей, платформами, звездами и персонажем, но на данный момент игра не имеет никакого смысла

Давайте добавим несколько звезд на сцену и позволим игроку собирать их. Для этого мы создадим новую группу под названием «звезды» и заполним ее.

Подготовка к работе

для работы над проектом вам понадобится настроенный phaserjs и установленный nodejs. Все не обходимые файлы доступны по ссылке.

В нашей функции create мы добавляем следующий код:

Процесс похож на то, когда мы создали группу платформ. Поскольку нам нужно, чтобы звезды двигались и отскакивали, мы создаем динамическую физическую группу вместо статической.

Группы можно настраивать используя объекты конфигурации. В этом случае объект группы состоит из 3 частей:

1. Мы создаем группу объектов и помещаем ее в переменную stars;

2. Устанавливаем ключ текстуры в качестве изображения звезды. Это означает, что все дочерние элементы, добавленные в эту группу будут по умолчанию получать текстуру звезды;

3. Устанавливаем итератор равным 11. Поскольку он автоматически создает 1 дочерний элемент, повторение 11 раз означает, что в общей сложности мы получим 12 дочерних элементов, и это как раз то, что нам нужно для нашей игры.

Последняя часть - setXY - используется для определения позиции 12 дочерних элементов, которые создает группа. Каждый дочерний элемент будет размещен начиная с x: 12, y: 0 и с шагом x70. Это означает, что первый дочерний элемент будет расположен в 12 x 0, второй - в 70 пикселях от 82 x 0, третий - 152 x 0 и т. д. Значения 'step' - это действительно удобный способ разметки дочерних групп во время создания. Значение 70 выбрано, потому что это означает, что все 12 звезд будут идеально расположены на экране.

Следующий фрагмент кода выполняет обход всех элементов в группе и дает им случайное значение отказов Y в диапазоне от 0,4 до 0,8. Диапазон отскока находится между 0, отскока вообще нет, и 1, полный отскок. Поскольку все звезды появляются в точке y, гравитация будет тянуть их вниз, пока они не столкнутся с платформами или землей. Значение отскока означает, что они будут случайным образом возвращаться обратно до тех пор, пока, наконец, не успокоятся.

Если бы мы запустили код так, как сейчас, звезды упали бы сквозь землю игры и скрылись из виду. Чтобы остановить это, нам нужно проверить их столкновение с платформами. Мы можем использовать другой объект Collider для этого:

Помимо этого, мы также проверим, соприкасается ли игрок со звездой или нет:

Это говорит Phaserjs, что нужно проверить совпадение между игроком и любой звездой в группе звезд. Если они найдены, они передаются в функцию collectStar:

Проще говоря, у звезды отключено физическое тело, а ее родительский игровой объект сделан неактивным и невидимым, что убирает его с экрана.

Итог

Запуск игры теперь дает нам игрока, который может прыгать, прыгать, отскакивать от платформ и собирать звезды, падающие сверху.