三張 imageView實現輪播圖無限輪播

github地址：https://github.com/leshengping/SPCarouselScrollView

#import "SPCarouselScrollView.h"
#import "UIImageView+WebCache.h"

typedef NS_ENUM(NSInteger, SPCarouseImagesDataStyle){
    SPCarouseImagesDataInLocal,//本地圖片標記
    SPCarouseImagesDataInURL   //URL圖片標記
};

// width和height依賴於傳進來的frame
#define  kWidth  self.bounds.size.width
#define  kHeight self.bounds.size.height

@interface SPCarouselScrollView () <UIScrollViewDelegate>

@property(strong, nonatomic) UIScrollView *scrollView;
@property(strong, nonatomic) UIPageControl *pageControl;

// 存放本地圖片名字的數組
@property(strong, nonatomic) NSArray<NSString *> *localImages;
//存放圖片數組的網址
@property(strong, nonatomic) NSArray<NSString *> *urlImages;


// 前一個視圖,當前視圖,下一個視圖
@property(strong, nonatomic) UIImageView *lastImgView;
@property(strong, nonatomic) UIImageView *currentImgView;
@property(strong, nonatomic) UIImageView *nextImgView;

// 圖片來源(本地或URL)
@property(nonatomic) SPCarouseImagesDataStyle carouseImagesStyle;

@property(strong, nonatomic) NSTimer *timer;

// kCount = array.count,圖片數組個數
@property(assign, nonatomic) NSInteger kCount;

// 記錄nextImageView的下標 默認從1開始
@property(assign, nonatomic) NSInteger nextPhotoIndex;
// 記錄lastImageView的下標 默認從 _kCount - 1 開始
@property(assign, nonatomic) NSInteger lastPhotoIndex;

@property(strong, nonatomic) UILabel *label;

@end

@implementation SPCarouselScrollView

#pragma mark - 初始化方法
- (instancetype)initWithFrame:(CGRect)frame{
    self = [super initWithFrame:frame];
    if (self) {
        [self initialize];
    }
    return self;
}

- (void)initialize {
    _duration = 2;
    _autoScroll = YES;
    _pageControlColor = [UIColor grayColor];
    _currentPageControlColor = [UIColor whiteColor];
}

#pragma mark - 類方法
// 若是是本地圖片調用此方法
+(SPCarouselScrollView *)carouselScrollViewWithFrame:(CGRect)frame localImages:(NSArray<NSString *> *)localImages{
    SPCarouselScrollView *carouseScroll =[[SPCarouselScrollView alloc]initWithFrame:frame];
    // 調用set方法
    carouseScroll.localImages = localImages;
    return carouseScroll;
}

// 若是是網絡圖片調用此方法
+(SPCarouselScrollView *)carouselScrollViewWithFrame:(CGRect)frame urlImages:(NSArray<NSString *> *)urlImages{
    SPCarouselScrollView *carouseScroll = [[SPCarouselScrollView alloc]initWithFrame:frame];
    // 調用set方法
    carouseScroll.urlImages = urlImages;
    return carouseScroll;
}

#pragma mark - setter方法專區
// 是否自動輪播
- (void)setAutoScroll:(BOOL)autoScroll {
    _autoScroll = autoScroll;

    if (autoScroll) {
        // 開啓新的定時器
        [self openTimer];
    } else {
        // 關閉定時器
        [self closeTimer];
    }
}

// 重寫duration的set方法,用戶能夠在外界設置輪播圖間隔時間
-(void)setDuration:(NSTimeInterval)duration{
    _duration = duration;
    [self openTimer];
}

// 設置其餘小圓點的顏色
- (void)setPageControlColor:(UIColor *)pageControlColor {
    _pageControlColor = pageControlColor;
    _pageControl.pageIndicatorTintColor = pageControlColor;
}

// 設置當前小圓點的顏色
- (void)setCurrentPageControlColor:(UIColor *)currentPageControlColor {
    _currentPageControlColor = currentPageControlColor;
    _pageControl.currentPageIndicatorTintColor = currentPageControlColor;
}

// 設置其餘小圓點的圖片
- (void)setPageControlImage:(UIImage *)pageControlImage {
    if (pageControlImage == nil) {
        NSLog(@"Error:其他小圓點的圖片爲nil,請檢查");
        return;
    }
    _pageControlImage = pageControlImage;
    [_pageControl setValue:_pageControlImage forKeyPath:@"pageImage"];
    dispatch_after(dispatch_time(DISPATCH_TIME_NOW, (int64_t)(1.0 * NSEC_PER_SEC)), dispatch_get_main_queue(), ^{
        if (_currentPageControlImage == nil) {
            NSLog(@"Error:您只設置了其他小圓點的圖片,沒有設置當前小圓點的圖片");
        }
    });
}

// 設置當前小圓點的圖片
- (void)setCurrentPageControlImage:(UIImage *)currentPageControlImage {
    if (currentPageControlImage == nil) {
        NSLog(@"Error:當前小圓點的圖片爲nil,請檢查");
        return;
    }
    _currentPageControlImage = currentPageControlImage;
    [_pageControl setValue:_currentPageControlImage forKeyPath:@"currentPageImage"];
    dispatch_after(dispatch_time(DISPATCH_TIME_NOW, (int64_t)(1.0 * NSEC_PER_SEC)), dispatch_get_main_queue(), ^{
        if (_pageControlImage == nil) {
            NSLog(@"Error:您只設置了當前小圓點的圖片,沒有設置其餘小圓點的圖片");
        }
    });
}

// 設置pageControl的位置
- (void)setPageContolAliment:(SPCarouseScrollViewPageContolAliment)pageContolAliment {
    _pageContolAliment = pageContolAliment;

    switch (pageContolAliment) {
        case SPCarouseScrollViewPageContolAlimentCenter:
            // 若是是中間
            _pageControl.frame = CGRectMake(0, 0, kWidth, 30);
            _pageControl.center = CGPointMake(kWidth * 0.5, kHeight - 30 / 2);
            break;
        case SPCarouseScrollViewPageContolAlimentRight:
            // 若是是右邊
            _pageControl.frame = CGRectMake(0, 0, kWidth, 30);
            _pageControl.center = CGPointMake(kWidth * 0.5 * 1.5, kHeight - 30 / 2);
            break;
        case SPCarouseScrollViewPageContolAlimentLeft:
            // 若是是左邊
            _pageControl.frame = CGRectMake(0, 0, kWidth, 30);
            _pageControl.center = CGPointMake(kWidth * 0.5 * 0.5, kHeight - 30 / 2);
            break;
        default:
            break;
    }
}

// 設置imageView的內容模式
- (void)setImageMode:(SPCarouselScrollViewImageMode)imageMode {
    _imageMode = imageMode;

    switch (imageMode) {
        case SPCarouselScrollViewImageModeScaleToFill:
            _lastImgView.contentMode = UIViewContentModeScaleToFill;
            _currentImgView.contentMode = UIViewContentModeScaleToFill;
            _nextImgView.contentMode = UIViewContentModeScaleToFill;
            break;
        case SPCarouselScrollViewImageModeScaleAspectFit:
            _lastImgView.contentMode = UIViewContentModeScaleAspectFit;
            _currentImgView.contentMode = UIViewContentModeScaleAspectFit;
            _nextImgView.contentMode = UIViewContentModeScaleAspectFit;
            break;
        case SPCarouselScrollViewImageModeScaleAspectFill:
            _lastImgView.contentMode = UIViewContentModeScaleAspectFill;
            _currentImgView.contentMode = UIViewContentModeScaleAspectFill;
            _nextImgView.contentMode = UIViewContentModeScaleAspectFill;
            break;
        case SPCarouselScrollViewImageModeCenter:
            _lastImgView.contentMode = UIViewContentModeCenter;
            _currentImgView.contentMode = UIViewContentModeCenter;
            _nextImgView.contentMode = UIViewContentModeCenter;
            break;
        default:
            break;
    }
}

- (void)setLocalImages:(NSArray<NSString *> *)localImages {
    if (_localImages != localImages) {
        _localImages = nil;
        _localImages = localImages;
    }
    //標記圖片來源
    self.carouseImagesStyle = SPCarouseImagesDataInLocal;
    //獲取數組個數
    self.kCount = _localImages.count;
    [self drawMyView];

    [self openTimer];
}

- (void)setUrlImages:(NSArray<NSString *> *)urlImages {
    if (_urlImages != urlImages) {
        _urlImages = nil;
        _urlImages = urlImages;
    }
    //標記圖片來源
    self.carouseImagesStyle = SPCarouseImagesDataInURL;
    self.kCount = _urlImages.count;
    [self drawMyView];

    [self openTimer];
}

#pragma maek - 其它方法
-(void)drawMyView{
    [self addSubview:self.scrollView];
    [self addSubview:self.pageControl];
    self.nextPhotoIndex = 1;
    self.lastPhotoIndex = _kCount - 1;

    //想在輪播圖上添加其餘子控件可在這裏添加
    /*
     self.label = [[UILabel alloc]initWithFrame:CGRectMake(50, 500,kWidth-100, 30)];
     self.label.backgroundColor = [UIColor redColor];
     [self addSubview:self.label];
     */
}

// 開啓定時器
- (void)openTimer {
    // 開啓以前必定要先將上一次開啓的定時器關閉,不然會跟新的定時器重疊
    [self closeTimer];
    NSTimer *timer = [NSTimer scheduledTimerWithTimeInterval:self.duration target:self selector:@selector(timerAction) userInfo:self repeats:YES];
    // UITrackingRunLoopMode模式的做用是當用戶拖動tableView、collectionView等事件時定時器仍然會處理事件
    [[NSRunLoop currentRunLoop] addTimer:timer forMode:UITrackingRunLoopMode];
    _timer = timer;
}

// 關閉定時器
- (void)closeTimer {
    [_timer invalidate];
    _timer = nil;
}

#pragma mark - 懶加載
-(UIScrollView *)scrollView{
    if (_scrollView == nil) {
        _scrollView = [[UIScrollView alloc]initWithFrame:self.bounds];
        _scrollView.pagingEnabled = YES;
        _scrollView.bounces = NO;
        _scrollView.showsHorizontalScrollIndicator = NO;
        _scrollView.showsVerticalScrollIndicator = NO;
        _scrollView.contentSize = CGSizeMake(kWidth * 3, kHeight);
        //顯示中間的圖片
        _scrollView.contentOffset = CGPointMake(kWidth, 0);
        _scrollView.delegate = self;
        // 添加最初的三張imageView
        [_scrollView addSubview:self.lastImgView];
        [_scrollView addSubview:self.currentImgView];
        [_scrollView addSubview:self.nextImgView];
    }
    return _scrollView;
}

-(UIPageControl *)pageControl{
    if (_pageControl == nil) {
        _pageControl = [[UIPageControl alloc]initWithFrame:CGRectMake(0, 0, kWidth, 30)];
        _pageControl.center = CGPointMake(kWidth/2.0, kHeight - 30/2.0);
        _pageControl.userInteractionEnabled = NO;
        _pageControl.hidesForSinglePage = YES;
        _pageControl.pageIndicatorTintColor = self.pageControlColor;
        _pageControl.currentPageIndicatorTintColor = self.currentPageControlColor;
        _pageControl.numberOfPages = self.kCount;
        _pageControl.currentPage = 0;
    }
    return _pageControl;
}

-(UIImageView *)lastImgView{
    if (_lastImgView == nil) {
        _lastImgView = [[UIImageView alloc]initWithFrame:CGRectMake(0, 0, kWidth, kHeight)];
        // 一上來，將上一張圖片設置爲數組中最後一張圖片
        [self setImageView:_lastImgView withSubscript:(_kCount-1)];
    }
    return _lastImgView;
}

-(UIImageView *)currentImgView{
    if (_currentImgView == nil) {
        _currentImgView = [[UIImageView alloc]initWithFrame:CGRectMake(kWidth, 0, kWidth, kHeight)];
        // 一上來，將當前圖片設置爲數組中第一張圖片
        [self setImageView:_currentImgView withSubscript:0];
        // 給當前圖片添加手勢
        UITapGestureRecognizer *tap = [[UITapGestureRecognizer alloc]initWithTarget:self action:@selector(handleTapActionInImageView:)];
        [_currentImgView addGestureRecognizer:tap];
        _currentImgView.userInteractionEnabled = YES;
    }
    return _currentImgView;
}

-(UIImageView *)nextImgView{
    if (_nextImgView == nil) {
        _nextImgView = [[UIImageView alloc]initWithFrame:CGRectMake(kWidth*2, 0,kWidth , kHeight)];
        // 一上來，將下一張圖片設置爲數組中第二張圖片,若是數組只有一張圖片，則上、中、下圖片所有是數組中的第一張圖片
        [self setImageView:_nextImgView withSubscript:_kCount == 1 ? 0 : 1];
    }
    return _nextImgView;
}

//根據下標設置imgView的image
-(void)setImageView:(UIImageView *)imgView withSubscript:(NSInteger)subcript{
    if (self.carouseImagesStyle == SPCarouseImagesDataInLocal) {
        imgView.image = [UIImage imageNamed:self.localImages[subcript]];
    } else{
        //網絡圖片設置, 若是要使用佔位圖請自行修改
        [imgView sd_setImageWithURL:[NSURL URLWithString:self.urlImages[subcript]] placeholderImage:nil];
    }
}

#pragma mark - scrollView代理方法
-(void)scrollViewDidScroll:(UIScrollView *)scrollView{
    //到第一張圖片時   (一上來，當前圖片的x值是kWidth)
    if (scrollView.contentOffset.x <= 0) {
        // 這個if語句只有scrollView往右滑時纔有會進入
        _nextImgView.image = _currentImgView.image;
        _currentImgView.image = _lastImgView.image;
        // 將輪播圖的偏移量設回中間位置
        scrollView.contentOffset = CGPointMake(kWidth, 0);
        _lastImgView.image = nil;
        // 必定要是小於等於，不然數組中只有一張圖片時會出錯
        if (_lastPhotoIndex <= 0) {
            _lastPhotoIndex = _kCount - 1;
            _nextPhotoIndex = _lastPhotoIndex - (_kCount - 2);
        } else {
            _lastPhotoIndex--;
            if (_nextPhotoIndex == 0) {
                _nextPhotoIndex = _kCount - 1;
            } else {
                _nextPhotoIndex--;
            }
        }
        [self setImageView:_lastImgView withSubscript:_lastPhotoIndex];
    }
    // 到最後一張圖片時（最後一張就是輪播圖的第三張）
    if (scrollView.contentOffset.x  >= kWidth*2) {
        // 這個if語句只有scrollView往左滑時纔會進入
        _lastImgView.image = _currentImgView.image;
        _currentImgView.image = _nextImgView.image;
        // 將輪播圖的偏移量設回中間位置
        scrollView.contentOffset = CGPointMake(kWidth, 0);
        _nextImgView.image = nil;
        // 必定要是大於等於，不然數組中只有一張圖片時會出錯
        if (_nextPhotoIndex >= _kCount - 1 ) {
            _nextPhotoIndex = 0;
            _lastPhotoIndex = _nextPhotoIndex + (_kCount - 2);
        } else{
            _nextPhotoIndex++;
            if (_lastPhotoIndex == _kCount - 1) {
                _lastPhotoIndex = 0;
            } else {
                _lastPhotoIndex++;
            }
        }
        [self setImageView:_nextImgView withSubscript:_nextPhotoIndex];
    }
}

// scrollView結束減速的時候調用
-(void)scrollViewDidEndDecelerating:(UIScrollView *)scrollView{
    //矯正pageCotrol的位置
    _pageControl.currentPage = _nextPhotoIndex - 1;
    if (_nextPhotoIndex - 1 < 0) {
        _pageControl.currentPage = _kCount-1;
    }
    ;
}

// 用戶將要拖拽時將定時器關閉
-(void)scrollViewWillBeginDragging:(UIScrollView *)scrollView{
    // 關閉定時器
    [self closeTimer];
}

// 用戶結束拖拽時將定時器開啓(在打開自動輪播的前提下)
- (void)scrollViewDidEndDragging:(UIScrollView *)scrollView willDecelerate:(BOOL)decelerate {
    if (self.autoScroll) {
        [self openTimer];
    }
}

#pragma mark - timer事件
-(void)timerAction{
    // 一上來，輪播圖顯示的是中間的那張圖片，定時器每次觸發都讓當前圖片爲輪播圖的第三張ImageView的image
    [_scrollView setContentOffset:CGPointMake(2*kWidth, 0) animated:YES];
    _pageControl.currentPage = _nextPhotoIndex;
}

#pragma mark - 手勢點擊事件
-(void)handleTapActionInImageView:(UITapGestureRecognizer *)tap {
    if (_delegate && [_delegate respondsToSelector:@selector(carouseScrollView:atIndex:)]) {
        // 若是_nextPhotoIndex == 0,那麼中間那張圖片必定是數組中最後一張，咱們要傳的就是中間那張圖片在數組中的下標
        if (_nextPhotoIndex == 0) {
            [_delegate carouseScrollView:self atIndex:_kCount-1];
        }else{
            [_delegate carouseScrollView:self atIndex:_nextPhotoIndex-1];
        }
    }
}

#pragma mark - 系統方法
-(void)willMoveToSuperview:(UIView *)newSuperview {
    if (!newSuperview) {
        [self closeTimer];
    }
}

-(void)dealloc {
    _scrollView.delegate = nil;
}

@end