安卓 WebView 硬件加速工具的解决方案

Question

在Android中，WebView硬件加速存在一个已知的bug， 例如： https://code.google.com/p/android/issues/detail?id=17352

禁用硬件加速对我来说是不可行的。

我阅读了以下这些参考资料：

• Android webview slow
• https://plus.google.com/+PaulIrish/posts/ccP98BTMd5Z
• http://riamobilesolutions.com/android-webview-scrolling-performance/

我的问题是，如果开启了硬件加速，是否有任何CSS / HTML解决方法可以避免可能出现的渲染伪影？

只有当我将焦点放在表单字段上时才会看到它们，这似乎会导致垂直同步-esque和亚像素故障。当我聚焦在该字段上时，整个页面似乎都在抖动。

似乎position: absolute也与此有关。

有谁有解决这个问题的经验吗？

- Andrew Bullock

---

你找到任何解决方案了吗？！ - Dr.jacky

你尝试在你的WebView中使用过 setLayerType(View.LAYER_TYPE_SOFTWARE, null) 吗？ - Abhishek Hirapara

Answer 1

添加：

-webkit-backface-visibility: hidden;
-webkit-perspective: 1000;
backface-visibility: hidden;
perspective: 1000;

如果你正在使用 3D 变换，这是一个廉价的技巧，但它可以提高性能，特别是在 iPad 上。

此外，您可以尝试

-webkit-transform: rotateZ(0deg);

我知道的是，旋转可以提高性能，因为GPU在旋转某些东西时更加出色。另一种方法是对屏幕上的每个元素进行“无函数”变换。如果需要帮助，请告诉我。

- Alex Tape

---

所描述的操作产生了相反的效果。这些工件是GPU加速的结果。因此，我们要避免利用GPU。我也遇到了同样的问题，不幸的是，到目前为止我找到的唯一解决方案是禁用整个WebView的硬件加速。 - pepkin88

Answer 2

Put this code in your class:

webview.getSettings().setRenderPriority(RenderPriority.HIGH); 

if (Build.VERSION.SDK_INT >= 19) {
    webView.setLayerType(View.LAYER_TYPE_HARDWARE, null);
}       
else {
    webView.setLayerType(View.LAYER_TYPE_SOFTWARE, null);
}

- Abhishek Hirapara

Answer 3

当启用 HWA 时，我遇到了类似的渲染问题。当我在 CSS 中将以下行应用于 body 时，渲染问题消失了。

body {
  -webkit-transform: translateZ(0);
}

- Webfreak