iOS开发 - UIPageControl实现分页图片轮播器
分页相关属性
只要将UIScrollView的pageEnabled属性设置为YES,UIScrollView会被分割成多个独立页面,里面的内容就能进行分页展示
一般会配合UIPageControl增强分页效果,UIPageControl常用属性如下
一共有多少页
@property(nonatomic) NSInteger numberOfPages;
当前显示的页码
@property(nonatomic) NSInteger currentPage;
只有一页时,是否需要隐藏页码指示器
@property(nonatomic) BOOL hidesForSinglePage;
其他页码指示器的颜色
@property(nonatomic,retain) UIColor *pageIndicatorTintColor;
当前页码指示器的颜色
@property(nonatomic,retain) UIColor *currentPageIndicatorTintColor;
分页图片轮播器实例
#define ImageCount 5
#import "ViewController.h"
@interface ViewController ()<UIScrollViewDelegate>
@property (weak, nonatomic) IBOutlet UIScrollView *scrollView;
@property (weak, nonatomic) IBOutlet UIPageControl *pageControl;
/**
* 定时器
*/
@property(nonatomic,strong)NSTimer* timer;
@end
@implementation ViewController
- (void)viewDidLoad {
[super viewDidLoad];
//0.一些固定的尺寸参数
CGFloat imageW=self.scrollView.frame.size.width;
CGFloat imageH=self.scrollView.frame.size.height;
CGFloat imageY=0;
//1.添加imageCount个图片到scrollView中
for (int i=0; i<ImageCount; i++) {
UIImageView* imageView =[[UIImageView alloc]init];
//设置frame
CGFloat imageX=i*imageW;
imageView.frame=CGRectMake(imageX, imageY, imageW, imageH);
//设置图片
NSString* name=[NSString stringWithFormat:@"img_0%d",i+1];
imageView.image=[UIImage imageNamed:name];
[self.scrollView addSubview:imageView];
}
//2.设置内容尺寸
CGFloat contentW=ImageCount*imageW;
self.scrollView.contentSize=CGSizeMake(contentW, 0);
//3.隐藏水平滚动条
self.scrollView.showsHorizontalScrollIndicator=NO;
//4.分页
self.scrollView.pagingEnabled=YES;
self.scrollView.delegate=self;
//5.设置pageControl的总页数
self.pageControl.numberOfPages=ImageCount;
//6.添加定时器(每隔2秒调用一次self的nextImage方法)
[self addTimer];
}
/**
* 添加定时器
*/
- (void)addTimer
{
self.timer=[NSTimer scheduledTimerWithTimeInterval:2.0 target:self selector:@selector(nextImage) userInfo:nil repeats:YES];
//循环控制多线程
[[NSRunLoop currentRunLoop] addTimer:self.timer forMode:NSRunLoopCommonModes];
}
/**
* 移除定时器
*/
- (void)removeTimer
{
[self.timer invalidate];
self.timer=nil;
}
/**
* 下一张图片
*/
- (void)nextImage
{
//1.增加pageControl的页码
int page=0;
if (self.pageControl.currentPage==ImageCount-1) {
page=0;
}else{
page=self.pageControl.currentPage+1;
}
//2.计算scrollView滚动的位置
CGFloat offsetX=page*self.scrollView.frame.size.width;
CGPoint offset=CGPointMake(offsetX, 0);
[self.scrollView setContentOffset:offset animated:YES];
}
#pragma mark - 代理方法
/**
* 当scrollView正在滚动就会调用
*/
- (void) scrollViewDidScroll:(UIScrollView *)scrollView
{
//根据scrollView的滚动位置决定pageControl显示第几页
CGFloat scrollW=scrollView.frame.size.width;
int page=(scrollView.contentOffset.x+scrollW*0.5)/scrollW;
self.pageControl.currentPage=page;
}
/**
* 开始拖拽的时候调用
*/
- (void)scrollViewWillBeginDecelerating:(UIScrollView *)scrollView
{
//停止定时器(一旦定时器停止了,就不能在使用了)
[self removeTimer];
}
/**
* 停止拖拽的时候调用
*/
- (void)scrollViewDidEndDragging:(UIScrollView *)scrollView willDecelerate:(BOOL)decelerate
{
//开启定时器
[self addTimer];
}
@end
Storyboard
效果图
郑重声明:本站内容如果来自互联网及其他传播媒体,其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享,并不代表本站赞同其观点和对其真实性负责,也不构成任何其他建议。