Crosswalk Intel XDK experiences

hmin It should work fine, yes.

hmin, thanks for the info, I will take a good look at it soon. But do you have any news on why the startup screen acts weird?

If I am holding my phone in portrait or landscape mode while the splashscreen is showing, it displays a black and white screen. If I don't change my phone's orientation when the splashscreen is showing, just before the game starts it shows a black screen for a short time, but very noticable.

Regarding to the splash screen issue, we are looking into it and will update it once we make some progress. Thanks.

I've tested this on lots already, you can reproduce it with just a blank layout (1280 x 720 pixels), one image sprite with some spritefont text, then compile with XDK/Crosswalk and CocoonJS and compare the result.

At this point I suspect 2 possibilities: 1) Letterbox scaling, because my test device is 1200p and not 720p that my games are made at. I say this because CocoonJS doesn't have proper scaling, it just keeps that aspect ratio and have black/empty bars on bottom and right if the display is not matched. 2) Rendering quality/filtering is low on mobile chromium.

—, thanks for your information. I try to reproduce it on Nexus 7 (with 1920x1200 resolution) according to your instruction, but unfortunately, I failed to reproduce the blurry image as you said, I am not sure if I set up the same env as yours. Below is my approach for reproducing:

1. Use a 1280x720 image as <image> in a HTML page and explicitly set the image width and height to 1280px and 720px, or

2. Use the same image as the background of body by the following CSS:

  body {
       background: url('a.png') no-repeat fixed;
       background-size: cover;
  }[/code:2ggagmw3]
In both of the above ways, the image can be auto-scaled and kept the same aspect ratio, but it would NOT become blurry as you mentioned. 
So would you please show me how your image is used? e.g. its style and DOM element with the original image. Thanks.

—

I think the above comment is intended for you.

hmin

This is the example from inside C2. My character sprite is 256 x 256 1:1 ratio. You can see from the prior screenshot, compiled with XDK the character is blurry, as is the SpriteFont. Compiled with CocoonJS (same project properties, on low for fullscreen scaling), its clear & sharp like my preview on Chrome PC.

As I've said, I think I understand now why its occurring, since CJS will default to Scale Outer when set on Letterbox, whereas XDK actually do the Letterbox scaling when the screen ratio doesn't match the layout ratio (in my case, its 16:9 in C2 being run on a 16:10 device). So there could be differences in the scaling mode used. Otherwise I have no idea whats happening.

IntelTyler IntelRobert

When we can expect a change to stable 5.34.104.5 and beta 6.35.131.4 ? New Beta offers an option to ignore GPU blacklist and I'm curious how it works.

I managed to sort my issue with regards to signing my apk and updating an older CJS google play store listing.

—

I also get the blurry image issue even on small images. I have to set the high DPI to yes to make smooth graphics for my app. I believe this will give a performance issue on most phones though In CJS all my graphics were fine with that turned off.

hmin

I also get the half black and white screen on startup. Sometimes I also have my splash screen displayed even though when I build it I request it is not shown.

I've also have some strange issues that my app will sometimes load incorrectly.

If you have wifi enabled then the app displays a black screen for a few seconds and then will load fine.

If you have no internet connection then the app will freeze on the startup screen. You can get around this by pressing the phone home button and then the app icon again. But doing this it jumps to the main menu and the physics gravity set to 0 does not trigger, Very odd!

It seems it may be related to having teh clay.io plugin for my app but I will have to experiment to check and see if I can get some simpler capx as examples.

rekjl

For your splash screen issue:

1: I can't reproduce your 1st question about black and white screen, Have you uploaded a black and white screen in XDK? Would you please explain more about this issue?

2: It's a known issue that developer need to upload both two splashscreen for portrait and landscape currently, and will be improved later.

Currently, please upload two splashcreens for both.

Thanks.

— Hmm..I am getting that audio lag as well, I guess I will now wait until there is a stable version 5. Also, I am having the same problem as:

KFC where our screen tends to go to sleep after a while if the user doesn't touch anything. Is there anyway to disable this, as my game has a slideshow movie and it always comes in effect during them.

SabinX when loading the splashscreen, we get a half black and white screen before going to the game. I notice that this problem only arise for me when say the spashscreen is shown in portrait mode, then I change my phone's orientation, it goes to that black and white screen. If I don't change the orientation when showing the spashscreen, it just goes black for roughly 2 seconds before entering the game.

Also, I notice that we have to options to place a landscape and portrait splashscreen. I only wanted to use a landscape one, so I place an image there. However, if I start up the game and my handphone is being viewed in portrait, it shows the default intel spashscreen. Does this mean that I have to place the image on both landscape and portrait? Will this count as double in terms of file size? Or is there a way to let XDK know that I want to use the same image for any splashscreen orientation?

guangzhen, Sorry I guess I didn't explain it clearly enough.

1. To reproduce the black and white screen, change the orientation of your phone while the splashscreen is showing. For example, hold your phone in portrait mode, once the splashscreen is showing, turn your phone sideways to landscape mode. It should than reproduce the black and white screen.

2. Also for this, I have uploaded two splashscreen for both portrait and landscape. I wanted it to show the same image, so I used the same image for portrait, but just adjusted the resolution to be portrait. But something happens, when I do the 1 problem. When I turn the phone from portrait to landscape or vice versa, instead of the splashscreen staying the same because the two images in both modes are the same, it actually stretched the original image to fit the new orientation. That means a portrait image being stretched to fit a landscape resolution.

Hmm, in my debugging text it says "canvas2d" as renderer, in both stable and beta builds but the stable has a better framerate(55 fps vs 32 fps).

The intel app preview the app is using the "WebGL" renderer.

Zhiqiang

I was wondering why the performance is worst in Crosswalk 5, even when both builds are running with canvas2d renderer.

Thanks.

Hi, cesisco, even if canvas2d renderer is used, the performance may be still bad if the HW acceleration for canvas2d is blacklisted on your device. Chromium will also blacklist the accelerated canvas2d on some device, e.g. the older Qualcomm Adreno device, see the link crbug.com/161575. To confirm the gpu feature status on your device, I suggest to use Chrome for Android for help, you can type about://gpu to check the output for Canvas category.

—, Mayfly, I still failed to reproduce it with some experiments.

—, I agree with your analysis for the blurry image caused by scaling. If I could reproduce it, I think I can fix in XDK/Crosswalk, at least to provide a option for developer to decide if auto-scaling is needed.

Would you please paste a piece of code to show how do you use the image in HTML file? for example, if viewport meta tag is used, and the css applied to image, so that I can reproduce it easily and correctly.

hmin Honestly no idea about the code, because thats just exported from C2. If you load up C2, make a blank layout 720p, add in a 256 x 256 sprite of your choice.. then export it and go through the compile process in XDK or CocoonJS, you get the same result, more blurry after XDK compiled.

hmin

Ashley

I've attached some links to a much simpler reproduction. I have also put links to the XDK apk and CJS apk.

If you open and run either the C2 or CJS versions, the loading layout comes first, very quickly loads and takes you to the title screen.

If you try the XDK version then it gets stuck at the loading screen. You can get past this by pressing your phone home button to minimoise out. Then select the app icon again to load it back up. It will get past the stuck stage but will not trigger the 'physics gravity = 0' command.

I have left some extra lines in my titlescreen sheet for PeerJS pluggin and CLAY.io

They are not needed for the title screen but they are needed in my app. I need to clear all PeerJS connections at the title screen and also I force close the clay.io login screen as for some reason XDK exports make it appear even when it is not called?

Construct 2 file:

https://dl.dropboxusercontent.com/u/631 ... rTest.capx

XDK apk:

https://dl.dropboxusercontent.com/u/631 ... ffline.apk

CJS apk:

https://dl.dropboxusercontent.com/u/631 ... Signed.apk

I am expecting crosswalk 6 this week, but the blacklist option will take a few more weeks because we are redoing the build system and it will come as part of some other changes. This is my best guess about timing--not a promise.

IntelTyler IntelRobert

When we can expect a change to stable 5.34.104.5 and beta 6.35.131.4 ? New Beta offers an option to ignore GPU blacklist and I'm curious how it works.

Thanks rekjl

The behavior of displaying splashscreen during orientation change is bad. Will fix it ASAP, and will let you know when it's fixed. You can also track the issue via jira: And also for your 1st question:

I have tested locally with below cases:

1. Use default splashscreen for both orientation

2. Upload only one customized splashscreen.

3. Upload two customized splashscreen

All of above cases can not reproduce the black white screen issue, Would you please share me your image of splashscreen? (You can upload to the jira or here)

Thanks again.

guangzhen, Sorry I guess I didn't explain it clearly enough.

1. To reproduce the black and white screen, change the orientation of your phone while the splashscreen is showing. For example, hold your phone in portrait mode, once the splashscreen is showing, turn your phone sideways to landscape mode. It should than reproduce the black and white screen.

2. Also for this, I have uploaded two splashscreen for both portrait and landscape. I wanted it to show the same image, so I used the same image for portrait, but just adjusted the resolution to be portrait. But something happens, when I do the 1 problem. When I turn the phone from portrait to landscape or vice versa, instead of the splashscreen staying the same because the two images in both modes are the same, it actually stretched the original image to fit the new orientation. That means a portrait image being stretched to fit a landscape resolution.