iOS-UIScrollView实现图片循环轮播

图片轮播UIScrollView

相信大家都有的共识就是，绝大数类型的APP里都会有图片轮播，特别是电商类的APP里更是用得多，今天我就利用UIScrollView实现个简单的图片全屏轮播
废话不说，上代码：
1.首先在拓展里定义需要用到的宏和变量
#define CJFScreenWidth ([UIScreen mainScreen].bounds.size.width)
#define CJFScreenHeight ([UIScreen mainScreen].bounds.size.height)
@property (nonatomic, strong) UIScrollView *scrollView;
@property (nonatomic, strong) UIPageControl *pageCtrl;
@property (nonatomic, strong) UIView *CJFView;

2、然后逐步实现如下方法

第一步：
#pragma mark 1、创建轮播视图scrollView
-(void)layoutScrollView {

// 创建scrollView
self.scrollView = [[UIScrollView alloc]initWithFrame:CGRectMake(0, 0, CJFScreenWidth, CJFScreenHeight)];

// 设置scrollView的可滚动区域
self.scrollView.contentSize = CGSizeMake(8*CJFScreenWidth, 0);

// 设置scrollView的背景颜色
self.scrollView.backgroundColor = [UIColor brownColor];

// 设置scrollView滚动条的显示
self.scrollView.showsHorizontalScrollIndicator = NO;

// 设置委托代理并遵守<UIScrollViewDelegate>
self.scrollView.delegate = self;

// 设置scrollView的分页效果
self.scrollView.pagingEnabled = YES;

// 添加到父视图
[self.view addSubview:self.scrollView];

}

第二步：
#pragma mark 2、添加图片到scrollView
-(void)layoutImageView {

for (int i = 0; i < 8; i++) {
    // 创建图片名字符串
    NSString *imgN = [NSString stringWithFormat:@"%dpic.jpg", (i+1)];
    // 加载图片
    UIImage *img = [UIImage imageNamed:imgN];
    // 创建图片视图
    UIImageView *imgV = [[UIImageView alloc]initWithImage:img];
    // 设置图片视图的frame
    imgV.frame = CGRectMake(0, 0, CJFScreenWidth, CJFScreenHeight);
    // 创建子scrollView
    UIScrollView *subScrollView = [[UIScrollView alloc]initWithFrame:CGRectMake(i*CJFScreenWidth, 0, CJFScreenWidth, CJFScreenHeight)];
    // 把imgV添加到子scrollView中
    [subScrollView addSubview:imgV];
    // 设置委托（代理）
    subScrollView.delegate = self;
    // 设置scrollView的可缩小比例
    subScrollView.minimumZoomScale = 0.5;
    subScrollView.maximumZoomScale = 2;
    // 设置隐藏横向和竖向的滚动条
    subScrollView.showsVerticalScrollIndicator = NO;
    subScrollView.showsHorizontalScrollIndicator = NO;
    
    // 添加到父视图
    [self.scrollView addSubview:subScrollView];
    }

}

第三步：
#pragma mark 3、添加分页控件pageControl
-(void)layoutPageControl {
// 创建分页控件
self.pageCtrl = [[UIPageControl alloc]initWithFrame:CGRectMake(10, CJFScreenHeight-40, CJFScreenWidth-20, 30)];

// 设置分页控件的总页数
self.pageCtrl.numberOfPages = 8;

// 添加到父视图
[self.view addSubview:self.pageCtrl];

// 实现pageCtrl的响应方法
[self.pageCtrl addTarget:self action:@selector(pageCtrlChangeAction:) forControlEvents:UIControlEventValueChanged];

}

第四步：
#pragma mark 4、实现scrollView的scrollViewDidScroll:方法
- (void)scrollViewDidScroll:(UIScrollView *)scrollView {
// 设置分页控件与scrollView相对应的currentPage
// 利用scrollView的当前偏移量计算
self.pageCtrl.currentPage =
(int)self.scrollView.contentOffset.x / CJFScreenWidth;
}

第五步：

#pragma mark 5、实现pageCtrl的pageCtrlChangeAction:方法
-(void)pageCtrlChangeAction: (id)sender {
// 设置scrollView的偏移量
self.scrollView.contentOffset = 
CGPointMake(self.pageCtrl.currentPage * CJFScreenWidth, 0)；    
}

第六步：
#pragma mark 6、实现缩放的响应方法
- (UIView *)viewForZoomingInScrollView:(UIScrollView )scrollView {
// 告诉代理，当前响应缩放操作的是哪一个子视图
return [scrollView.subviews objectAtIndex:0];
}
第七步：
#pragma mark 7、添加定时器并实现响应方法
-(void)timerAction: (id)sender {
// 利用静态变量来控制图片的循环
static int i = 0;
if (i == 8) {
i = 0;
}
// 利用scrollView的偏移量实现轮播图片的播放
self.scrollView.contentOffset = CGPointMake(iCJFScreenWidth, 0);
i++;
}

3、编译运行（当然这里用到的图片需要提前放到项目目录里）。