Here's a quick snippet to make Phaser 2 games scale to fit the screen:

// inside create() function
game.scale.scaleMode = Phaser.ScaleManager.SHOW_ALL;
game.scale.pageAlignHorizontally = true;
game.scale.pageAlignVertically = true;

Phaser.ScaleManager controls the scaling - the three values are:

  • EXACT_FIT - expand width and height to fill all available space; ratio is not preserved;
  • NO_SCALE - don't scale at all;
  • SHOW_ALL - scale to fill the screen while preserving the ratio.

pageAlignHorizontally and pageAlignVertically add padding around the game to position it in the centre of the screen; either or both of these can be false to prevent padding from being added.

setScreenSize(true) activates these changes.