如何避免Android上的Phonegap app空白屏幕？

Question

I'm deploying a web app with phonegap to the plataforms: iOS and Android.

I can deploy both, but when the app starts, on the android emulator (also, with any physic device that i've used it to test the application), it stays with a white/blank canvas. Forever.

Initially, i thought it was javascript related, although i don't think it makes sense, since i don't have the same problem with iOS (but i know, it could be browser related).

I've research this problem through the internet, but any possible solution that probably would make sense, didn't work for me.

Solutions i tried:

PhoneGap Build iOS app has blank white screen after splash screen

The Phonegap Version i'm using is: v3.3.0

Also, i'm using a Javascript framework: Dojo, v1.9

Answer 1

My tl;dr answer is...debug that thing with Weinre:

http://people.apache.org/~pmuellr/weinre/docs/latest/

Weinre is very similar to the Chrome/Safari inspector, only for remote browsers (such as the native WebView!). Pretty sweet, eh? It involves a little setup but has been well worth it for me. Interactively test your assumptions and see your console.log statements print out in a far superior fashion than with logcat (in the android case).

Some reflections on the matter:

Developing my app over the last couple months, I've encountered the blank screen tons of times. It is never the same issue twice, for me it always something I have broken during development.

For example, not adding a Cordova plugin via the command line but trying to reference the plugin in my app's javascript logic.

Another example is not having proper Cross Origin stuff setup on the server and the initial ajax call that worked fine on desktop/localhost suddenly doesn't work once deployed to the device and it just craps out (giving the white screen).

Another example from the other day was trying to see if I could get away with using Sencha on Android as old as 2.3, which in my case, you guessed it gave me a white screen. Maybe Dojo has a similar issue?

As requested, the settings in my current config.xml that works fine on both iOS and Android

<preference name="permissions" value="none" />
<preference name="orientation" value="portrait" />
<preference name="target-device" value="universal" />
<preference name="fullscreen" value="false" />
<preference name="webviewbounce" value="true" />
<preference name="prerendered-icon" value="true" />
<preference name="stay-in-webview" value="false" />
<preference name="ios-statusbarstyle" value="black-opaque" />
<preference name="detect-data-types" value="true" />
<preference name="exit-on-suspend" value="false" />
<preference name="show-splash-screen-spinner" value="true" />
<preference name="auto-hide-splash-screen" value="true" />
<preference name="disable-cursor" value="false" />
<preference name="android-minSdkVersion" value="7" />
<preference name="android-installLocation" value="auto" />

Hope this helps.

Answer 2

Phonegap 6.3 scaffholding ( phonegap create ) is wrong: density should be replaced by qualifier in config.xml . See https://medium.com/@jlchereau/how-to-get-splash-screens-to-show-in-android-apps-generated-by-phonegap-build-c0210f2783ff .