Home » Android » WebView inside ViewPager or ScrollView – weird rendering bug on Android 3.0+

WebView inside ViewPager or ScrollView – weird rendering bug on Android 3.0+

Posted by: admin June 15, 2020 Leave a comment

Questions:

I have a ViewPager. Every page of the ViewPager is a ScrollView. The ScrollView contains a WebView and several other Views.

On Android 2.3 and older everything works fine but on 3.0+ there’s a weird rendering issue:

The WebView should start right under the photo

When scrolling left / right in the ViewPager, there is also a very subtle rendering issue (which is present in Android 4.0 Gmail app too).

How to&Answers:

This might be related to hardwareAcceleration. Try specifically turning it off. You can do this

1) in the application tag inside your manifest (which will disable hardware acceleration throughout the app)

android:hardwareAccelerated="false"

OR 2) Disabling it for the problematic view in code:

myView.setLayerType(View.LAYER_TYPE_SOFTWARE, null);

For more information, and to check if a WebView or a ListView handle hardware acceleration correct see this link

Answer:

I partially solved it by calling webView.requestLayout() in ScrollView.onScrollChanged(). It is now almost ok, but when scrolling, the WebView seems slightly out of sync with other ScrollView children. Sometimes the WebView seems to scroll slightly slowly than other Views and catches up with them a moment later.

Answer:

Had the same issue that wasn’t fixed by the accepted answer. In the end, it turned out to be related to position:fixed in the page’s CSS. Replacing these instances with position:absolute seems to have done the trick.