How do I set a background image on the WebView on Cordova/PhoneGap for Android?

android, cordova, webview

Solution

Figured it out after digging in Cordova source and Android docs. In src/com/.../MyApp.java:

public class MyApp extends DroidGap
{
    @Override
    public void onCreate(Bundle savedInstanceState)
    {
        super.onCreate(savedInstanceState);

        super.loadUrl(Config.getStartUrl(), 20000);

        // Must be after loadUrl!
        super.appView.setBackgroundColor(0x00000000); // transparent RGB
        super.appView.setLayerType(WebView.LAYER_TYPE_SOFTWARE, null);

        // Put background image in res/drawable/splash.jpg
        Drawable theSplash = getResources().getDrawable(R.drawable.splash);
        super.root.setBackground(theSplash);
    }
}

And the CSS:

html,
body,
.transparent { background-color: transparent !important; }

Problem

I'm not just looking for the Splash Screen functionality in the API; if possible, I would like the HTML content to use a transparent background, and lean on the WebView to supply the background image. Is such a thing possible? Barring that, can I at least set a background color on the WebView that will "bleed through" to HTML content?

Original source

Related problems