UI 一一 使用ScrollView和PageController实现引导页分页效果

实现这样的功能(图片轮播器)

话不多少直接上代码:

#import "ViewController.h"

@interface ViewController () <UIScrollViewDelegate>

@property (weak, nonatomic) IBOutlet UIScrollView *scrollView;

@property (weak, nonatomic) IBOutlet UIPageControl *pageController;

/** 定时器 */
@property (nonatomic,weak) NSTimer *timer;


@end

@implementation ViewController

- (void)viewDidLoad {
    [super viewDidLoad];
    
    //1.添加图片
    CGFloat scrollViewW = self.scrollView.frame.size.width;
    CGFloat scrollViewH = self.scrollView.frame.size.height;
    
    int count = 5;
    for (int i = 0; i < count; ++i) {
        UIImageView *imageView = [[UIImageView alloc] init];
        NSString *name = [NSString stringWithFormat:@"img_0%d",i + 1];
        imageView.image = [UIImage imageNamed:name];
        imageView.frame = CGRectMake(i * scrollViewW, 0, scrollViewW, scrollViewH);
        [self.scrollView addSubview:imageView];
    }
    
    //2. 设置contentSize
    // 这个0表示竖直方向不可以滚动,当contentSize的尺寸 <= 可视尺寸,就不可以滚动
    self.scrollView.contentSize = CGSizeMake(count * scrollViewW, 0);
    
    //3. 开启分页功能
    // 以UIScrollView的尺寸为一页
    self.scrollView.pagingEnabled = YES;
    
    //4. 设置总页数
    self.pageController.numberOfPages = count;
    
    //5. 单页的时候是否隐藏pageController
    self.pageController.hidesForSinglePage = YES;
    
    //6. 设置pageController的图片
    [self.pageController setValue:[UIImage imageNamed:@"current"] forKeyPath:@"_currentPageImage"];
    [self.pageController setValue:[UIImage imageNamed:@"other"] forKeyPath:@"_pageImage"];
    
    /**
        定时器
     interval: 时间
     target : self(控制器)
     userInfo: 用户信息,nil
     repeats: 是否重复
     
     有个强指针引用这个定时器,用weak定义就行
     */
    // 7. 开启定时器
    [self startTimer];
    
}

// 线程
// 主线程:程序一启动,系统会默认创建一条线程.
// 主线程作用:显示刷新UI界面,处理与用用户的交互事件
// 多线程的原理: 1s --->  1万个0.0001s

#pragma -mark 定时器相关代码

- (void)startTimer
{
    // 返回一个自动执行的定时器对象
    self.timer = [NSTimer scheduledTimerWithTimeInterval:2.0 target:self selector:@selector(nextPage:) userInfo:@"桂阳" repeats:YES];
    
    // NSDefaultRunLoopMode(默认): 同一时间只能执行一个任务
    // NSRunLoopCommonModes(公用): 可以分配一定的时间执行其他任务
    // 作用:修改timer在runLoop中的模式为NSRunLoopCommonModes
    // 目的:不管主线程在做什么操作,都会分配一定的时间处理定时器
    [[NSRunLoop mainRunLoop] addTimer:self.timer forMode:NSRunLoopCommonModes];

}

- (void)stopTimer
{
    [self.timer invalidate];
    self.timer = nil;
}


/**
    滚到下一页
 */
- (void)nextPage : (NSTimer *)timer
{
//    NSLog(@"%@",timer.userInfo);
    //1. 计算下一页的页码
    NSInteger page = self.pageController.currentPage + 1;
    
    //2. 超过了最后一页
    if (page == 5) {
        page = 0;
    }
    
    //3. 滚动到下一页
    [self.scrollView setContentOffset:CGPointMake(page * self.scrollView.frame.size.width, 0) animated:YES];
}


#pragma mark - UIScrollViewDelegate

/*
    当下一张图片大于可视区域,设置页码
 */
- (void)scrollViewDidScroll:(UIScrollView *)scrollView
{
    // 内容偏移量的x / 可视区域宽度 + 0.5
    // 四舍五入: int(小数 + 0.5)

        // 1.计算页码
        int page = scrollView.contentOffset.x / scrollView.frame.size.width + 0.5;
        // 2.设置页码
        self.pageController.currentPage = page;
}


/**
    用户即将开始拖拽scrollView时,停止定时器
 */
- (void)scrollViewWillBeginDragging:(UIScrollView *)scrollView
{
    [self stopTimer];
}


/**
    用户已经停止拖拽scrollView时,开启定时器
 */
- (void)scrollViewDidEndDragging:(UIScrollView *)scrollView willDecelerate:(BOOL)decelerate
{
    [self startTimer];
}

@end