ios 三倍宽/高实现无限张图片的轮播滚动 scrollview

轮播图相信我们经常遇到，我们一般是通过创建 多张view去并排放到contentview上，但当图片数量多的时候就会出现内存消耗过大的问题

我们现在来讲另一种方法，很简单也就四五十行代码的事
通过三倍宽/高实现scrollview的无限复用，什么原理呢？这里是把在view上放三张图，我们需要展示的永远是中间那张view，只是当视图滚动结束时候不断的更换三张view对应数据源（为什么不在滚动的时候切换呢？这个可以自己思考一下）
效果如下

轮播滚动

首先创建一个view（reScrollView）和xib

xib约束

reScrollView.h

@interface reScrollView : UIView
- (instancetype)initWithFrame:(CGRect)frame andOwner:(UIViewController *)owner;
@property (nonatomic,strong) NSArray    *picArray;
@property (nonatomic,strong) NSArray    *infoArray;
@end

reScrollView.m

#import "reScrollView.h"
@interface reScrollView ()
@property (weak, nonatomic) IBOutlet UIImageView *leftImageView;
@property (weak, nonatomic) IBOutlet UIImageView *middleImageVIew;
@property (weak, nonatomic) IBOutlet UIImageView *rightImageView;
@property (weak, nonatomic) IBOutlet UILabel     *infoLabel;
@property (nonatomic,assign) NSInteger           currentPage;
@property (weak, nonatomic) IBOutlet UIScrollView *scrollView;
@end

- (instancetype)initWithFrame:(CGRect)frame andOwner:(UIViewController *)owner{
  //可以不把owner传进来，这个很长时间了，后来没有改
    if ((self = [[[NSBundle mainBundle] loadNibNamed:NSStringFromClass([self class]) owner:owner options:nil] lastObject])){
        owner.automaticallyAdjustsScrollViewInsets = NO;
        [self setFrame:frame];
        self.currentPage = 0;
    }
    return self;
}

- (void)layoutSubviews{
    [super layoutSubviews];
    [self setContOffSet];
//三张图的取值，第一张需要注意放数据源的最后一个，为什么呢?因为比如第一张时我们向右滑应该显示哪一张呢,应该最后一张吧
    self.leftImageView.image = [UIImage imageNamed:[self.picArray objectAtIndex:self.picArray.count-1]];
    self.middleImageVIew.image = [UIImage imageNamed:[self.picArray objectAtIndex:0]];
    self.rightImageView.image = [UIImage imageNamed:[self.picArray objectAtIndex:1]];
    self.infoLabel.text = self.infoArray[0];
}

#define CURRENT_INDEX scrollView.contentOffset.x/CGRectGetWidth(scrollView.bounds)
- (void)scrollViewDidEndDecelerating:(UIScrollView *)scrollView{
    
    if(CURRENT_INDEX>1)
    self.currentPage = self.currentPage == self.picArray.count-1?0:self.currentPage+1;
    
    if(CURRENT_INDEX<1)
    self.currentPage = self.currentPage == 0?self.picArray.count-1:self.currentPage-1;
    
    NSInteger leftIndex = self.currentPage == 0?self.picArray.count-1:self.currentPage-1;
    
    NSInteger rightIndex = self.currentPage == self.picArray.count -1?0:self.currentPage+1;
//滚动结束后我们要把偏移量归位
    [self setContOffSet];
    //并重新配置三张view的资源
    self.leftImageView.image = [UIImage imageNamed:self.picArray[leftIndex]];
    
    self.middleImageVIew.image = [UIImage imageNamed:self.picArray[self.currentPage]];
    
    self.rightImageView.image = [UIImage imageNamed:self.picArray[rightIndex]];
    
    self.infoLabel.text = self.infoArray[self.currentPage];
}

- (void)setContOffSet{
    
    CGFloat contentSetX = CGRectGetWidth(self.scrollView.bounds);
    
    [self.scrollView setContentOffset:CGPointMake(contentSetX, 0) animated:NO];

}

调用

#import "ResuableViewController.h"
#import "reScrollView.h"
#import "Masonry.h"
@interface ResuableViewController ()
@property (nonatomic,strong)reScrollView *resuableScroll;
@end

@implementation ResuableViewController
- (void)viewDidLoad {
    [super viewDidLoad];
    self.view.backgroundColor = [UIColor purpleColor];
    self.edgesForExtendedLayout = UIRectEdgeAll;
    self.title = @"瑞雪照丰年";
    [self setUpView];
}

- (void)setUpView{
    self.resuableScroll = [[reScrollView alloc]initWithFrame:CGRectZero andOwner:self];
    self.resuableScroll.picArray = @[@"image1.jpg",@"image2.jpg",@"image3.jpg",@"image4.jpg",];
    self.resuableScroll.infoArray = @[@"今年过年好天气",@"瑞雪兆丰年",@"头可断,血可流,wifi不能断",@"加把劲儿"];
    [self.view addSubview:self.resuableScroll];
    [self setConstraint];
}

- (void)setConstraint{
    [self.resuableScroll mas_makeConstraints:^(MASConstraintMaker *make) {
        make.leading.equalTo(self.view.mas_leading);
        make.top.equalTo(self.view.mas_top);
        make.trailing.equalTo(self.view.mas_trailing);
        make.bottom.equalTo(self.view.mas_bottom);
    }];
}
@end

[Demo奥格瑞玛传送门]https://github.com/joy-make/scrollview.git