iOS换一种思路写一个无限轮播的滚动视图

不循环设置元数据,只用3个cell,连续滚动一辈子滚不到头???

哈哈哈,不开玩笑,你值得拥有写这篇博客已经距离我当时写轮子差不多有一个月时间了,也完善了很多,基本是没有bug的,如果有,不妨留言,喜欢的话,劳烦各位点个赞,不喜欢的,不妨看看思路,提提意见 ##github地址 ##码云地址

###1. 以前的思路使用scrollView 基本是以下的方法

a,使用scrollView放轮播图,scroll分页放置图片可以实现左右轮播

b,在头尾各添加两个图片,然后在滑动到最后一张的时候处理滑动

例如123一共3张图片

加两个形成31231一共5张图片

c,当滑动到最后一张时候如何再往右滑动,瞬间无动画切换到起始位置的呢一张图,第一张往左滑动也同样处理

d,处理手动和定时器

scroll实现轮播图链接

###2.最近流行的使用collection 使用collectionView可以很方便的创建轮播图,并且利用collectionViewCell的复用,很方便的管理,原理也很简单

a,把轮播图的元数据扩大,123123123...123123123

b,创建视图把初始位置设置为中间点

c,处理滚动到头时候

如此基本可以解决问题,如果害怕滑动到头一般设置为9999

这里一般会优化数据源, 使用123,在读取时候循环读取

###3.自己的想法和优雅的点子

####想法1,数据源的读取并不优雅

数据源是个很明显的双向循环,这个结构跟以前"听说"的双向链表那么的契合,为什么不使用双向链表作为数据源呢

####想法2,collection设置99999真的的好么,表示我是一个崇尚优雅的猿

本来就是轮播嘛,滑动的时候怎么左右滚,划,总不会需要超过3个的cell吧

####Then-> 假如我有一个链表,假如我只使用3个cell,那么我可以写成一个循环滚动的轮播图吗

####原理应该是每次滑动结束之后就回到中间的那一张

左划3个cell的数据源整体向左,右划类推

###4,想法是不够的,轮子才是我想要的

####循环链表??...面向对象大发好

设置每一个数据

@interface SXLinkList : NSObject
@property(nonatomic, assign) NSInteger index;
@property(nonatomic, strong) id data;
@property(nonatomic, strong) SXLinkList *next;
@property(nonatomic, strong) SXLinkList *last;
@end

把数据联系起来,用for循环创建,然后把头和尾接起来

+ (SXLinkList *)createLinkListWithURLsArray:(NSArray *)urlArr {
//第一只
    SXLinkList *head = [[SXLinkList alloc] init];
    head.data = [urlArr firstObject];
    head.index = 0;
    SXLinkList *ptr = head;
    for (int i=1; i<urlArr.count; i++){
        SXLinkList *node = [[SXLinkList alloc] init];
        node.index = i;
        node.data = [urlArr objectAtIndex:i];
        ptr.next = node;
        node.last = ptr;
        ptr = node;
    }
//穿起来
    head.last = ptr;
    ptr.next = head;
    return head;
}

然后创建了collectionView什么的就很随意的,个数呢,拒绝9,我们只要3

- (NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section {
    return 3;
}

问题总是不经意的出现: 怎么判断左划还是又滑?

设置一个参数看是否滑动成功,成功则对比知道左右划,然后切换数据

- (UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath {
    SXCycleCollectionCell *cell = [collectionView dequeueReusableCellWithReuseIdentifier:@"SXCycleCollectionCell" forIndexPath:indexPath];
    
    if (!_isMove) {
        _isMove = YES;
        _nowPtr = _ptr;
    }
    if (indexPath.row == 0) {
        _ptr = _nowPtr.last;
    } else if (indexPath.row == 2) {
        _ptr = _nowPtr.next;
    }
    if (_isLocalImage) {
        [cell setCellData:_ptr.data];
    } else {
        [cell setCellImageIsUrlData:_ptr.data];
    }
    
    return cell;
}

然后切换到下标为1的cell

- (void)scrollViewDidScroll:(UIScrollView *)scrollView {
    if (scrollView.contentOffset.x <= 0 || scrollView.contentOffset.x >= 2 * self.bounds.size.width) {
        _isMove = NO;                                                                     //重置是否移动
        [scrollView setContentOffset:CGPointMake(self.bounds.size.width, 0) animated:NO]; //切换到下标1的cell
    }
}

#####如此基本搞定!然而运行发现有个bug,慢速的滑动没有问题,快速的滑动会因为cell还没有被回收,会闪一下然后正常,所以不得不手动处理这个bug,所有上边的方法修改为下边

- (void)scrollViewDidScroll:(UIScrollView *)scrollView {
    //tableViewCell的复用会延缓一点点时间,手动设置以防止没有复用的时候显示错误
    if (scrollView.contentOffset.x <= 0 || scrollView.contentOffset.x >= 2 * self.bounds.size.width) {
        _isMove = NO;                                                                     //重置是否移动
        [scrollView setContentOffset:CGPointMake(self.bounds.size.width, 0) animated:NO]; //切换到下标1的cell
        //更新cell的值(滑动过快时候cell没有回收复用)
        SXCycleCollectionCell *cell = (SXCycleCollectionCell *) [self.mainView cellForItemAtIndexPath:[NSIndexPath indexPathForRow:1 inSection:0]];
        if (_isLocalImage) {
            [cell setCellData:_ptr.data];
        } else {
            [cell setCellImageIsUrlData:_ptr.data];
        }
        _pageControl.currentPage = _ptr.index;
    }
}

最后设置定时器,添加本地图片,封装类方法

上图

欢迎提意见

来源：oschina

链接：https://my.oschina.net/u/2476972/blog/789622

标签

PageControl

collectionview

ios