sencha touch 高性能 list最简单高效的实现方案

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 ();

}

}

},

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

作者:unbug
转自:http://www.iunbug.com/index.html