2

我开发了一个 cordova 应用程序，我正在使用 Android 5.0 Lollipop 在我的手机上对其进行测试。我发现 Android 硬件加速存在问题，如果启用它，则会出现 CSS 渲染问题，如您在此视频中所见。

查看滚动过程中出现的空白区域，您还可以看到每个列表项 ( <li>) 在滚动过程中都是模糊的，当我停止滚动项目时正常显示。

就我使用以前的 Android 4.x 版本而言，没有这样的问题。如果我禁用硬件加速，我就没有问题了，但是性能很差，因为我在其他地方使用了一些 CSS 技巧来获得更好的 CSS 性能。

这是我的一些与视频相关的代码：

html: （使用车把）

<div id='view'>
<ul>
    {{#each []}}
        <li> 
                {{@index}}
        </li>
    {{/each}}
</ul>
</div>

CSS：

ul {
    padding-left: 0;
    margin-top: 0;
    margin-bottom: 15px;
    list-style: none;
    background-color: #fff;
    border-top: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
}
li {
    background-color: grey;

    border-bottom: 1px solid rgb(243, 255, 226);
    height: 80px;
    padding: 0;
    position: relative;
}
* {
    -webkit-tap-highlight-color: rgba(0,0,0,0);
}
* {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
#view {
    -webkit-backface-visibility: hidden;
    -webkit-perspective: 1000;
     perspective: 1000;
     backface-visibility: hidden;

     -webkit-transform: translateZ(0);
      -ms-transform: translateZ(0);
      transform: translateZ(0);
}

我还使用棘轮来获取一些基本的 CSS。

有同样问题的人吗？你认为这是cordova 还是Android Lollipop WebView 的错误？

有机会解决吗？

谢谢

4

1 回答 1

1

你试过用 Crosswalk 编译吗？希望它能解决它。

于 2015-02-05T23:13:01.730 回答