I completed my first Phaser Game, I would like to put it up on the Google Play store.

[EpicKingdom_]

Is PhoneGap a good choice for doing this?

[jonforum]

1 hour ago, EpicKingdom_ said:

Is PhoneGap a good choice for doing this?

i use intel xdk,   has been discontinued.
But it also existe some old setup shared on the web.

[Mickety]

Might want to check this too.

It's a version of PhoneGap but free (?)

https://cordova.apache.org/

[EpicKingdom_]

This is what my Phaser 2 game looks like in an Android emulator, I am not sure why. 

If I load a basic HTML5 docuiment with a simple h1 tag, it looks fine so it must be something wrong with my game. 

This is what it should look like. 

[EpicKingdom_]

Any idea why it would look like that? The emulator I am using is Nexus 5 Oreo 8.0 I believe.

[EpicKingdom_]

It runs in the browser just fine when I add the browser as a platform in Cordova CLI, but it doesn't display properly in the Android emulator.

[EpicKingdom_]

All of my other vanilla JavaScript projects work properly in the emulator, so it has something to do with Phaser 2. 

[grinmonk]

@EpicKingdom_ Have you tried scaling your game in a browser? I would recommend using Chrome's device emulation:

https://developers.google.com/web/tools/chrome-devtools/device-mode/

[theNeedle]

this might be something related to CSP(Content Security Policy). When trying out cordova, I've faced issue where any of assets are not loading. It was solved by removing meta tag related to CSP. I'm not sure that's the best practice but it was okay for just get it to working condition. Other than that I didn't find any other issues. However I didn't run it on emulator, instead I run directly on the device and  also made apk and install on several other device and it was working good.

Maybe try running on actual device or build an apk?

I found this about CSP. I'm not sure this would solve your problem but it might be useful.

[EpicKingdom_]

This is what the Phaser 2 game looks like on my local Android device. 

(EDIT): I can scroll with my finger, it would appear that the game is too large for the device? Here are my settings. 
 

let game = new Phaser.Game(800, 720, Phaser.CANVAS);

game.scale.scaleMode = Phaser.ScaleManager.SHOW_ALL;
game.scale.pageAlignHorizontally = true;
game.scale.pageAlignVertically = true;

 

[theNeedle]

On 5/6/2018 at 1:39 PM, grinmonk said:

@EpicKingdom_ Have you tried scaling your game in a browser? I would recommend using Chrome's device emulation:

https://developers.google.com/web/tools/chrome-devtools/device-mode/

You might use this device mode to see how your game scales in different mobile devices. If it scales as you want in chrome-devtools than it should scale as it is on mobile device. If you want to disable scroll than you can use some meta tags in html. However I used phaser 3 and scale the game using custom JS function like this. Apart from that I don't have any experience with phaser2.

[onlycape]

Hi @EpicKingdom_

I had a similar problem with the mobile devices and the problem was the configuration of my viewport metatag.

[EpicKingdom_]

I always use responsive web design in Firefox or Chrome when developing, the game scales in the browser. 
It just doesn't look right on an emulator or on my local device. Is Phaser not good for mobile development?

This is what it looks like in Chrome. 

(EDIT): I think I will just redesign the entire game to be 100% positive that it designed for mobile first.

 

[EpicKingdom_]

Alright, so I decided to just to just develop for the device I am aiming at (Nexus 5). 

So I set the canvas to 320px by 640px. 

Then I am using the Phaser scale methods. 

I also scaled all the sprites and text down and re-positioned them. 

This is the new result so far.

 

 

[mattferndale]

If you get it up on google I can test on my phone and or NOX