Jump to content
This forum will be closing down. Please move to the respective dedicated project forums.

Resize window while using Phaser


bali33
 Share

Recommended Posts

Hi all


 


thanks for the great work on Phaser .


 


I have a weird issue while using phaser, on a classic way, that I can't reproduce with the examples on phaser.io.


Here is my app : http://www.fredericl...lic/resize.html


 


- on chrome under Mac OS


- enable the chrome toolbar


- enable the viewport rendering


- choose iphone device on LANDSCAPE mode 


- scroll down to the window


- that try to resize de window, and you are directly redirect to the top, why ?


 


All my functions create(), init(), preload() are empty.


I tried game.scale.scaleMode = Phaser.ScaleManager.NO_SCALE; without any changes.


 


This can explain this strange redirection on a "reel" iphone, sometimes, user are redirected to the top.


 


Please do you have any idea to understand this behaviour ? 


 


Many thanks


Link to comment
Share on other sites

Hi,

 

Actually this behavior happens on phone - I guess it has to do about the address bar which is often automatically hidden on phone browser which seems to be equivalent to a re-size behavior. Whatever is the reason this is happening on all iphone I tested and this is an issue for me.

 

Any idea ?

 

Thank you

Link to comment
Share on other sites

Hi guys,

 

I did some test and I found out that the bug appears when the scaleMode is set to SHOW_ALL and not when set to RESIZE. Not sure if it's related but the "preload" function must exist or the bug appears in both scaleMode.

 

I really need help on this because this bug is really annoying when I try to run my app on mobile.

 

Thank you

var BasicGame = {};window.onload = function() {    var game = new Phaser.Game( 856 , 428 , Phaser.AUTO, 'app_canvas');	game.state.add('Boot', BasicGame.Boot);	game.state.start('Boot');};BasicGame.Boot = function (game) {    console.log("boot");};BasicGame.Boot.prototype = {    init: function () {        //this.scale.scaleMode = Phaser.ScaleManager.RESIZE;        this.scale.scaleMode = Phaser.ScaleManager.SHOW_ALL;    },    preload: function () {    }};
Link to comment
Share on other sites

Hi guys

Working on the same project with these tow fellow :)

this is really annoying and will prevent the projet to be approved by our client !

 

We made games with PIXI before and do not have the same issue with them.

 

To bring you more infos about our investigations I have also tried with other scales modes.

The "jump to top" occurs on most of them :

  • EXACT_FIT : jumps to top :(
  • NO_SCALE : No jump... but we make a responsive game so needs to to rescale
  • RESIZE : No jump. But if the canvas rescale in width (actually the parent div rescales to 100%) it does not maintain aspect ratio + the content does not scale to fit the viewport... 
  • SHOW_ALL : jumps to top
  • USER_SCALE : jumps to top

More over, I tried to manually change the size. Whatever I tried (such as game.renderer.resize) any change in the scale will make the window jumps to top. Maybe related with that...

Link to comment
Share on other sites

It will always window.scrollTo unless explicitly told not to:

game.scale.compatibility.scrollTo = false;

Which needs setting after the game has booted. Alternatively override Phaser.ScaleManager.prototype.scrollTop with an empty function.

 

If you've built a properly responsive game you should be using the RESIZE scale mode and handling all internal scaling yourself. RESIZE will never have an incorrect aspect ratio because it will always be set to 100% width and height of the parent container, it's always 1:1.

 

 

We made games with PIXI before and do not have the same issue with them.

 

That's because Pixi doesn't do any scaling at all. So you must have written your own code to handle all the scaling yourself - so disable the scale manager in phaser and add in whatever code you had before in Pixi that worked so well.

Link to comment
Share on other sites

Hi,

 

First of all thank you for your answer - About using the RESIZE scaleMode we tried to, but when the resize state function is called we tried to manually set the game scale ratio using the game.scale.setUserScale function but it seemed to not work as expected because nothing happened and the game wasn't scaled. Any idea why ?

 

Thx

Link to comment
Share on other sites

thank you

We missed that part in the documentation. I wish I made a search on "scroll" I would have figure out how to solve that!

 

I just want to add that I am not saying pixi is better or whatever. I wanted to mention that the issue we were having was specific to phaser (we would not have changed from pixi to phaser if we were not convinced that Phaser is far more adapted to our game developments)

Link to comment
Share on other sites

 Share

  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...