Feasibility of Crosswalk builds for Android

[spinnerbox]

So yes I did try to export for Android using Intel XDK/Crosswalk and the exported file was 20+ megabytes.

 

Let just say I am building a variant of Tetris which is classic arcade game, contained of 80% code and alghorithm and 20 percent of assets, sounds/images/GUI. So you are expecting it to be less 5MB all in all.

 

I mean when we talk about mobile and web games we think of small games. So building with Crosswalk aka 20+ megabytes of added weight seems silly.

 

I also tried Cordova for Android but the build was sluggish. I have Nexus 7 with nVidia Tegra and Intel quad core processor. This seem damn stupid

 

Should I bother with JavaScript builds for Android at all?

 

How about JS builds for iOS or Windows Phone, or other smart phones?

 

This leads me to building a game as a true/native non hybrid Android application and of course iOS app.

 

Any thoughts about that Firefox OS thing?

[Gods]

You can try Crosswalk lite which is 10mb


The main problem I face is scaling so many different android devices and idk how to do scaling without having black bars. On mobile browsers I can just SHOW_ALL and it seems to fix it but as soon as I use cordova/crosswalk I get black bars on some devices :/ 
 

[fariazz]

Gods, you can use 100% of the screen area if you do screen checks BEFORE initiating the Phaser game object, so you initiate it with the right size that 1) has the ratio of the screen and 2) doesn't leave black bars of game world (which happens when the game world is smaller than the area you've defined when initiating the Phaser game).

 

This is how you can use 100% of the size of your screen, no matter the size of the game world (landscape mode only), hope it helps:

var ZPlat = ZPlat || {};//calculate the dimensions of the game so that 100% of the screen is occupiedZPlat.getGameLandscapeDimensions = function(max_w, max_h) {  //get both w and h of the screen (some devices/browser measure this differntly, so you dont know for sure which one is which)  var w = window.innerWidth * window.devicePixelRatio;  var h = window.innerHeight * window.devicePixelRatio;    //get the actual w and h. in landscape we'll define w as the longest one  var landW = Math.max(w, h);  var landH = Math.min(w, h);    //do we need to scale to fit in width  if(landW > max_w) {    var ratioW = max_w / landW;    landW *= ratioW;    landH *= ratioW;  }    //do we need to scale to fit in height  if(landH > max_h) {    var ratioH = max_w / landW;    landW *= ratioH;    landH *= ratioH;  }    return {    w: landW,    h: landH  }}//max w and max h are the maximum game world area that will be shownZPlat.dim = ZPlat.getGameLandscapeDimensions(700, 350);ZPlat.game = new Phaser.Game(ZPlat.dim.w, ZPlat.dim.h, Phaser.AUTO);ZPlat.game.state.add('Boot', ZPlat.BootState); ZPlat.game.state.add('Preload', ZPlat.PreloadState); ZPlat.game.state.add('Game', ZPlat.GameState);ZPlat.game.state.start('Boot'); 

[spinnerbox]

@Gods what do you consider by black bars? Share some pictures of your phones.

 

Somebody tried Crosswalk Lite recently? It seems all builds were removed.

 

https://github.com/crosswalk-project/crosswalk-website/wiki/Crosswalk-Project-Lite

 

But I found this:

 

https://crosswalk-project.org/blog/crosswalk-lite-10.html

[Gods]

 

Gods, you can use 100% of the screen area if you do screen checks BEFORE initiating the Phaser game object, so you initiate it with the right size that 1) has the ratio of the screen and 2) doesn't leave black bars of game world (which happens when the game world is smaller than the area you've defined when initiating the Phaser game).

 

This is how you can use 100% of the size of your screen, no matter the size of the game world (landscape mode only), hope it helps:

var ZPlat = ZPlat || {};//calculate the dimensions of the game so that 100% of the screen is occupiedZPlat.getGameLandscapeDimensions = function(max_w, max_h) {  //get both w and h of the screen (some devices/browser measure this differntly, so you dont know for sure which one is which)  var w = window.innerWidth * window.devicePixelRatio;  var h = window.innerHeight * window.devicePixelRatio;    //get the actual w and h. in landscape we'll define w as the longest one  var landW = Math.max(w, h);  var landH = Math.min(w, h);    //do we need to scale to fit in width  if(landW > max_w) {    var ratioW = max_w / landW;    landW *= ratioW;    landH *= ratioW;  }    //do we need to scale to fit in height  if(landH > max_h) {    var ratioH = max_w / landW;    landW *= ratioH;    landH *= ratioH;  }    return {    w: landW,    h: landH  }}//max w and max h are the maximum game world area that will be shownZPlat.dim = ZPlat.getGameLandscapeDimensions(700, 350);ZPlat.game = new Phaser.Game(ZPlat.dim.w, ZPlat.dim.h, Phaser.AUTO);ZPlat.game.state.add('Boot', ZPlat.BootState); ZPlat.game.state.add('Preload', ZPlat.PreloadState); ZPlat.game.state.add('Game', ZPlat.GameState);ZPlat.game.state.start('Boot'); 

My game is in portrait mode also I initialize my phaser game object in my index file like this

<script type="text/javascript">window.onload = function() {var game = new Phaser.Game(320, 480, Phaser.AUTO, 'gameContainer');game.state.add('Boot', BasicGame.Boot);game.state.add('Preloader', BasicGame.Preloader);game.state.add('MainMenu', BasicGame.MainMenu);game.state.add('Game', BasicGame.Game);game.state.start('Boot');};</script>

Is it possible to get it to work for my setup?

[fariazz]

 

My game is in portrait mode also I initialize my phaser game object in my index file like this

<script type="text/javascript">window.onload = function() {var game = new Phaser.Game(320, 480, Phaser.AUTO, 'gameContainer');game.state.add('Boot', BasicGame.Boot);game.state.add('Preloader', BasicGame.Preloader);game.state.add('MainMenu', BasicGame.MainMenu);game.state.add('Game', BasicGame.Game);game.state.start('Boot');};</script>

Is it possible to get it to work for my setup?

 

 

Totally! If it's in portrait then the width should be smaller than the height, so try changing this:

 

var landW = Math.max(w, h);

var landH = Math.min(w, h);

 

 

To this:

 

var landW = Math.min(w, h);

var landH = Math.max(w, h);

 

If I'm not missing anything that should do it. Let me know if it works!

[gianthead]

spinnerbox, have you tried using Crosswalk in Shared Mode?  It will reduce the size of your APK to only your files, which should be a lot less than 20+ mb. The downside is users will need to have installed the Crosswalk runtime as a separate app. 

[spinnerbox]

I thought of it. In the end it sounds silly. Install a special run-time for one application.

 

Reworking the app, natively with Android is far more better option.