滚动栏的实现 利用UIScrollView和UIPageControl、定时器

 

1. UIPageControl 的常见属性

一般会配合UIPageControl增强分页效果，UIPageControl常用属性如下 
一共有多少页
@property(nonatomic) NSInteger numberOfPages;

当前显示的页码
@property(nonatomic) NSInteger currentPage; 

只有一页时，是否需要隐藏页码指示器
@property(nonatomic) BOOL hidesForSinglePage; 

其他页码指示器的颜色
@property(nonatomic,retain) UIColor *pageIndicatorTintColor;

当前页码指示器的颜色
@property(nonatomic,retain) UIColor *currentPageIndicatorTintColor;

2. 定时器

NSTimer叫做“定时器”，它的作用如下
在指定的时间执行指定的任务
每隔一段时间执行指定的任务

调用下面的方法就会开启一个定时任务
+ (NSTimer *)scheduledTimerWithTimeInterval:(NSTimeInterval)titarget:(id)aTarget 
                                selector:(SEL)aSelector 
                                userInfo:(id)userInfo 
                                repeats:(BOOL)yesOrNo;
每隔ti秒，调用一次aTarget的aSelector方法，yesOrNo决定了是否重复执行这个任务

   scheduledTimerWithTimeInterval:(NSTimeInterval)seconds  

   预订一个Timer,设置一个时间间隔。

   表示输入一个时间间隔对象，以秒为单位，一个>0的浮点类型的值，如果该值<0,系统会默认为0.1

   target:(id)aTarget

   表示发送的对象，如self

   selector:(SEL)aSelector

   方法选择器，在时间间隔内，选择调用一个实例方法

   userInfo:(id)userInfo

   此参数可以为nil，当定时器失效时，由你指定的对象保留和释放该定时器。

   repeats:(BOOL)yesOrNo

   当YES时，定时器会不断循环直至失效或被释放，当NO时，定时器会循环发送一次就失效。

　　invocation:(NSInvocation *)invocation

 通过invalidate方法可以停止定时器的工作，一旦定时器被停止了，就不能再次执行任务。只能再创建一个新的定时器才能执行新的任务
- (void)invalidate;

 

 

 

 

 

 

 

 

 

4.  实例代码

#define MJImageCount 5

#import "MJViewController.h"

@interface MJViewController () <UIScrollViewDelegate>
@property (weak, nonatomic) IBOutlet UIScrollView *scrollView;
@property (weak, nonatomic) IBOutlet UIPageControl *pageControl;
/**
 *  定时器
 */
@property (nonatomic, strong) NSTimer *timer;
@end

@implementation MJViewController

- (void)viewDidLoad
{
    [super viewDidLoad];
    
    // 0.一些固定的尺寸参数
    CGFloat imageW = self.scrollView.frame.size.width;
    CGFloat imageH = self.scrollView.frame.size.height;
    CGFloat imageY = 0;
    
    // 1.添加5张图片到scrollView中
    for (int i = 0; i<MJImageCount; 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 = MJImageCount * 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 = MJImageCount;
    
    // 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 == MJImageCount - 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)scrollViewWillBeginDragging:(UIScrollView *)scrollView
{
    // 停止定时器(一旦定时器停止了,就不能再使用)
    [self removeTimer];
}

/**
 *  停止拖拽的时候调用
 */
- (void)scrollViewDidEndDragging:(UIScrollView *)scrollView willDecelerate:(BOOL)decelerate
{
    // 开启定时器
    [self addTimer];
}