iOS_ UIScrollview_无限循环

无限循环：

我们都知道UIScrollView有一种很流畅的切换效果，结合UIPageControl的辅助展示效果，就可以完成一个很不错的产品介绍功能页面。那么像一些购物app中，商品展示页面无限滚动的效果是如何实现的呢？

方法1：前后+1方法，这也最常见的一种做法。假如我们有四张需要展示的图片，我们创建了一个数组来保存图片名字，此时数组中保存的是按顺序的1.png，2.png，3.png，4.png，这四个图片名字。要实现无限循环的效果，我们需要改动一下这个数组为：4.png，1.png，2.png，3.png，4.png，1.png，我们发现在原来数组的前后分别加入了一个图片名字，即将要循环展示的下一张图片的名字。当你滑动到4.png的时候，下一张会是1.png。当你在1.png往回滑动的时候，将要出现4.png。

好了，下面是我们的核心内容：我们发现目前数组中有6个图片，当我们从3.png滑动到4.png，又从4.png滑动到1.png的时候，我们要神不知鬼不觉的迅速切换到排在第二位的1.png。反向滑动的时候也是如此，从1.png滑动到4.png的时候，我们要神不知鬼不觉的切换到拍到倒数第二位的4.png。那么怎么样才能实现神不知鬼不觉呢？

看下面这两个UIScrollView的实例方法：

[objc]  view plain copy

1. - (void)setContentOffset:(CGPoint)contentOffset animated:(BOOL)animated;  
2. - (void)scrollRectToVisible:(CGRect)rect animated:(BOOL)animated;  

这两个方法可以在animated参数为NO的时候，帮助我们迅速切换视图。

当每一次滑动结束的时候，UIScrollViewDelegate会有一个回调方法：

[objc]  view plain copy

1. - (void)scrollViewDidEndDecelerating:(UIScrollView *)scrollView;  

 

此时我们来检测是否是滑动到了我们将要出发的1.png和4.png，如果是的话，那么就悄悄调用上面两个方法中的任意一个来实现视图切换。

实现代码如下所示：

[objc]  view plain copy

1. int currentPage = (int)self.scrollView.contentOffset.x/320;  
2. if (currentPage==0)  
3. {  
4.     [self.scrollView scrollRectToVisible:CGRectMake(3320 * [slideImages count]-2,0,320,460) animated:NO]; // 序号0,跳转到最后1页  
5. }  
6. else if (currentPage==[slideImages count]-1)  
7. {  
8.     [self.scrollView scrollRectToVisible:CGRectMake(320,0,320,460) animated:NO]; // 最后+1,循环第1页  
9. }  

方法2：瞒天过海。此方法中无论数据源有多少个，UIScrollView只保留其中三个视图，其实这是方法1的变种。当你滑动UIScrollView的时候，无非是向前滑动，或者是向后滑动，所以能够组成无限循环的基本条件就是前、中、后 三个视图。当你每次滑动的时候我都神不知鬼不觉的切换一下这三个视图。这也是和方法1 的最主要区别。

看看下面的区别：

[objc]  view plain copy

1. - (void)scrollViewDidEndDecelerating:(UIScrollView *)aScrollView {  
2.       
3.     [_scrollView setContentOffset:CGPointMake(_scrollView.frame.size.width, 0) animated:YES];  
4.       
5. }  

我们发现每一次滑动完成之后，UIScrollView总是重新切换回默认的中这一个视图。下面这个代理方法将要实现重置这三个视图：

[objc]  view plain copy

1. - (void)scrollViewDidScroll:(UIScrollView *)aScrollView {  
2.   
3.     int x = aScrollView.contentOffset.x;  
4.     //往下翻一张  
5.     if(x >= (2*self.frame.size.width)) {  
6.         [self loadData];  
7.     }  
8.     //往上翻  
9.     if(x <= 0) {  
10.         [self loadData];  
11.     }  
12. }  

loadData() 的实现原理非常简单，现将UIScrollView的所有视图移除，在重新根据数据源绘图来加载到UIScrollView中。

[objc]  view plain copy

1. - (void)loadData  
2. {      
3.     //从scrollView上移除所有的subview  
4.     NSArray *subViews = [_scrollView subviews];  
5.     if([subViews count] != 0) {  
6.         [subViews makeObjectsPerformSelector:@selector(removeFromSuperview)];  
7.     }  
8.           
9.     for (int i = 0; i < 3; i++) {  //只有3个视图  
10.         UIView *v = [_curViews objectAtIndex:i];  
11.         v.frame = CGRectOffset(v.frame, v.frame.size.width * i, 0);  
12.         [_scrollView addSubview:v];  
13.     }  
14.       
15.     [_scrollView setContentOffset:CGPointMake(_scrollView.frame.size.width, 0)];  
16. }  

至于你怎么绘图就是你的事情了，我这里只是简单的分析一下。

自动无限循环

刚才讲解了无限循环的两种不同实现方法，下面来讲解一下如何让它自动滑动。我想大家都用过NSTimer，没错，用它来实现简单的计时器最好不过了。

在适当位置初始化一个NSTimer，设定3秒执行一次runTimePage()方法：

[objc]  view plain copy

1. // 定时器 循环  
2.  [NSTimer scheduledTimerWithTimeInterval:3 target:self selector:@selector(runTimePage) userInfo:nil repeats:YES];  

 

在runTimePage()方法中，我们将要实现获取当前page页数，然后跳转到下一个page。

[objc]  view plain copy

1. - (void)runTimePage  
2. {  
3.     int page = pageControl.currentPage; // 获取当前的page  
4.     page++;  
5.     pageControl.currentPage = page > [slideImages count]-2 ? 0 : page ;  
6.     [self.scrollView setContentOffset:CGPointMake(320*(page+1),0) animated:YES];  
7. }  

是不是很简单呢~~

贴出几个参考demo地址，有兴趣的同学可以去看看。以上分析仅供参