How can Phonegap users make their app's backgrounds transparent, to reveal a device's homescreen?
My html form has a background image. Both measure 460h x 320w.
When I test the html on my tablet (1024h x 600w), the app displays properly, but the background color surrounding the form is either black or white depending on which setting I used in my localStorage.java file.
I only want the background color transparent. The form and image should remain the same.
I am using Eclipse as my IDE to convert my html & css to an Android app.
I have referenced these two Stack Overflow posts, but again, no fruit:
How to make the PhoneGap app's background transparent and revealing the current system wallpaper
How do I set a background image on the WebView on Cordova/PhoneGap for Android?
I have also tried android:theme="@android:style/Theme.Translucent..", to no avail.
Here is the code I use with some of the commented-out things I have tried:
html body style:
<body style="margin:0px;font-family:Helvetica;background-image:url ('droid.png');
background-Repeat:no-repeat;background-color:transparent !important;">
main.xml:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="320dp"
android:layout_height="460dp"
>
</LinearLayout>
localStorage.java:
package com.ABC.localStorage;
/* import android.app.Activity; */
import android.os.Bundle;
import org.apache.cordova.*;
import android.graphics.Color;
public class localStorage extends DroidGap
{
@Override
public void onCreate(Bundle savedInstanceState)
{
super.onCreate(savedInstanceState);
super.loadUrl("file:///android_asset/www/index.html");
super.setIntegerProperty("backgroundColor", Color.TRANSPARENT);
/* super.appView.setBackgroundColor(Color.TRANSPARENT); */
/* appView.setBackgroundColor(Color.TRANSPARENT); */
/* appView.setBackgroundColor(Color.rgb(255,37,37)); */
/* appView.setBackgroundColor(0x00000000); */
/* appView.setBackgroundColor(Color.argb(125,255,37,37)); */
}
}
AndroidManifest.xml:
<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android" android:windowSoftInputMode="adjustPan"
package="com.ABC.localStorage" android:versionName="1.1" android:versionCode="5" android:hardwareAccelerated="true">
<supports-screens
android:largeScreens="true"
android:normalScreens="true"
android:smallScreens="true"
android:xlargeScreens="true"
android:resizeable="true"
android:anyDensity="true"
/>
<uses-permission android:name="android.permission.INTERNET" />
<application android:icon="@drawable/icon"
android:label="@string/app_name"
android:theme="@style/TransparentFloatingApp"
android:hardwareAccelerated="true"
android:debuggable="true">
<activity android:name="localStorage"
android:label="@string/app_name"
android:theme="@android:style/Theme.Black.NoTitleBar"
android:configChanges="orientation|keyboardHidden|keyboard|screenSize|locale">
<intent-filter>
<action android:name="android.intent.action.MAIN" />
<category android:name="android.intent.category.LAUNCHER" />
</intent-filter>
</activity>
</application>
<uses-sdk android:minSdkVersion="7" android:targetSdkVersion="17"/>
</manifest>
style.xml:
<resources>
<style name="Theme" parent="android:Theme" />
<style name="TransparentFloatingApp">
<item name="android:windowBackground">@android:color/transparent</item>
<item name="android:background">@android:color/transparent</item>
<item name="android:windowNoTitle">true</item>
<item name="android:backgroundDimEnabled">false</item>
<item name="android:windowIsTranslucent">true</item>
</style>
<drawable name="transparent_background">#00000000</drawable>
</resources>
