Phaser - полезные советы

Часть 39: Динамическая работа с графикой на низком уровне

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

Continue Reading
HTML5 Phaser ECMAScript 6, Phaser - полезные советы

Часть 36: Мини игра «Правда или Ложь» за один день!

Закончил мини игру «правда или ложь», посмотреть можно тут. Вся сцена была создана очень быстро и эффективно, благодаря новому методу. Очень хотеться рассказать вам про него, а также как я наше способ в JavaScript создавать класс который наследует свойства и методы сразу у двух родителей. Но разумней будет сначала отшлифовать неровности в этом методе, а…

Continue Reading
HTML5 Phaser ECMAScript 6, Phaser - полезные советы

Часть 35: Динамическая формула роста награды за уровень (очков)

В игру я добавил магазин покупки сердечек, времени и энергии (я считаю этот термин больше подходит чем «сила», который я использовал ранее) за монетки. Сами монетки изначально я предполагал продавать за реальные деньги. Но так как для реализации внутренних продаж надо разобрать API для Apple и Android (возможно с нудной верификацией акаунта), я решил давать…

Continue Reading
Phaser - полезные советы

Часть 34: Как разбить код и бесплатная альтернатива TexturePacker — ShoeBox

Я с первого дня обратил внимание, что в TexturePacker есть возможность задать отступы вокруг спраита, но не понял, зачем и кому они могут понадобится. Как оказалось это критично и вот почему. При анимации размера спраита (scale), размер округляется. По этой причине Phaser иногда берет полоску толщиной в один пиксель из нижестоящего спраита (в моем случае…

Continue Reading
HTML5 Phaser ECMAScript 6, Phaser - полезные советы

Часть 33: Как быстро создавать элементы интерфейса в игре

Добавил в игру два новых окошка для экзамена: победа и поражение. Обратите внимание на заголовок окошка поражения. Я заведомо написал «победа близка», что бы ободрить игрока. Это очень важно делать! В первой версии игры, переход на новый уровень происходил по мере накопления опыта. А что бы игрок не использовал старые уроки для перехода на новый…

Continue Reading
HTML5 Phaser ECMAScript 6, Phaser - полезные советы

Часть 30: onTap который не срабатывает при swipe жесте

После решения проблемы с событиями, я приступил к реализации события onTap. Погуглимв немного я нашел, что Phaser его реализовал, но не для объектов, а для сцены: game.input.onTap. Этот недостаток мне удалось очень просто устранить. Достаточно в обработчик события onTap добавить проверку координат нажатия: Такое решение работает, если пользователь прокручивает список более 500 миллисекунд. Но на…

Continue Reading
HTML5 Phaser ECMAScript 6, Phaser - полезные советы

Часть 29: Неверное событие onInputUp при scale=0

Начну с очень хорошей новости: прототип программы по изучению слов готов! Конечно надо еще создать два других навыка, добавить сцены с сдачей/провалом экзамена, но главное мы можем играть. А играть надо, потому, что можно заметить ошибки проектирования: в окошке результата урока нет кнопки «на главную». При проектировании, я подумал о кнопке повторения урока, о запуске…

Continue Reading
Phaser - полезные советы

Часть 25: Хранение состояния игры в самих объектах

Создание игры в framework-е требует смену мышления. Для примера я возьму принцип хранения данных в играх. При проектировании не игровой программы, вы храните данные в базе, массивах и сложных структурах. А ваша задача, написать код, который будет манипулировать этими данными и выводить результат на экран, обрабатывать входящие события (то рекомендую почитать о MVC модели проектирования…

Continue Reading
Phaser - полезные советы

Часть 24: Как реализовать overflow:hidden в Phaser

В Phaser есть возможность создавать маску, для скрытия части изображения. Но еще более интересно то, что маску можно задать сразу на группу элементов. На самом деле маска применяется к каждому члену группы, а за счет того, что маска позиционируется не относительно верхнего левого угла объекта, а относительно системы координат сцены, получается эффект наложения маски на…

Continue Reading
Phaser - полезные советы

Часть 23: Полезные свойства Tween анимации

Как оказалось, в Phaser довольно продуманный механизм реализации анимации. Но есть ряд недостатков, оригинальное решение которых я пока не нашел. Вот некоторые фишки которые мне понравились больше всего: Два типа цепочки анимации Используйте цепочка анимациq в случае если вы хотите последовательно анимировать разные свойства объекта. Но если анимировать нужно одно и тоже свойство но несколько…

Continue Reading