蔡繁荣
蔡繁荣
  • 发布:2015-09-09 14:11
  • 更新:2015-09-09 14:11
  • 阅读:3213

分享Android4平台二级页面滚动花屏问题的解决方案v1.0.0

分类:HTML5+

环境:小米2S,Android 4.1.1
因为刚升级的新版HBuilder,Android5的webview闪屏、花屏问题也基本都解决了,竟然小米2S的Android4会出现花屏觉得不可思议。不知道是不是Android4.4以下的版本都有这个问题吧,如果也有遇到该问题的童鞋,可以在下面跟帖,手机型号和Android版本:)

问题:一级列表页面滚动流畅,进入二级详情页面滚动时有一定花屏(不断地闪烁)的概率。

咨询了下@DCloud_Android_ST,他说按道理Android4不可能花屏,因为已经解决了,看着像是内存满了,因为内存不够用了,webview绘制不出来。可能是每个页面的图片量太大了或者占用内存过多导致的。

遂将内存清空了400多M后,再测,还是会花屏。
因为每个应用都有自己固定的内存空间,不是手机全部的。

所以DCloud_Android_ST建议我节省手机内存,比如降低图片质量等方式。

因为我使用的都是Retina模式的双倍图片,详情页面顶部的轮播图尺寸比较大,800x500,隐藏掉暂不显示后,怀着惴惴不安的心情再次运行,一步一步点进去后,无论如何快速拖动都不花屏了。我的眼眶湿润了。

找到问题的原因后,接下来就是考虑如何优化图片质量了。

策略:
对App的图片进行屏幕适配,对高清大屏就显示质量高一些的图片,它们不差这点内存。
对出现花屏问题的手机进行手动调整返回的接口图片尺寸,减为原来的0.5倍。

// 判断手机是否为小米2S,图片进行适配显示小版本的尺寸  
if(navigator.userAgent.indexOf("MI 2S") > 0){  
    params['width']  = 400;  
    params['height'] = 250;  
}

所以本质还是要做好App性能的优化,尽量节省手机的内存。(对Android平台说的话)

5 关注 分享
BoredApe DCloud_Android_ST bzliukai DCDDD 你猜我猜不猜

要回复文章请先登录注册

千里驹

千里驹

我也遇到这个问题了,先滚动到底部,然后快速向上滚动就会出现花屏闪屏的效果了,我也得子页面顶部也是图片轮播,莫非也是图片太大了
2017-10-26 21:20
W_无名

W_无名

可以
2016-08-25 14:07
你猜我猜不猜

你猜我猜不猜

大马克
2016-07-08 21:14
bzliukai

bzliukai

马克
2015-12-13 17:03