WebView over ImageView Android - html

Question

I have read multiple posts for solutions on how to display a WebView over an ImageView. Here is what I tried last and it still doesn't work:
mPhotoWebView.setWebViewClient(new WebViewClient());
mPhotoWebView.setBackgroundColor(0x00000000);
xml:
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="300dp" >
<com.example.android.views.MyImageView
android:id="#+id/photoImageView"
android:layout_width="match_parent"
android:layout_height="match_parent" />
<WebView
android:id="#+id/photoWebView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scrollbarStyle="insideOverlay"
android:scrollbars="none" />
html style:
body
{
background:transparent;
background-color: rgba(10,10,10,0.5);
}
This code needs to run on 4.2.2. What I am trying to accomplish, is the webview has animation code done in html5 and the imageView is a background image that the animations need to show over.
Any ideas?

Answer 1

I must have missed this combination before. My final solution, that works is:
Do not set background color to webView in the code.
body
{
background:transparent;
overflow: hidden;
background-color: rgba(10,10,10,0.5);
}
xml:
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="300dp" >
<com.accuweather.android.views.MyImageView
android:id="#+id/photoImageView"
android:layout_width="match_parent"
android:layout_height="match_parent" />
<WebView
android:id="#+id/photoWebView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#android:color/transparent"
android:layerType="software"
android:scrollbarStyle="insideOverlay"
android:scrollbars="none" />
Key here is the software layerType. I am using a fragment of which one activity handles many, so I couldn't do this in the manifest. Therefore I did so in the xml.