blank splash screen on android with phonegap build

问题

I use phonegap build with phonegap 3 and I can't make my splash screen working on android devices (no test on ios). No error and no splash screen too... In the apk I see my splash images, it's like phonegap build ignore them at the app launch.

Here my config.xml file :

<?xml version="1.0" encoding="UTF-8" ?>
    <widget xmlns   = "http://www.w3.org/ns/widgets"
        xmlns:gap   = "http://phonegap.com/ns/1.0"
        id          = "com.phonegap.example"
        versionCode = "10" 
        version     = "1.0.0" >

    <preference name="phonegap-version" value="3.0.0" />
    <preference name="orientation" value="portrait" />
    <!-- versionCode is optional and Android only -->

    <!-- Core plugins -->
    <gap:plugin name="org.apache.cordova.splashscreen" />
    <gap:plugin name="org.apache.cordova.media" version="0.2.3" />

    <name>ALLO</name>

    <description>
        Application mobile 
    </description>

    <author href="https://www.mywebsite.fr" email="support@mywebsite.fr">
        Henri Labarre 
    </author>

    <gap:platform name="ios" />
    <gap:platform name="android" />

    <!-- icon -->    
    <icon src="res/icons/android/ldpi.png" gap:platform="android" gap:density="ldpi" />
    <icon src="res/icons/android/mdpi.png" gap:platform="android" gap:density="mdpi" />
    <icon src="res/icons/android/hdpi.png" gap:platform="android" gap:density="hdpi" />
    <icon src="res/icons/android/xhdpi.png" gap:platform="android" gap:density="xhdpi" />
    <icon src="res/icons/ios/icon.png" gap:platform="ios" width="57" height="57" />
    <icon src="res/icons/ios/icon-72.png" gap:platform="ios" width="72" height="72" />
    <icon src="res/icons/ios/icon_at_2x.png" gap:platform="ios" width="114" height="114" />
    <!-- retina iPad support: PhoneGap 2.5.0+ only -->
    <icon src="res/icons/ios/icon-72_at_2x.png" gap:platform="ios" width="144" height="144" />    

    <!-- splash screen -->
    <gap:splash src="res/screen/android/ldpi.png" gap:platform="android" gap:density="ldpi" />
    <gap:splash src="res/screen/android/mdpi.png" gap:platform="android" gap:density="mdpi" />
    <gap:splash src="res/screen/android/hdpi.png" gap:platform="android" gap:density="hdpi" />
    <gap:splash src="res/screen/android/xhdpi.png" gap:platform="android" gap:density="xhdpi" />


    <access origin="http://mywebsite.fr" subdomains="true" />    

</widget>

Thanks

回答1:

Found the problem : the debug mode fail the splash screen. When removing it, it works as expected.

回答2:

I was pulling my hair out on the same issue. My custom splash screens were in place, my config.xml looked flawless.

After a few hours of investigation and brute-force testing, I discovered that (at least as at of this writing), there are two "secret sauce" steps I needed to do to get my splash screens updates to "take" (especially if I was hydration enabled -- see my special note below). I presume this is a bug or shortcoming in the Phonegap build tool that will hopefully one day be addressed:

On the Phonegap Build website, click "Rebuild All" button at the top of the page. (Note that I said "Rebuild All", NOT the rebuild button next to each individual platform-- te updates did NOT get applied if I did individual rebuilds individually for android, ios, etc. separately).
Reinstall the app on my target android/ios device (I was simply able to download and reinstall it over the existing version; I did not need to uninstall the existing installation, at least on android).

Special note on hydration (a.k.a, a guess as to why this may be happening): I was under the impression that, as advertised, any www file or splash screen file updates would automatically get pulled down by the hydration app along with any updates to my true code files (css, html, javascript). What I observed, however, was interesting: splash screen updates did not come down immediately (during a hydra update), but any updates to my www javascript, html, css files DID immediately come down, even WITHOUT doing a Rebuild All. While this seems surprising, the clue to why this is may step from the observation that when you click Rebuild All, the rebuild of the ipa and apk takes a fair amount of time to complete, however if you click Rebuild next to each platform, it took substantially less time. This would suggest that Rebuild All forces the system to rebuild the ENTIRE app (including icon, splashscreens, hydration logic, etc.), whereas doing a one-by-one platform rebuild does a "LIGHT" rebuild (which updates html, js, etc. code files and not resources like icons and splashscreens).

Bottom line: Try clicking the Rebuild All button and reinstalling the app on the device (not just doing a hydration update).

回答3:

Add this to config.xml in the root destination or in www/config.xml

<gap:splash src="splash.png" />

<gap:splash gap:platform="android" gap:qualifier="port-ldpi" src="res/screen/android/screen-ldpi-portrait.png" />
<gap:splash gap:platform="android" gap:qualifier="port-mdpi" src="res/screen/android/screen-mdpi-portrait.png" />
<gap:splash gap:platform="android" gap:qualifier="port-hdpi" src="res/screen/android/screen-hdpi-portrait.png" />
<gap:splash gap:platform="android" gap:qualifier="port-xhdpi" src="res/screen/android/screen-xhdpi-portrait.png" />

It's mention on Phonegap docs:-

http://docs.build.phonegap.com/en_US/configuring_icons_and_splash.md.html

来源：https://stackoverflow.com/questions/21184367/blank-splash-screen-on-android-with-phonegap-build

标签

cordova

phonegap-build