WebView in ListView drawn twice (Why and how to solve?)

Issue

I am using a ListView with a WebView every 30 items for special HTML ads (animated) which are provided from a WebServer. This normally works okay. But sometimes it seems to draw the content of the WebView twice as seen in the screenshot below. The WebView continues animating but the misplaced (left bottom) drawing stays the same. When one interacts with the screen (scrolls) the wrongly drawn space disappears.

Now my questions are:

1. Why is this happening?
2. How can I prevent this from happening?

My current guess for Nr. 1 is: Somehow the WebView gets positioned in the left bottom just for a quick time where it as well draws. Then it gets positioned correctly but the ListView does not redraw that area because it thinks all is still at the same position.

Thanks to anyone who can help.

UPDATE:

I used the same WebView with the animation centered in a RelativeLayout. The same problem occurred there. So the problem is not in the ListView.

Solution

I found the problem in the WebView coming from the advertiser. The problem seems to be setting the LayerType to HARDWARE. That caused the Problem. Setting the the LayerType to NONE or SOFTWARE the problem went away. Now I just wonder WHY that caused the problem.

A normal WebView uses LAYER_TYPE_NONE by default.

Solution in short:

if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.HONEYCOMB) {
    webView.setLayerType(View.LAYER_TYPE_SOFTWARE, null);
}

Answered By - Patrick Boos