SEO Soluttions

Разработка игры на phaserjs - 5: создание мира

В прошлом уроке мы загружали изображения для нашей игры. Для загрузки изображений мы использовали метод this.image.add который под капотом создает объект для нашего изображения и добавляет его в список отображаемых объектов ( display list ) текущей сцены. В этом списке содержатся все игровые объекты. Вы можете позиционировать изображения как вам угодно Phaser будет не против.

Важное уточнение: если вы расположите изображение за пределом холста, вы не сможете его увидеть но оно будет находится в пределах сцены.

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

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

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

 
 

Добавление платформ

На данный момент наша сцена выглядит следующим образом:

 
 

давайте внесем в нее некоторое разнообразие, добавим землю и платформы. Для этого нам понадобится внести следующие изменения в функцию create:

 
 

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

 
 

для включения физики, внесите следующие изменения:

 
 

после всех изменений игровая сцена должна будет выглядеть так:

 
 

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

Продолжение читайте в статье Разработка игры на phaserjs - 6: как работают платформы?

 

О проекте

Блог посвящен созданию и продвижению сайтов в сети интернет, а также различным техническим и маркетинговым вопросам, которые так или иначе с этим связаны.