CollectionView循环滚动机制点睛

突然想起很早前有个大神问我的一个关于collectionView循环的问题,当时我没有去接触过这个内容,所以就随便说了下(敷衍了事)。现在突然发现这是个值得记录一下的内容,于是乎,我就在这里分享一下我的思路。(当然也有其他的思路啦。最重要是你需要会一种)。

1.先说一下collectionView的一个必要类。

        _collectionView  =[[UICollectionView alloc]initWithFrame:CGRectMake(0, 0, CGRectGetWidth(frame), CGRectGetHeight(frame)) collectionViewLayout:yourLayout];

其中这个yourLayout就是你自己定制的布局属性类。在这个属性里面,你可以做出世界上不曾出现的动画效果。唯一要求的就是你有多少创造力;
首先你创造自己自定义的布局属性继承于UICollectionViewFlowLayout

- (NSArray *)layoutAttributesForElementsInRect:(CGRect)rect{}

在上述方法中将位于最中间的index值通过自己的方法传输到collectionView所在的view中。(这个值是实时传输的。我自己用的是block传值的方式。毕竟好写啊O(∩_∩)O哈哈哈~)

(1)注意重点了,如果你的工程中一个collectionView的item尺寸宽度刚好是一个屏幕的宽度,或者你在如下代码中

 NSArray *array = [self.collectionView indexPathsForVisibleItems];

能够明确得出此数组中哪个是你的目标item。那么你可以用如下代码确定最中间的index值。

        NSIndexPath *indexPath = array[0];
        NSInteger row = indexPath.row;

这样就不需要用传值的方式来得到目标item的下标了。

2.接下来就是最关键的思路了

对于cellectionView中数据源的处理应该就是精髓了,(其实也没有什么。。。。)我把它称为真假数据源。真数据就是平常普通的装model的数据源啦。那么假的呢?\(o)/~先进一段广告
都知道数据源是一个有头有尾的数组。collectionView的滚动过程中肯定可以把数据滚动显示到最后一个。然后呢,就是不可滚动了。这样就不能实现无线滚动的效果了。如果你觉得滚到最后做一个无动画跳转到第一个就可以了,那确实可以类似无限滚动,但是就不能体现流畅的效果,而且会让用户觉得很突兀。
因此我创建了假的数据源,这个数据源装的是下标,比如真实数据源有5个元素。我创建的数据源就是 @[@0, @1, @2, @3, @4, @0, @1, @2, @3, @4,@0, @1, @2, @3, @4,@0, @1, @2, @3, @4,@0, @1, @2, @3, @4,......循环177次,哈哈,7是一个很谦恭的数字,自己随便哈。别影响性能就好。如何创建就不说了,for循环。

//创建全局变量currentSelectedIndex,也是实时传输的index值;
//创建好了数据源就刷新数据
[self.collectionView reloadData];
// self.dataSource 是假数据源  ,  5和177固定值最好宏定义 。centerItem是假数据源中最中间的一组数据。
    NSInteger centerItem = 5 *(177 - 1)/2;
    
    NSIndexPath *index = [NSIndexPath indexPathForItem:centerItem inSection:0];
    [self.collectionView scrollToItemAtIndexPath:index atScrollPosition:UICollectionViewScrollPositionCenteredHorizontally animated:NO];

然后就是在cellectionView代理方法中的操作了

-(NSInteger)numberOfSectionsInCollectionView:(UICollectionView *)collectionView{
    return 1;
}

- (NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section
{
    return self.dataSource.count;
}
- (UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath
{
    YourCell *cell = [collectionView dequeueReusableCellWithReuseIdentifier:@"YourCell" forIndexPath:indexPath];
NSNumber *index = self.dataSourcese[indexPath.item];
 NSInteger *indexValue = [num integerValue] % 5;

    //真实数据源中装的都是图片地址
cell.image = self.imagesArray[indexValue];
    return cell;
}
- (void)collectionView:(UICollectionView *)collectionView didSelectItemAtIndexPath:(NSIndexPath *)indexPath

{
    [collectionView scrollToItemAtIndexPath:indexPath atScrollPosition:UICollectionViewScrollPositionCenteredHorizontally animated:YES];

    [self.collectionView scrollToItemAtIndexPath:indexPath atScrollPosition:UICollectionViewScrollPositionCenteredHorizontally animated:NO];
}

最后很重要的就是当用户滑动之后,处于减速的时候调用scrollView的代理方法。

   无缝回滚到中间
-(void)scrollViewDidEndDecelerating:(UIScrollView *)scrollView{
    NSIndexPath *index = [NSIndexPath indexPathForItem:self.currentSelectedIndex Section:0];
    [self.collectionView scrollToItemAtIndexPath: index atScrollPosition:UICollectionViewScrollPositionCenteredHorizontally animated:NO];
}

至此已经完成了整个循环滚动精华部分的述说。
如果希望看demo可以给我私信。有什么不能解决的需求问题也可以给我看看,让我也接触一些高深莫测的东西。顺手点个喜欢不是很好么?嘿嘿嘿。

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 211,423评论 6 491
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 90,147评论 2 385
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 157,019评论 0 348
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 56,443评论 1 283
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 65,535评论 6 385
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 49,798评论 1 290
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 38,941评论 3 407
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 37,704评论 0 266
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 44,152评论 1 303
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 36,494评论 2 327
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 38,629评论 1 340
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 34,295评论 4 329
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 39,901评论 3 313
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 30,742评论 0 21
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,978评论 1 266
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 46,333评论 2 360
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 43,499评论 2 348

推荐阅读更多精彩内容