加入收藏 | 设为首页 | 会员中心 | 我要投稿 云计算网_泰州站长网 (http://www.0523zz.com/)- 视觉智能、AI应用、CDN、行业物联网、智能数字人!
当前位置: 首页 > 站长学院 > PHP教程 > 正文

Sencha Touch高性能list最简单高效的实现措施

发布时间:2021-12-13 11:34:04 所属栏目:PHP教程 来源:互联网
导读:Sencha Touch 的list性能非常的低,官方论坛有人说超过200个项就已经是超标了!但事实上超过40个项就非常卡了,尤其是每个项里还有图片的时候,在iPhone中可能效果不错,但到了Android,你可能会摔手机。 不顺畅的原因其实是元素太多,必需限制显示的数据,但

Sencha Touch 的list性能非常的低,官方论坛有人说超过200个项就已经是超标了!但事实上超过40个项就非常卡了,尤其是每个项里还有图片的时候,在iPhone中可能效果不错,但到了Android,你可能会摔手机。
 
不顺畅的原因其实是元素太多,必需限制显示的数据,但又要解决上滚和下滚显示相应的项,有人会想到用分页,其实分页相当的麻烦,下面就说一个鄙人奋战了一天摸索出来的方法,仅仅三步,几行代码,你看了也会会心一笑。
 
1. me.pageNum = 1;//当前页
me.pageItems = Ext.is.Phone?15:25;//每页显示项
me.list.scroller.on('scrollend',me.onScrollerEnd,me);//监听滚动停止事件
 
2. onScrollerEnd : function(scroller,offsets){//分页逻辑
var me = this,
lh = scroller.size.height,
h = me.list.getHeight(),
y = offsets.y;
if(me.filterValue && me.filterValue!=''){return;}
if(y==0){//滚动到顶部时显示上一页
if((me.pageNum>1)){
me.pageNum--;
me.doPaging ();
}
}else if((y+h)>=lh){//滚动显底部时显示下一页
var c = me.listStore.getCount();
if(c > (me.pageNum*me.pageItems)){
me.pageNum++;
me.doPaging ();
}
}
},
 
 
3.
doPaging : function(){//分页逻辑
var me = this,
n = me.pageNum,
y = me.pageItems;
me.helpStore.removeAll();//清除所有数据
me.helpStore.add(me.listStore.getRange((n-1)*y, (n*y)));//取主store里的范围
me.list.bindStore(me.helpStore);//绑定到当前list里
me.list.scroller.scrollTo({x: 0, y:0}, false);//滚动到顶部
},//end function doPaging

(编辑:云计算网_泰州站长网)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

    热点阅读