Это неизбежно, верно?

Если кто-то только начинает работать разработчиком игр, он обязательно сделает какой-нибудь платформер. Они, вероятно, попытаются воссоздать первую игру Марио, в которую они играли, или, если они общительны, возможно, они попытаются создать какую-то упрощенную Метроидванию. Куда бы вы ни пошли, у вас почти наверняка будет какой-то персонаж, которым вы управляете, которому нужно будет прыгать, карабкаться, кувыркаться или иным образом оказаться на платформе, которая либо выше, либо ниже, либо через отрыв от того места, где они сейчас стоят. Это, дамы и господа, называется платформером.

Так что же я сделал?

Ну я сделал это:

Теперь это далеко не полная игра, но то, что вы видите, это мир с 2 платформами и управляемым персонажем. Большой красный прямоугольник — это форма отладки, показывающая контур спрайта игрока. Белый цвет, который вы видите из-под него, — это спрайт, который я использовал для тестирования. Меньший красный квадрат показывает, какого блока в данный момент касается спрайт игрока. В левом верхнем углу вы видите вывод отладки для спрайта игрока, включая его текущее местоположение, размер, точку привязки и видимость.

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

Здесь я использую функцию рендеринга Phaser, чтобы включить отладочную информацию. Он вызывается после того, как игра отрендерит все спрайты и то, что у вас есть, и особенно полезен для применения эффектов постобработки. Первая строка просто выводит всю информацию о спрайте, о которой я упоминал ранее, а Phaser.Rectangle — это красная фигура поверх спрайта игрока.

Поскольку отладка — это скучно, давайте рассмотрим, как мне удалось настроить и запустить остальную часть.

Игрок

Это было немного сложнее, чем управление веслом в Breakout, но все же очень легко для любого уровня навыков. Поскольку на этот раз я решил использовать спрайт-лист для игрока, нам нужно изменить способ загрузки нашего изображения.

Вместо game.load.image(), который я использовал, мне пришлось изменить его, чтобы вызвать game.load.spritesheet(), чтобы Phaser мог разделите спрайты для легкого доступа для меня вместо того, чтобы делать это вручную. Итак, как и в прошлый раз, я предоставляю простой тег для ссылки на этот лист спрайтов («спрайты игроков»), местоположение файла, а также ширину и высоту каждого спрайта. Как вы можете понять по странному размеру, я не нашел наилучшего листа спрайтов для тестирования, но на данный момент этого достаточно. Что бы ни.

Хотя большая часть этого была показана в примере Breakout, новые элементы, о которых стоит беспокоиться, — это линии анимации. Первый — добавить, который добавит анимацию с заданным именем (постоянным) и массивом кадров, из которых состоит анимация. Кроме того, вы также можете указать параметры для установки частоты кадров анимации и того, следует ли зацикливать анимацию.

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

Управление игроком

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

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

Здесь я увеличиваю или уменьшаю горизонтальную скорость физического тела персонажа игрока, чтобы игроку было достаточно легко маневрировать. Пока одна из кнопок нажата, я настроил ее на постоянное увеличение скорости в нужном направлении до maxVelocityX, которую я установил. Кроме того, я отслеживаю, в каком направлении смотрит игрок, когда нажата одна из клавиш, и использую эту информацию, чтобы знать, когда нужно напрямую установить скорость, а не увеличивать/уменьшать ее. Вы также заметите, что когда ни одна из кнопок не нажата, я применяю отрицательную скорость относительно текущего направления движения. Другими словами, я замедляю игрока, когда движение не нужно.

Но как насчет прыжков?

Полегче парень. Ну, в основном легко. Во-первых, прыгайте, когда нажата кнопка прыжка, и не позволяйте прыгать, если игрок уже находится в середине прыжка:

Метод прыжка так же прост:

Однако одна вещь, которой я все еще не доволен, — это когда отключать прыгающий флаг. Первоначально я установил что-то странное, что позволяло игроку прилипать к нижней стороне платформ, если вы удерживали кнопку прыжка. Хотя это можно было бы превратить в крутую механику, это было не то, что я искал. Я пытаюсь исправить это сейчас, но вот что у меня есть:

Я проезжаю через все блоки в мире, чтобы проверить, нет ли коллизий. Это нормально, я должен сделать это в любом случае, чтобы убедиться, что игрок ничего не проходит. Я отключаю флаг прыжка, если позиция игрока y ниже или на том же уровне, что и сталкивающийся блок. Это работает для блоков под игроком, но не работает для блоков рядом с игроком. В итоге вы сможете прилипнуть к стене. Опять же, может быть забавная механика, но не то, что я ищу. Я доработаю движение в следующей версии. А пока давайте посмотрим, как устроен мир.

Мир, каким мы его знаем

Хотите верьте, хотите нет, но настроить игровой мир было невероятно просто:

Все, что делает эта строка, — устанавливает верхний левый угол мира (0, 0), а также ширину и высоту мира. Блоки были размещены в мире так же, как я установил их в Breakout:

Это настолько похоже, что в нем используется та же функция createBlock, что и в реализации Breakout.

Как только размер мира установлен и все размещено в нем, просто включите физическую систему, и все готово:

Что дальше?

Уточнение. Движение игрока довольно твердое, но этот прыжок нужно исправить. Кроме того, мне нужно добавить больше анимаций в проигрыватель и синхронизировать их соответствующим образом. Оттуда, кто знает. Может быть, я каким-то образом добавлю те механические идеи, которые были раньше, или, может быть, я добавлю какого-то врага, с которым персонаж будет иметь дело. Что бы это ни было, это будет весело, и я объясню, как я это сделал.

Как обычно, играть в игру можно здесь, а код можно найти здесь. Наслаждаться!

Если у вас есть какие-либо вопросы, комментарии или проблемы, просто дайте мне знать. С удовольствием отвечу на все и вся. Ставьте лайки, делитесь и следите за новостями, и в конце концов мы все станем разработчиками игр.