InfiniteCarousel

最新推荐文章于 2024-10-01 19:25:19 发布

流浪狗

最新推荐文章于 2024-10-01 19:25:19 发布

阅读量144

点赞数

分类专栏： sencha touch 文章标签： ux

本文链接：https://blog.csdn.net/linshiquan/article/details/84297154

版权

sencha touch 专栏收录该内容

2 篇文章 0 订阅

订阅专栏

Ext.define('Ext.ux.InfiniteCarousel', {	
  extend: 'Ext.Carousel',
  xtype: 'infinitecarousel',
  config: {
    indicator: false
  },
  initConfig: function(){
    var me = this;
    me.callParent(arguments);
    me.delay = me.config.delay;
    delete me.config;
  },
  initialize: function(){
    var me = this;
    me.callParent();
    
    var isEven = function(nb){
        return (nb%2 == 0) ? true : false;
    };
    
    me.nbItems = me.getItems().length;
    me.interval = (isEven(me.nbItems) ? me.nbItems/2 : (me.nbItems-1)/2);
    me.setActiveItem(me.interval);
    
    me.on('activeitemchange', me.onActiveItemChange, me);
    if(me.delay > 0)
      me.timeout = Ext.defer(me.rotate, me.delay, me);
  },
  onActiveItemChange: function(c,v,ov){
    var me = this;
    
    if (me.timeout){
      clearTimeout(me.timeout);
      me.timeout = Ext.defer(me.rotate, me.delay, me);
    }
    
    var active = c.getActiveIndex(),
        direction = (c.getItems().indexOf(v) > c.getItems().indexOf(ov)) ? 'forward' : 'backward',
        container = (direction=='forward') ? c.getAt(active-me.interval-1) : c.getAt(active+me.interval+1);
    
    c.remove(container, false);
    (direction=='forward') ? c.add(container) : c.insert(0,container);
  },
  rotate: function(){
    this.next();
  }
});