У меня был простой глобальный объект для создания прямоугольников на лету. Он использовал Phaser.Graphics для рисования, а затем рендерил текстурку. Все было хорошо, но когда я захотел собрать из текстурок индикатор — пошла такая невыносимая и тупая пурга, что хотелось напиться.
Оказалось, что Phaser.graphics, когда рисует и рендерит — создает текстурку размером во весь экран. И пофиг, что у вас там крохотный прямоугольник, в свойствах все равно будет FullHD. Пришлось переделать генератор на BitmapData. Выглядит он сейчас таким образом:
1 2 3 4 5 6 7 8 9 10 11 12 13 |
var ImageBuilder = {}; ImageBuilder.createTexture = function (game, width, height, color) { var bitmapData = game.add.bitmapData(width, height); bitmapData.ctx.fillStyle = color; // цвет в формате "#ffffff" bitmapData.ctx.fillRect(0,0,width,height); return bitmapData; }; ImageBuilder.createImage = function (game, x, y, width, height, color) { var bitmapData = this.createTexture(game, width, height, color); var image = game.add.image(x, y, bitmapData); return image; }; |
Это удобно для минималистичного дизайна. Слишком жирно для таких вещей отдельные текстурки в фотошопе выводить — как и для равномерных заливок.
Я создаю фон и полоску с помощью ImageBuilder
1 2 |
this.levelBarBg = ImageBuilder.createImage(game, x, y, width, height, R.colors.PROGRESS_BAR_BG); this.levelBarKnob = ImageBuilder.createImage(game, x, y, width, height, R.colors.PROGRESS_BAR); |
И когда меняю показания — меняю масштаб полоски
1 2 3 4 5 6 |
LevelBarWidget.prototype.setCurrentExperience = function (exp) { this.data.currentExp = exp; this.levelBarText.setText(this.getFormattedExperienceString()); this.levelBarKnob.scale.setTo(this.data.currentExp / this.data.totalExp, 1); return this; }; |
На этом изменении масштаба все и ломалось раньше. Теперь все норм, полоски работают.
Странно, что в игровых фреймворках часто нет таких элементарных вещей, как сгенерировать цветной квадрат на правах полноценного объекта. Плохо, когда куча времени уходит на борьбу с недокументированной фигней.
Резал бы прямоугольники в фотошопе — не терял бы время. Иногда, похоже, проще работать, как китайский (индусский) кодер.
Тебе как любителю настоящей оптимизации пойдет на пользую NineSlice плагин. Я правда его сегодня переделал в одну функцию и добавил своему UI генератору, что бы он все за меня делал, если имя файл кончается на .9 Могу на почту кинуть рабочий код.
а может, лучше на GitHub положить?
я заметил, что с него даже Яндекс ссылки индексирует (если в README.md в корне написать ссылку).
Я вообще думаю некоторые общие функции так собрать и пакетом на GitHub выложить, со ссылкой, что мол используется в таких-то проектах. Я не жду, что это даст заметный эффект в плане продвижения игры, но все равно собираюсь сделать.
Я меньше всего рассчитываю что гугл что-то пришлет. Игроков буду тупо покупать… На вот эту оч полезную функцию я потратил пару часов, так как были сложности с PIXI и ни как не удавалось скопировать куски битмапа. При этом все надо было делать быстро… сейчас я генерю спраит попап любого размера без каких либо задержек (тестировал на своем старом смартфоне). Выложить то мне не жалко, но обидно когда даже спасибо не говорят =)
Функция ушла на почту, можешь ее отсюда удалять =)