Solved: White Screen on Android App (but not iOS version) - Page 2

Mark_D_6 · ‎04-22-2016

I updated to XDK 3240 so I could rebuild a very simple app with new icons/splash images. I had to convert the certificates but that seemed to go ok. Other than that, nothing has changed.

Generated the Android and iOS versions. The app is really just a website launcher doing a window.open. The iOS version works exactly as before.

The Android version, however, displays the splash image for a couple seconds then a white screen. I've waited around for the website but other than a little network activity at startup there is no other activity. This did work on the previous version of XDK that I downloaded a few weeks ago.

Does XDK 3240 require any additional JS includes? Right now cordova.js, js/app.js, and xdk/init-dev.js are being included. I believe these were added when the project was created last year (I didn't create the project).

Any ideas what would cause this?

PaulF_IntelCorp · ‎04-25-2016

If an attempt to access any external network-based resource is happening during initialization that could cause a white-screen. Especially if it is something in your index.html file and NOT using an AJAX call. If your app is attempting to access an external resource (such as a CSS file, a JS file, fonts, etc.) those are blocking actions and will cause the entire UI to stop.

External JS files, CSS files, font files, images, etc. are not a good idea. It is better to make all those components local to your app so you do not rely on a network connection to get your app started. You should only attempt to retrieve resources over the network interface AFTER your app is started and can interact with the user.

Is it possible you are using an analytics plugin or an ad plugin that is attempting to access network resources during initialization?

If you want to "open up" your whitelist settings, to the least secure values (not recommended for published apps), do the following (first image is for index.html file, the "Content-Security-Policy" tag, second is for Android, third is for iOS, and fourth is for Windows):

View solution in original post

Mark_D_6 · ‎04-26-2016

The app was created without crosswalk. Since I'm new to this I don't know what it provides. I'll look at the inAppBrowser plugin. Thanks

PaulF_IntelCorp · ‎04-26-2016

Try with Crosswalk, the results will be more consistent across all devices, especially the rendering of your page. Android 4.x devices have very old and inconsistent webviews in which your app runs. Your app will be bigger, but the tradeoff is worth the increased size.

Mark_D_6 · ‎04-26-2016

Understood. It is now working. For some reason, however, the app now requires additional permissions. It wants phone status/identity and prevent phone from sleeping. I need to read about where those came from (they weren't there before and the app doesn't need them).

Mark_D_6 · ‎04-26-2016

Oh, the crosswalk footprint is huge. Not sure they're going to be happy with that considering the iOS version is less than 1 MB. I understand the compatibility but that's a big change.

PaulF_IntelCorp · ‎04-26-2016

Select 17 as your version of Crosswalk, that's the latest and some of the earlier versions added permissions that weren't needed. Normally, there are a few network permissions required for a simple Crosswalk app.

You can also use the "shared" model, which results in a Crosswalk lib download as an adjunct, so the app size itself is quite small. That lib then only needs to be downloaded once and will be updated from time-to-time via the Google Play store (just like the system webview is now).