Jump to content

NW.js and scaling to window size


Recommended Posts

Hello folks, I'm using NWJS to make a standalone build and wanted to make the window re sizable. My game is designed for 1280x720 so ideally I'd like it to scale without needing to re-code everything. 

Right now I set "game.scale.scaleMode = Phaser.ScaleManager.SHOW_ALL;" and it scales OnLY with the width. So when I shrink the height, it doesn't scale at all hidden. Likewise, it is capped at canvas size and will not scale above 1280x720px.

I'm wondering what the best way to go about doing it, some sort of CSS and Phaser setting mix? Or do I need custom JS to resize canvas based on window size and desired aspect ratio? Does Phaser have any built in functionality to handle that?

 

EDIT: I did googling but all the topics / tutorials are from like 3 years ago, using outdated version of phaser. 

Link to post
Share on other sites

EDIT: OK, I think I finally got it working using:

window.onresize = function(event) {
     var gui = require('nw.gui'); 
    var win = gui.Window.get();
    console.log("Resizing Window to : " + win.width + "x" + win.height); 
    sGame.scale.scaleMode = Phaser.ScaleManager.SHOW_ALL;
    var d = document.getElementById("gameDiv");
    d.style.width = (win.width) + "px";
    d.style.height = (win.height) + "px";
      sGame.scale.pageAlignHorizontally = true;
    sGame.scale.pageAlignVertically = true;
};
    

Wonder if there is a better way?

Link to post
Share on other sites
4 hours ago, koobazaur said:

Right now I set "game.scale.scaleMode = Phaser.ScaleManager.SHOW_ALL;" and it scales OnLY with the width. So when I shrink the height, it doesn't scale at all hidden.

Either set

game.scale.parentIsWindow = true;

or give the container a height:

#gameDiv { height: 100vh; }

 

Link to post
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.

Guest
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.

Loading...
  • Recently Browsing   0 members

    No registered users viewing this page.

×
×
  • Create New...