Как заставить игру Phaser автоматически заполнять окно?

Как заставить игру Phaser автоматически заполнять окно браузера? (И в идеале автоматически пополняться, если размер окна изменяется.) Я знаю, что существует класс ScaleManager но в документах не ясно, как его использовать. Я также нашел другие инструкции но они не указывают, куда добавить предлагаемый код, и запуск его сразу после создания класса Game ничего не дает.

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


javascript phaser-framework
person curiousdannii    schedule 23.11.2014    source источник

Ответы (3)


arrow_upward
4
arrow_downward

Оказывается, это довольно просто, вам просто нужно запустить этот код в функции предварительной загрузки или создания (а не сразу после создания экземпляра игры, как я пытался).

this.scale.scaleMode = Phaser.ScaleManager.SHOW_ALL;
//this.scale.pageAlignHorizontally = true;
this.scale.pageAlignVertically = true;
this.scale.setScreenSize( true );

Обратите внимание, что установка для this.scale.pageAlignHorizontally значения true фактически испортит горизонтальное выравнивание, если вы сделаете игру полноэкранной. Вместо этого вы можете центрировать холст с помощью css:

canvas { margin: 0 auto; }
person curiousdannii    schedule 25.11.2014
comment
this.scale.setScreenSize( true ); не работает в новой версии Phaser. Тогда что следует использовать? - person Shohanur Rahaman; 02.09.2015
comment
@ShohanurRahaman Не знаю, извините, вы должны задать новый вопрос для новой версии. - person curiousdannii; 02.09.2015

arrow_upward
1
arrow_downward

Вы можете перезаписать метод setShowAll в ScaleManager
По умолчанию эта функция имеет параметр if, который включает «расширение»,
расширение — это параметр, для которого устанавливается значение true, если вы переходите в полноэкранный режим.
Но так как мы всегда хотим «расширить», я просто удалил if.

module.exports = function () {

  Phaser.ScaleManager.prototype.setShowAll = function () {
    let bounds = this.getParentBounds(this._tempBounds);
    let width = bounds.width;
    let height = bounds.height;
    let multiplier = Math.max((height / this.game.height), (width / this.game.width));

    this.width = Math.round(this.game.width * multiplier);
    this.height = Math.round(this.game.height * multiplier);
  };

  window.Game.scale.scaleMode = Phaser.ScaleManager.SHOW_ALL;
};

это убивает возможность обновления, но работает

person ceed    schedule 14.05.2017

arrow_upward
0
arrow_downward

Прямо сейчас (Phaser 2.4.4) вы делаете это, просто устанавливая режим масштабирования, например, в вашей функции создания:

game.scale.scaleMode = Phaser.ScaleManager.SHOW_ALL;

game.scale.scaleMode управляет масштабированием игры, когда НЕ находится в полноэкранном режиме.

http://phaser.io/docs/2.4.4/Phaser.ScaleManager.html#scaleMode

person Richard    schedule 21.01.2016