原文：http://www.cnblogs.com/wendingding/p/3763527.html
iOS开发UI篇—UIScrollView控件实现图片轮播
一、实现效果
实现图片的自动轮播
二、实现代码
storyboard中布局
代码：
#import "YYViewController.h" @interface YYViewController () <UIScrollViewDelegate>
@property (weak, nonatomic) IBOutlet UIScrollView *scrollview;
/**
* 页码
*/
@property (weak, nonatomic) IBOutlet UIPageControl *pageControl; @property (nonatomic, strong) NSTimer *timer;
@end @implementation YYViewController - (void)viewDidLoad
{
[super viewDidLoad]; // 图片的宽
CGFloat imageW = self.scrollview.frame.size.width;
// CGFloat imageW = 300;
// 图片高
CGFloat imageH = self.scrollview.frame.size.height;
// 图片的Y
CGFloat imageY = ;
// 图片中数
NSInteger totalCount = ;
// 1.添加5张图片
for (int i = ; i < totalCount; i++) {
UIImageView *imageView = [[UIImageView alloc] init];
// 图片X
CGFloat imageX = i * imageW;
// 设置frame
imageView.frame = CGRectMake(imageX, imageY, imageW, imageH);
// 设置图片
NSString *name = [NSString stringWithFormat:@"img_0%d", i + ];
imageView.image = [UIImage imageNamed:name];
// 隐藏指示条
self.scrollview.showsHorizontalScrollIndicator = NO; [self.scrollview addSubview:imageView];
} // 2.设置scrollview的滚动范围
CGFloat contentW = totalCount *imageW;
//不允许在垂直方向上进行滚动
self.scrollview.contentSize = CGSizeMake(contentW, ); // 3.设置分页
self.scrollview.pagingEnabled = YES; // 4.监听scrollview的滚动
self.scrollview.delegate = self; [self addTimer];
} - (void)nextImage
{
int page = (int)self.pageControl.currentPage;
if (page == ) {
page = ;
}else
{
page++;
} // 滚动scrollview
CGFloat x = page * self.scrollview.frame.size.width;
self.scrollview.contentOffset = CGPointMake(x, );
} // scrollview滚动的时候调用
- (void)scrollViewDidScroll:(UIScrollView *)scrollView
{
NSLog(@"滚动中");
// 计算页码
// 页码 = (contentoffset.x + scrollView一半宽度)/scrollView宽度
CGFloat scrollviewW = scrollView.frame.size.width;
CGFloat x = scrollView.contentOffset.x;
int page = (x + scrollviewW / ) / scrollviewW;
self.pageControl.currentPage = page;
} // 开始拖拽的时候调用
- (void)scrollViewWillBeginDragging:(UIScrollView *)scrollView
{
// 关闭定时器(注意点; 定时器一旦被关闭,无法再开启)
// [self.timer invalidate];
[self removeTimer];
} - (void)scrollViewDidEndDragging:(UIScrollView *)scrollView willDecelerate:(BOOL)decelerate
{
// 开启定时器
[self addTimer];
} /**
* 开启定时器
*/
- (void)addTimer{ self.timer = [NSTimer scheduledTimerWithTimeInterval: target:self selector:@selector(nextImage) userInfo:nil repeats:YES];
}
/**
* 关闭定时器
*/
- (void)removeTimer
{
[self.timer invalidate];
}
@end
补充：
1.先介绍下UIScrollView的常见属性
@property(nonatomic) CGPoint contentOffset; // 记录UIScrollView滚动的位置
@property(nonatomic) CGSize contentSize; // 内容尺寸（能滚动的范围）
@property(nonatomic) UIEdgeInsets contentInset; // 额外增加的滚动区域（在上下左右4个边缘）
@property(nonatomic,assign) id<UIScrollViewDelegate> delegate; // 代理对象
@property(nonatomic) BOOL bounces; // 是否有弹簧效果
@property(nonatomic) BOOL showsHorizontalScrollIndicator; // 是否显示水平滚动条
@property(nonatomic) BOOL showsVerticalScrollIndicator; // 是否显示垂直滚动条
2.分页浏览的实现
2.1.把需要显示的图片设置进UIScrollView
CGFloat w = self.view.frame.size.width;
CGFloat h = self.view.frame.size.height;
for (int i = ; i< kCount; i++) {
UIImageView *imageView = [[UIImageView alloc] init]; // 1.设置frame
imageView.frame = CGRectMake(i * w, , w, h); // 2.设置图片
NSString *imgName = [NSString stringWithFormat:@"0%d.jpg", i + ];
imageView.image = [UIImage imageNamed:imgName]; [_scrollView addSubview:imageView];
2.2.设置UIScrollView的相关属性
属性在文章的开头有介绍
// height == 0 代表 禁止垂直方向滚动
_scrollView.contentSize = CGSizeMake(kCount * w, );
_scrollView.showsHorizontalScrollIndicator = NO;
_scrollView.pagingEnabled = YES;
_scrollView.delegate = self;
2.3.设置UIPageControl的相关属性，计算页码
UIPageControl *pageControl = [[UIPageControl alloc] init];
pageControl.center = CGPointMake(w * 0.5, h - );
pageControl.bounds = CGRectMake(, , , );
pageControl.numberOfPages = kCount; // 一共显示多少个圆点（多少页）
// 设置非选中页的圆点颜色
pageControl.pageIndicatorTintColor = [UIColor redColor];
// 设置选中页的圆点颜色
pageControl.currentPageIndicatorTintColor = [UIColor blueColor]; // 禁止默认的点击功能
pageControl.enabled = NO; [self.view addSubview:pageControl];
_pageControl = pageControl;
2.4.滚动时切换页码
#pragma mark - UIScrollView的代理方法
#pragma mark 当scrollView正在滚动的时候调用
- (void)scrollViewDidScroll:(UIScrollView *)scrollView
{
int page = scrollView.contentOffset.x / scrollView.frame.size.width;
// NSLog(@"%d", page); // 设置页码
_pageControl.currentPage = page;
}
