轮播图实现的三种方式

2016-01-04

轮播图实现的三种方式

假设有5张图片，分别是：12345，实现轮播图

方法1：用scrollView加NSTimer实现，思路：12345五张图片，实现轮播，我添加两张，变成5123451，当滑到最后一个1时，无动画位移回第一个1；当倒着滑到5时，无动画回最后的5。

难点在于：给定数组的个数，及两个边界的判断

方法2：用collectionView加NSTimer实现，思路：12345五张图片，对应collectionView的1个section，即一个section有5个row；至于有多少个section，尽量设置的大一些，eg：100；（collectionView有重用机制）所以不用担心内存问题。

难点在于：滑动的逻辑处理；如果你把section设置的非常大，就不用担心倒着滑的问题，毕竟不是每个人都那么闲。

- (void)nextPage:(id)sender {
    // 1. 得到当前正在显示的cell的indexPath，（只有一个）
    NSIndexPath *currentIndexPath = [[self.collectionView indexPathsForVisibleItems] lastObject];
    
    // 2. 得到YYMaxSections/2对应的section的indexPath，显示此indexPath对应的cell
    NSIndexPath *currentIndexPathReset = [NSIndexPath indexPathForItem:currentIndexPath.item inSection:YYMaxSections/2];
    [self.collectionView scrollToItemAtIndexPath:currentIndexPathReset atScrollPosition:UICollectionViewScrollPositionLeft animated:NO];
    
    // 3. 如果当前section的row未显示完全，则row+1，否则section+1，row置为0
    NSInteger nextItem = currentIndexPathReset.item + 1;
    NSInteger nextSection = currentIndexPathReset.section;
    if (nextItem == self.dataArray.count) {
        nextItem = 0;
        nextSection++;
    }
    
    // 4. 位移显示效果
    NSIndexPath *nextIndexPath = [NSIndexPath indexPathForItem:nextItem inSection:nextSection];
    [self.collectionView scrollToItemAtIndexPath:nextIndexPath atScrollPosition:UICollectionViewScrollPositionLeft animated:YES];
}

方法3：用scrollView加NSTimer实现，12345，只用3个imageView，每次滑动的时候，始终保证下一个是居中，eg：512，123，234，当你从2滑到3的时候，结束后位移从123变为到234；

代码：https://github.com/mokong/CircleView
注：代码里只有前两种方法，没有第三种，大家可以自己百度第三种的实现代码；