azerion / phaser-input

Adds input boxes to Phaser like CanvasInput, but also works for WebGL and Mobile, made for Phaser only.
MIT License
201 stars 64 forks source link

Mobile Keyboard - Disable resizing #39

Closed roskhill closed 7 years ago

roskhill commented 7 years ago

In the documentation it mentions that a good solution to the mobile on-screen keyboard triggering a resize event is to disable resizing if a static property is set..

Also, when the keyboard is shown, sometimes a resize event will be triggered. Ideally you use a custom resize event, check for the static property PhaserInput.KeyboardOpen and don't resize when it's set to true.

I have this so far but am struggling to work out how to actually disable the resize in Phaser..

 window.addEventListener("resize", function(event){
            if ( PhaserInput.KeyboardOpen == true )
            {
                // Disable Resize
            }
        });

Am I on the right track or is there a better way to do this?

AleBles commented 7 years ago

Compared to what I have in our games you are in the right track indeed.

First of all, for mobile we use scaleMode = Phaser.USER_SCALE, basicly making sure you manage the scaling of the game yourself.

So take the code you already have and then you extend it a bit with the scaling stuff:

window.addEventListener("resize", function(event){
    if ( PhaserInput.KeyboardOpen == true ) {
        return;
    }
    //Calculate new width and height
   var width = window.innerWidth * fancyScale,
         height = window.innerHeight * fancyScale;

    //Set the new sizes
    game.scale.setGameSize(width, height);
});