Phaser 3 - How to get actual screen size on HEIGHT_CONTROLS_WIDTH?

0
votes

I’m making a game primarily targeted to mobile devices on Phaser 3 using scale mode HEIGHT_CONTROLS_WIDTH.
With fixed height, I can just make the game on 3:4 aspect ratio and make it centered so it will automatically crop the sides for tall devices.

I’m following this example.

However, now I have a problem: I can’t get the actual visible screen size.
I have UI buttons located at the top left and top right of the game.
But with the game cropped for tall devices, they’re not visible on those devices.
I need to be able to get the visible screen size to anchor them on the correct position.

I have tried this.cameras.main.width, window.innerWidth, window.outerWidth, and many more but nothing works.
Is there any way for me to get the actual visible screen size after getting cropped?

1
javascriptphaser-framework

1 Answers

0
votes

Try this:

this.canvas.getBoundingClientRect();

It should give you the info you need about your canvas.