Videlais

Common Phaser + CocoonJS issues

Recommended Posts

The message I'm getting from this thread is: "Don't use CocoonJS."

 

It's definitely got problems. There's no getting around that.

 

However, looking at Phaser's compatibility with other hybrid app frameworks like Cordova/PhoneGap and Crosswalk right now, it's pretty much on par with everything else.

 

You take on some risk using any of them. And they all come with their own issues and quirks to be aware of.

Share this post


Link to post
Share on other sites

Is anyone else still having issues with buttons?

 

When the display was mirrored, they worked fine, but in 2.1.0 the display is fixed and some of my buttons disappear again. It's always the same 2 buttons (out of 10 or so).

 

One of them appears if I do a certain combination of actions, and even if I replace them with plain sprites and events they dont show.

 

Any new ideas on the issue now that 2.1.0 is out?

Share this post


Link to post
Share on other sites

In attachment, there is my game with Coconut on Android. The game is in 320x480 and Zopo C2 has 1080x1920. What should I do?

 

You should scale your game to the screen. See the section under "Scaling" here or the several threads covering scaling on the forums. Looking at Phaser's ScaleManager might help too, depending on your needs.

Share this post


Link to post
Share on other sites

To fix the button issue I created a weird hack that involves adding a tiny transparent image after everything else in the scene. Not sure why this works, but it stops everything from hiding randomly. I haven't tested this in 2.1.0 though so not sure if it still works there.

Share this post


Link to post
Share on other sites

To fix the button issue I created a weird hack that involves adding a tiny transparent image after everything else in the scene. Not sure why this works, but it stops everything from hiding randomly. I haven't tested this in 2.1.0 though so not sure if it still works there.

 

Brilliant!, you've saved my day. I tried this with 2.1.1 and it works perfectly.

Share this post


Link to post
Share on other sites

To fix the button issue I created a weird hack that involves adding a tiny transparent image after everything else in the scene. Not sure why this works, but it stops everything from hiding randomly. 

 

Just to clarify, @BinaryMoon, are you writing that you are adding an extra image at the end of your create() function per scene?

 

Something like the following:

function create() { //Creating stuff game.add.image(0,0,'');}

If so, and we can verify this is a working solution to the problem, we could probably roll it into a patch for Phaser at some point. (This was, in fact, the solution previous to 2.0, anyway. Looks like it might need to be added to this hack.)

Share this post


Link to post
Share on other sites

You should scale your game to the screen. See the section under "Scaling" here or the several threads covering scaling on the forums. Looking at Phaser's ScaleManager might help too, depending on your needs.

 

I still don't get it. I have used the hack by Starnut. Now screen is really fullscreen. But how about scaling sprites? If I have bird sprite 30x30 px, on the full HD screen it's just a dot...

Share this post


Link to post
Share on other sites

I still don't get it. I have used the hack by Starnut. Now screen is really fullscreen. But how about scaling sprites? If I have bird sprite 30x30 px, on the full HD screen it's just a dot...

You can scale the sprites using code found in this thread. However, as I've mentioned in another thread, the physics.arcade.moveToPointer function doesn't work correctly, so you'll have to come up with a work-around if you're using that. I haven't looked into it much further than that, so I can't guarantee that there won't be additional issues too.

Share this post


Link to post
Share on other sites

The game is scaled weird. It is scaling only width, not height. I don't know what that code should do. Some game elements are on fixed position. Should I give every sprite not absolute, but relative position? Does every sprite expand, too? I thought this code scale everything just like when you used Appgyver Steroids or Phonegap.

Share this post


Link to post
Share on other sites

I thought this code scale everything just like when you used Appgyver Steroids or Phonegap.

 

I wish it did. That would be very helpful. Sadly, though, CocoonJS works as sort of a reduced browser environment. Unlike PhoneGap (Cordova), it doesn't use the native platform's WebView framework, but renders things itself. It works more like an abstract to a graphics engine than as something common to nearly all other browser-like user agents.

 

I don't know what that code should do. Some game elements are on fixed position. Should I give every sprite not absolute, but relative position? Does every sprite expand, too?

 

Since everything is not scaled together (although maybe using ScaleManger would help with that?), you might need to scale things yourself, too. I know this can be frustrating, accounting for position changes, but it is, unfortunately, a part of building apps for different mobile devices. Because they can have different dimensions and pixel ratios, you have to make decisions about what to support and where you employ different scaling.

Only supporting certain device types or platforms may help with that, depending on what you want, but as of right now, there isn't an easy way to scale things perfectly in Phaser when using it with CocoonJS. And while we've made some progress on responsive scaling (see 2.1.1's RESIZE under ScaleManager), patches accounting for hybrid app frameworks still lag behind.

 

So, yeah, you might need to position things relative to each other. And will probably need to scale sprites to match the increased canvas size too.

Share this post


Link to post
Share on other sites

Videlais: So should I write some variable and then multiply every sprite and position? And then use innerWidth and innerHeight to scale game?

 

That might be the fastest way, yeah. I've been hoping someone would come along and write a patch for mobile resizing, but that hasn't happened yet. So, in the mean time, what you outlined, scaling sprites and using innerWidth and innerHeight, is probably the easiest way.

Share this post


Link to post
Share on other sites

I used innerWidth and innerHeight and game is not scaled properly. Left side is ok (is right in the left edge), but right side is (I think) two times wider than screen (width is not 1024, but 2048 or maybe more).

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

  • Recently Browsing   0 members

    No registered users viewing this page.