Issue
When using android:hardwareAccelerated="true" (most likely in android manifest), the transparency of the WebView is lost and replaced by plain white background. Not all devices seem affected by this issue.
Non affected devices
Droid Razr 2.3.5
Samsung Galaxy Tab p1000, Froyo(2.2)
Affected device
Asus Transformer TF101, Honeycomb(ver3.1)
Repro sequence
var win = Ti.UI.createWindow({
backgroundImage : 'KS_nav_ui.png', //'/images/guide_fond_notice.png',
navBarHidden : true,
exitOnClose : true,
top : '0dp',
left : '0dp',
right : '0dp',
bottom : '0dp'
});
var webView = Ti.UI.createWebView({
backgroundColor : 'transparent',
html : 'This WebView\'s Background Must Be transparent',
top : '50dp',
left : '470dp',
right : '0dp',
bottom : '50dp'
});
win.add(webView);
win.open();
Setting HW accelerated via Tiapp.xml
<?xml version="1.0" encoding="UTF-8"?>
<ti:app xmlns:ti="http://ti.appcelerator.org">
<property name="ti.android.runtime">v8</property>
<deployment-targets>
<target device="mobileweb">true</target>
<target device="iphone">true</target>
<target device="ipad">true</target>
<target device="android">true</target>
<target device="blackberry">false</target>
</deployment-targets>
<sdk-version>1.8.2</sdk-version>
<id>com.appcelerator.com</id>
<name>AcScreenConfs</name>
<version>1.0</version>
<publisher>egomez</publisher>
<url>http://</url>
<description>not specified</description>
<copyright>2012 by egomez</copyright>
<icon>appicon.png</icon>
<persistent-wifi>false</persistent-wifi>
<prerendered-icon>false</prerendered-icon>
<statusbar-style>default</statusbar-style>
<statusbar-hidden>false</statusbar-hidden>
<fullscreen>false</fullscreen>
<navbar-hidden>false</navbar-hidden>
<analytics>true</analytics>
<guid>95f32b4c-0c20-4f0e-86d5-3bc8ece20641</guid>
<iphone>
<orientations device="iphone">
<orientation>Ti.UI.PORTRAIT</orientation>
</orientations>
<orientations device="ipad">
<orientation>Ti.UI.PORTRAIT</orientation>
<orientation>Ti.UI.UPSIDE_PORTRAIT</orientation>
<orientation>Ti.UI.LANDSCAPE_LEFT</orientation>
<orientation>Ti.UI.LANDSCAPE_RIGHT</orientation>
</orientations>
</iphone>
<android xmlns:android="http://schemas.android.com/apk/res/android">
<tool-api-level>11</tool-api-level>
<manifest>
<supports-screens android:anyDensity="true" />
<uses-sdk android:minSdkVersion="11" android:targetSdkVersion="11"/>
<application android:hardwareAccelerated="true">
<activity
android:configChanges="keyboardHidden|orientation"
android:name=".TestActivity" android:theme="@android:style/Theme.Holo.Wallpaper.NoTitleBar">
<intent-filter>
<action android:name="android.intent.action.MAIN" />
<category android:name="android.intent.category.LAUNCHER" />
</intent-filter>
</activity>
</application>
</manifest>
</android>
<modules/>
</ti:app>
Or via Manifest
<?xml version="1.0"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android" android:versionCode="1" android:versionName="1"
package="com.appcelerator.com" android:installLocation="preferExternal">
<tool-api-level>11</tool-api-level>
<uses-sdk android:minSdkVersion="7" android:targetSdkVersion="11"/>
<supports-screens android:anyDensity="true" android:largeScreens="true" android:normalScreens="true" android:smallScreens="false"/>
<application android:hardwareAccelerated="true" android:debuggable="true" android:name="ActifryApplication">
<activity android:configChanges="keyboardHidden|orientation" android:screenOrientation="portrait" android:name=".ActifryActivity" android:theme="@style/Theme.Titanium">
<intent-filter>
<action android:name="android.intent.action.MAIN"/>
<category android:name="android.intent.category.LAUNCHER"/>
</intent-filter>
</activity>
<!-- TI_APPLICATION -->
<activity android:configChanges="keyboardHidden|orientation" android:launchMode="singleTask" android:name="ti.modules.titanium.media.TiVideoActivity" android:theme="@android:style/Theme.NoTitleBar.Fullscreen"/>
<activity android:configChanges="keyboardHidden|orientation" android:name="org.appcelerator.titanium.TiActivity"/>
<activity android:configChanges="keyboardHidden|orientation" android:name="org.appcelerator.titanium.TiTranslucentActivity" android:theme="@android:style/Theme.Translucent"/>
<activity android:configChanges="keyboardHidden|orientation" android:name="org.appcelerator.titanium.TiModalActivity" android:theme="@android:style/Theme.Translucent"/>
<activity android:configChanges="keyboardHidden|orientation" android:name="ti.modules.titanium.ui.TiTabActivity"/>
<activity android:name="ti.modules.titanium.ui.android.TiPreferencesActivity"/>
<service android:exported="false" android:name="org.appcelerator.titanium.analytics.TiAnalyticsService"/>
</application>
<uses-permission android:name="android.permission.ACCESS_WIFI_STATE"/>
<uses-permission android:name="android.permission.ACCESS_NETWORK_STATE"/>
<uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE"/>
<uses-permission android:name="android.permission.INTERNET"/>
</manifest>
This is a known issue on Android Honeycomb SDK (3.x). http://code.google.com/p/android/issues/detail?id=14749
I guess now fixed by: https://github.com/appcelerator/titanium_mobile/pull/5320/files
Workaround that disabled acceleration by using an almost transparent backgroundColor:
This issue, or a variation of it, is still plaguing some phones, namely: * Sony ST21i running android v4.0.4 * Sony Xperia Arc S (lt18i) running android v4.0.4 The bug only manifested after we changed
<supports-screens android:anyDensity="false"/>
totrue
and set<property name="ti.ui.defaultunit">dp</property>
on our tiapp.xml. We've used @Fokke's workaround but it turned the background black on these phones. On a Nexus 5 the background does show as transparent. PS: we don't use 'android:hardwareAccelerated' at all.Closing ticket as invalid with reference to the above comments.