Jump to content

Redraw State without Restarting It


Recommended Posts



As my game gets the entire window proportionally, I draw more or less stuff depending on the width of the window. It's ok but when I start the game on small window then I resize it, part of the game area stay blank 'cause I just drawed in the start size.

So, to get the result I want, by now, when the window resizes I redraw all by restarting the state:

    window.onresize = function() {        gameRatio = window.innerWidth / window.innerHeight;        //my default size is 240x160        GAME.scale.setGameSize(Math.ceil(160 * gameRatio), 160);        GAME.state.start(GAME.state.current);    };

The problem is: if the player resizes the window during a gameplay, the state is restarted and he looses what he/she was doing...


Is there any other way to redraw all objects when window resizes?




Link to comment
Share on other sites

You're handling the problem the wrong way. You shouldn't be trying to refresh your state with the correct size : instead you should set a scale mode to your game. This will automatically handle any window change.


Try to put this in the preload() method of your state : 

game.stage.scaleMode = Phaser.StageScaleMode.SHOW_ALL; // You can try EXACT_FIT as wellgame.stage.scale.setShowAll();game.stage.scale.refresh();

See this post : http://www.html5gamedevs.com/topic/1380-how-to-scale-entire-game-up/

Link to comment
Share on other sites

Hi Skeptron! That didn't worked either...


I will explain a little more aboute my code and the problem:


I wanted to have my game to show more or less of the content depending on the screen size, so, as more wider a screen, more is shown horizontally. I have this effect on raw JS programming but I wanted to redo my games with Phaser. So, what I do when creating the game screen is:

//prepara o tamanho do jogogameRatio = window.innerWidth / window.innerHeight;//cria novo jogoGAME = new Phaser.Game(Math.ceil(160 * gameRatio), 160, Phaser.CANVAS);

That is good and starts the game taking all the window. I'm also setting my scale mode to

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

to get all drawn correctly. Good so far.


Then, the problem began when the window is resized because the itens, for exemple the tileSprite ground, does not take the whole width again on that resize (attached image 1 is the default, image2 is resized with the part not redrawn):



So, how to say (if any there is a way) to the elements (like the tileSprite) to be redrawn automatically on window resize? (it works, for sure, if I do it manually on window resize event...)





Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.


  • Recently Browsing   0 members

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