Landscape splash screen for Android in PhoneGap Build

问题

What should I enter to config.xml or what should I do in general, to have PhoneGap Build application's splash screen displayed correctly on Android device in landscape mode?

PhoneGap Build (used to compile) docs / blog have nothing on this. Only Portrait is covered for Android.

Since first (docs) says that using height and width is cross-platform supported, I tried to use it:

<gap:splash src="res/splash-200x320-android.png"             gap:platform="android" gap:density="ldpi"  width="200" height="320" />
<gap:splash src="res/splash-320x480-android-bada-ios.png"    gap:platform="android" gap:density="mdpi"  width="320" height="480" />
<gap:splash src="res/splash-480x800-android-bada-wp.png"     gap:platform="android" gap:density="hdpi"  width="480" height="800" />
<gap:splash src="res/splash-720x1280-android.png"            gap:platform="android" gap:density="xhdpi" width="720" height="1280" />
<gap:splash src="res/splash-320x200-android.png"             gap:platform="android" gap:density="ldpi"  width="320" height="200" />
<gap:splash src="res/splash-480x320-android-bada-ios.png"    gap:platform="android" gap:density="mdpi"  width="480" height="320" />
<gap:splash src="res/splash-800x480-android-bada-wp.png"     gap:platform="android" gap:density="hdpi"  width="800" height="480" />
<gap:splash src="res/splash-1280x720-android.png"            gap:platform="android" gap:density="xhdpi" width="1280" height="720" />

But there is no effect -- in landscape mode on my Android device I always see badly strechead portait mode version of my splash screen.

回答1:

As per my current knowledge and after deep research, I have found that this is a confirmed bug, and we currently can't do anything about this.

PhoneGap Build (and probably PhoneGap itself as well) currently does not support landscape splash screens at all. I even tried the iOS way (like shown in the question -- using width and height params, officially not supported for Android). But it still doesn't work.

All is fine in portrait mode, but no matter what screen density Android device you'll use -- in landscape you'll see ugly deformed portrait version of splash screen.

回答2:

I'm not using PhoneGap Build, but I managed to fix this in a basic PhoneGap Android app.

Let's say you have two different splash images - a landscape and a portrait version - and you want both of them to stretch to fill the available screen area.

Put one in drawable and the other in drawable-land. (Or drawable-land-hdpi, drawable-land-xhdpi, etc., if you you have multiple sizes.)

Next, make sure that you're managing config changes yourself in AndroidManifest.xml:

<activity
    ...
    android:configChanges="orientation|screenSize|keyboardHidden"
    ...
>
</activity>

Then put this in your main Activity class that extends DroidGap.java:

@Override
public void onConfigurationChanged(Configuration newConfig) {
    super.onConfigurationChanged(newConfig);

    if (super.splashDialog != null) {
        ViewGroup rootView = (ViewGroup) super.splashDialog.getWindow()
                .getDecorView().findViewById(android.R.id.content);
        LinearLayout linearLayout = (LinearLayout) rootView.getChildAt(0);
        // manually refresh the splash image
        linearLayout.setBackgroundDrawable(null);
        linearLayout.setBackgroundResource(R.drawable.mysplash);
    }
}

This will cause the background image to redraw and properly stretch whenever the user changes orientation.

回答3:

Phonegap Build now uses the Cordova configuration style. When specifying the density, append port- or land- to specify portrait or landscape:

<splash src="portrait-ldpi.png" density="port-ldpi"/>
<splash src="landscape-ldpi.png" density="land-ldpi"/>

Old configuration style

It can be done since April 2014 in Phonegap Build by using the gap:qualifer, eg

<gap:splash src="portrait-xxhdpi.png" gap:platform="android" gap:qualifier="port-xxhdpi" />
<gap:splash src="landscape-xxhdpi.png" gap:platform="android" gap:qualifier="land-xxhdpi" />

See this and this article for details.

来源：https://stackoverflow.com/questions/14844189/landscape-splash-screen-for-android-in-phonegap-build

标签

cordova

landscape

phonegap-build

splash-screen