关于UIScrollView无限循环滑动

在使用某宝或某东购物的时候,我们会在其首页看到一个可以滑动的版块,这个版块的实现就是一个UIScrollView.在我们使用UIScrollView的时候会发现,滑动到最后的时候,UIScrollView不能像上面说的版块那样又回到最初的地方.基于此,做了一个小Demo来实现UIScrollView的无限循环滑动.

小小思路:UIScrollView具有分页属性,要实现UIScrollView的无限循环滑动,我们不能生硬暴力的给一个数组按规律的,无限的添加图片,这样手机内存还不爆炸 0.0 , 如何用最少的页面实现无限循环呢? 三个,其实只需要三个页面就可以实现UIScrollView的无限循环滑动.左丶中丶右 三个页面.刚进入程序时,左边放最后一张图片,中间第一张图片,右边放第二张.向左滑动一张图片,左边变成了第一张图片,中间是第二张,右边则变成了第三张图片.依此便可实现UIScrollView的无限循环滑动了.

< Demo 如下 > :

.h文件

@interface MyScrollView: UIView <UIScrollViewDelegate>

@property(nonatomic, strong)NSArray *dataArr;

@end

.m文件

#define kPageCtrlHeight 37  //UIPageControl的高度

@interface MyScrollView ()
{
    UIImageView *leftView;
    UIImageView *centerView;
    UIImageView *rightView;
    
    UIScrollView *scrollView;
    UIPageControl *pageCtrl;    // 页面控制器 ...
    
    NSInteger currentPageNumber;
}

@end

@implementation MyScrollView

/*----------------始终只有左,中,右3个imgView,将数据源加入到这3个imgView中显示--------------------------*/

- (instancetype)init
{
    return [self initWithFrame:[UIScreen mainScreen].bounds];
}

- (instancetype)initWithFrame:(CGRect)frame
{
    self = [super initWithFrame:frame];
    if (self) {
        [self createUI:frame];
    }
    return self;
}

-(void)createUI:(CGRect)frame
{
    scrollView = [[UIScrollView alloc] initWithFrame:CGRectMake(0, 0, frame.size.width, frame.size.height - kPageCtrlHeight)];
    scrollView.delegate = self;
    scrollView.pagingEnabled = YES;
    scrollView.showsHorizontalScrollIndicator = NO;
    scrollView.showsVerticalScrollIndicator = NO;
    
    pageCtrl = [[UIPageControl alloc] initWithFrame:CGRectMake(0, frame.size.height - kPageCtrlHeight, frame.size.width, kPageCtrlHeight)];
    pageCtrl.backgroundColor = [UIColor lightGrayColor];
    
    [self addSubview:scrollView];
    [self addSubview:pageCtrl];
    
    
    leftView = [[UIImageView alloc] initWithFrame:CGRectMake(0, 0, scrollView.frame.size.width, scrollView.frame.size.height)];
    centerView = [[UIImageView alloc] initWithFrame:CGRectMake(scrollView.frame.size.width, 0, scrollView.frame.size.width, scrollView.frame.size.height)];
    rightView = [[UIImageView alloc] initWithFrame:CGRectMake(scrollView.frame.size.width*2, 0, scrollView.frame.size.width, scrollView.frame.size.height)];
    
    [scrollView addSubview:leftView];
    [scrollView addSubview:centerView];
    [scrollView addSubview:rightView];
}


-(void)setDataArr:(NSArray *)dataArr
{
    if (![dataArr isKindOfClass:[NSArray class]] || dataArr.count == 0) {
        return;
    }
    
    _dataArr = dataArr;
    
    [self setInitProperty];
}

-(void)setInitProperty
{
    pageCtrl.numberOfPages = _dataArr.count;  //总页码
    //内容
    scrollView.contentSize = CGSizeMake(_dataArr.count * scrollView.frame.size.width, scrollView.frame.size.height);
    [scrollView setContentOffset:CGPointMake(scrollView.frame.size.width, 0)];//偏移位置,第一页
    
    currentPageNumber = 0;
    [self loadPageContent];
}

-(void)loadPageContent
{
    centerView.image = [UIImage imageNamed:_dataArr[currentPageNumber]];
    
    NSInteger leftImgIndex = (currentPageNumber - 1 + _dataArr.count) % _dataArr.count;
    leftView.image = [UIImage imageNamed:_dataArr[leftImgIndex]];
    
    NSInteger rightImgIndex = (currentPageNumber + 1) % _dataArr.count;
    rightView.image = [UIImage imageNamed:_dataArr[rightImgIndex]];
    
    pageCtrl.currentPage = currentPageNumber;
}



-(void)scrollViewDidEndDecelerating:(UIScrollView *)scrollView_
{
    if (scrollView.contentOffset.x > scrollView.bounds.size.width) {    //向左滑动
        currentPageNumber = (currentPageNumber + 1) % _dataArr.count;
    }else if (scrollView.contentOffset.x < scrollView.bounds.size.width){   //向右滑动
        currentPageNumber = (currentPageNumber - 1 + _dataArr.count) % _dataArr.count;
    }
    
    [self loadPageContent];
    
    scrollView.contentOffset = CGPointMake(scrollView.bounds.size.width, 0);
}

@end

ViewController.m 文件:

- (void)viewDidLoad {
    [super viewDidLoad];
    
    NSArray *array = @[
                       @"scene1.jpg",
                       @"scene2.jpg",
                       @"scene3.jpg",
                       @"scene4.jpg",
                       @"scene5.jpg"
                       ];
    
    MyScrollView *myScrollView = [[MyScrollView alloc] initWithFrame:CGRectMake(0, 0, self.view.bounds.size.width, 250)];
    [self.view addSubview:myScrollView];
    myScrollView.dataArr = array;
   
}