sencha touch笔记——Carousel组件自动滚动实现及代码

carousel组件可以实现走马灯的效果。有的时候需要实现自动轮播的功能。

查看carousel组件的api，有next()函数

next( )
: Ext.carousel.CarouselCHAINABLE

Switches to the next card.

再借用setInterval函数，从而实现自动轮播的效果，实现代码如下：

setInterval(function(){
myCrousel = Ext.ComponentQuery.query('carousel')[0];
myCrousel.next();
if (myCrousel.getActiveIndex() === myCrousel.getMaxItemIndex()) {
myCrousel.setActiveItem(0);
}
}, 3000);

其中的if判断语句当判断到达走马灯最后一张时自动切换到第一张。