rroylance / phaser-ce-npm-webpack-typescript-starter-project

Project to get you started with your Phaser-CE (using the npm module) game using Typescript and Webpack for building! No hassle asset management, Google Web Font loader, live server, development vs distribution build pipeline, Electron packaging for desktop builds, and more...
https://rroylance.github.io/phaser-npm-webpack-typescript-starter-project/
The Unlicense
423 stars 73 forks source link

How to set aspect-ratio to 16:9 #22

Closed kongyuan closed 6 years ago

kongyuan commented 7 years ago

1: I can't set aspect-ratio to 16:9. I tried the val 16:9, 16/9, and I should not use 1.77777777..... I think. 2: After trying some times for problem 1, I can't set scale mode any more, it fix on USER-SCALE

kongyuan commented 7 years ago

When I set the width to 300 and height to 990, scale mode is user-scale, the game shows queer aspect-ratio

rroylance commented 7 years ago

300x990 is a very odd aspect ratio (3.33)...

To set the game to 16:9 you'd do the following for example; npm run setupGameSize -- --width=1600 --height=900 --aspect-ratio=1.77

As for the scale mode, it needs to be set to one of Phasers included scale modes ('USER_SCALE', 'SHOW_ALL', 'EXACT_FIT', 'NO_SCALE', or 'RESIZE') (user-scale is not valid, USER_SCALE is though) so to add a new scale mode to the previous; npm run setupGameSize -- --width=1600 --height=900 --aspect-ratio=1.77 --scale-mode=SHOW_ALL

Does that help you?

kongyuan commented 7 years ago

It's helps. I just missed "=", It's different from most linux consle. I set 300x990 to figure out how "USER_SCALE" works , and I still think there is some bugs. In my opinion, "USER_SCALE" means whatever width and height is, aspect ratio still fixed, but in 300x990, height is too short, of course 300x990 is useless, I just worry about it will cause other problems.

kongyuan commented 7 years ago

Oh, my bad, 300x990 is browser window, not the game, game use 800X500, I forgot to tell in first time, sorry Sorry for my bad english, BTW