jsbook.ru

Добрый день, уважаемые читатели. В прошлом уроке мы добавили в игру счётчик очков, очки начисляются за каждую собранную звезду, таким образом наша игра приобрела некий смысл. В данном уроке мы добавим фоновую музыку и озвучку процесса сбора звезд. Идея такая: При старте уровня запускается фоновая музыка и играет на протяжении всего уровня. При соборе звезд так же будет проигрываться музыкальный файл. Таким образом наша игра станет более интерактивной и живой. Таким образом нашей задачей будет набрать как можно больше очков и не умереть...

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

В данном уроке мы добавим счётчик очков в нашу игру.

Сегодня нашей целью будет добавление в игру целей. На данный момент мы реализовали полноценный мир с землей, платформами, звездами и персонажем, но на данный момент игра не имеет никакого смысла. Давайте добавим несколько звезд на сцену и позволим игроку собирать их. Для этого мы создадим новую группу под названием «звезды» и заполним ее. Подготовка к работе для работы над проектом вам понадобится настроенный phaserjs и установленный nodejs. Все не обходимые файлы доступны по ссылке. В нашей функции create мы добавляем следующий код: Процесс похож на то, когда мы создали группу платформ...

В прошлом уроке мы добавили обработку столкновений с объектами которая работает хорошо. Однако на данный момент у нас нет возможности управлять нашим персонажем. Возможно вы подумали что сейчас нам нужно обратится к документации и поискать в ней как можно прослушивать события в Phaserjs, однако в этом нет необходимости т.к в Phaserjs есть удобный менеджер клавиатуры. Подготовка к работе для работы над проектом вам понадобится настроенный phaserjs и установленный nodejs. Все не обходимые файлы доступны по ссылке...

Добрый день, сегодня мы поговорим о такой непростой вещи как физика тела в игровом мире. Phaser поддерживает различные физические системы, каждая из которых выступает в качестве плагина, доступного для любой сцены Phaser. На момент написания статьи Phaser поставляется с Arcade Physics, Impact Physics и Matter.js Physics. Для этого урока мы будем использовать систему Arcade Physics для нашей игры, которая проста и легка, идеально подходит для браузерных игр. Когда Физический Спрайт создан, ему присваивается свойство body, которое является ссылкой на его Аркадное Физическое Тело...

Всем привет! В прошлом уроке мы добавили платформы на нашу сцену: эти платформы нужны для того что бы наш персонаж мог перемещаться по ним, однако на данный момент у нас нет игрового персонажа. В этом уроке мы добавим игрового персонажа, поговорим о спрайтах и о том как их анимировать. Подготовка к работе для работы над проектом вам понадобится настроенный phaserjs и установленный nodejs. Все не обходимые файлы доступны по ссылке. Создание персонажа Для работы с персонажем нам понадобится переменная...

Всем привет! В ходе предыдущего урока мы добавили платформы на нашей игровой сцене: Для этого мы добавили много кода в нашу функцию create: давайте разберемся за что отвечает этот код: Эта инструкция создает новую группу которая отвечает за управление статическими объектами и сохраняет ее в переменную platforms. В Аркадной физике существует два типа физических тел ( объектов ): Статичные тела, являются статичными по природе. И идеально подходит для площадки и платформ, на которых мы собираемся позволить игроку бегать...

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

В этом уроке мы сделаем загрузку необходимых ресурсов для нашей игры. Подготовка к работе Для начала нам нужно создать отдельную ветку для этой игры в нашем стартовом шаблоне ( если у вас его нет его можно скачать здесь ). Находясь в корне нашего проекта создадим новую ветку: Загрузка ресурсов Для загрузки всех необходимых для нашей игры мы будем использовать метод жизненного цикла сцены preload, для этого переходим по пути src/index.ts находим функцию preload: и заменяем ее содержимое на: данный...

После того как мы выбрали редактор, скачали и запустили наш проект. Пришло время создать что нибудь простое и убедится что все действительно работает. Для начала переходим в папку с нашим проектом: и запустим наш проект: после запуска вы должны увидеть: если возникли какие то ошибки то пишите в комментарии попробуем их решить совместно. Добавляем новые ресурсы В файле index.ts находим блок кода: и заменяем его на: в данном коде мы в качестве базового пути указали http://labs.phaser.io здесь размещаются ресурсы которые используются для лабораторных работ...

Для того что бы писать код нашей игры нам нужен редактор кода. В мире есть множество редакторов кода у каждого из них есть сильные и слабые стороны. В данной статье мы рассмотрим несколько редакторов которые вы можете использовать для разработки. Visual Studio Code ( Рекомендуемый ) На данный момент пожалуй один из лучших редакторов для работы с JavaScript и Typescript, является полностью бесплатным. Для редактора написано огромное количество плагинов которые позволяют добавить в редактор не только поддержку других языков, но так же и музыкальный плеер, парсер тудушек и много чего еще...