UIScrollView循环滚动1

现在基本每一个商业APP都会有循环滚动视图，放一些轮播广告之类的，都是放在UIScrollView之上。假如我要实现N张图片的轮播，我借鉴了几个博文，得到两种方法实现：

【第一种】：如下图（图片来源于kenshin cui‘s的博客），假如要实现3张图片轮播，我们就设置UIScrollView上的imageView为3+2个，图片顺序为31231。

初始加载UIScrollView时候，滚动到第二个imageView上。

当滚动到最后一个imageview时候，设置UIScrollView的ContentOffset到第二个imageView。

当往前滚动到第一个imageview时候，设置UIScrollView的ContentOffset到倒数第二个imageview。

具体代码如下：

 1 #import "ViewController.h" 2 //定义宏，获取屏幕宽高 3 #define SCREEN_WIDTH [UIScreen mainScreen].bounds.size.width 4 #define SCREEN_HEIGHT [UIScreen mainScreen].bounds.size.height 5  6 @interface ViewController ()<UIScrollViewDelegate> 7 /** 滚动视图*/ 8 @property (nonatomic,strong)UIScrollView *scrollView; 9 /** 图片数组*/10 @property (nonatomic,strong)NSMutableArray *imageArray;11 @end12 13 @implementation ViewController14 //懒加载滚动视图15 -(UIScrollView *)scrollView{16   if (!_scrollView) {17     _scrollView = [[UIScrollView alloc]init];18   }19   return _scrollView;20 }21 //懒加载图片数组22 -(NSMutableArray *)imageArray{23   if (!_imageArray) {24     _imageArray = [NSMutableArray array];25   }26   return _imageArray;27 }28 29 30 - (void)viewDidLoad {31   [super viewDidLoad];32   //先加载图片33   [self loadImageArray];34   //再设置滚动视图35   [self setupScrollview];36 }37 //加载图片，假设有3张图片 welcome1 welcome2 welcome338 -(void)loadImageArray{39   for (NSInteger i = 0 ; i<3; i++) {40     UIImage *image = [UIImage imageNamed:[NSString stringWithFormat:@"welcome%ld",i+1]];41     [self.imageArray addObject:image];42   }43 }44 //设置scrollview45 -(void)setupScrollview{46   //设置可见区域47   self.scrollView.frame = self.view.bounds;48   //设置容量49   self.scrollView.contentSize = CGSizeMake(SCREEN_WIDTH*(self.imageArray.count + 2), SCREEN_HEIGHT);50   //翻页模式51   self.scrollView.pagingEnabled = YES;52   //代理53   self.scrollView.delegate = self;54   //边缘不能弹跳55   self.scrollView.bounces = NO;56   //隐藏水平滚动条57   self.scrollView.showsHorizontalScrollIndicator = NO;58   [self.view addSubview:self.scrollView];59   //循环添加imageView60   for (NSInteger i = 0; i < self.imageArray.count + 2; i++) {61     UIImageView *imageView = [[UIImageView alloc]initWithFrame:CGRectMake(i *SCREEN_WIDTH, 0, SCREEN_WIDTH, SCREEN_HEIGHT)];62     if (i == 0) {//0->lastObject63       imageView.image = self.imageArray.lastObject;64     }else if (i == self.imageArray.count + 1){//4->firstObject65       imageView.image = self.imageArray.firstObject;66     }else{//1->0 2->1 3->267       imageView.image = self.imageArray[i-1];68     }69     [self.scrollView addSubview:imageView];70   }71   //设置初始滚动的位置为第二个imageView72   self.scrollView.contentOffset = CGPointMake(SCREEN_WIDTH, 0);73 }74 //当停止滚动时候，重新设置 scrollview的ContentOffset75 -(void)scrollViewDidEndDecelerating:(UIScrollView *)scrollView{76   CGPoint point = scrollView.contentOffset;77   if (point.x/SCREEN_WIDTH > self.imageArray.count) {//当滚动到最后的时候78     [self.scrollView setContentOffset:CGPointMake(SCREEN_WIDTH, 0) animated:NO];79   }else if (point.x/SCREEN_WIDTH < 1){//当滚动到最前的时候80     [self.scrollView setContentOffset:CGPointMake(SCREEN_WIDTH*self.imageArray.count, 0) animated:NO];81   }82 }

可以新建项目，直接复制该代码，在loadImageArray方法里面修改成加载自己的图片，运行即可。

【第二种】：假如有100张图片或者更多，就得加载100+2个imageview，显然对性能要求就得更高，因此衍生出了第二种。

就是无论你有多少张图片，imageview始终只有3个。

无论你怎么滚动，当滚动完毕的时候，UIScrollView的ContentOffset都是中间的一个imageview。

只是我们在UIScrollView的代理方法里面不断改变每一个imageview.image的图片而已。

第二种源码我会在后续博文补充。

其实，这个循环滚动学的不是会敲代码，而是一种思路。

最后推荐一个github很好用的类似第三方类库SDCycleScrollView，星星两千多，很不错。

原标题：UIScrollView循环滚动1

关键词：ie