无限滚动视图XBoundlessScrollView

日常效果图

show.gif

支持两个以上的view无限展示

项目中刚好有这个需求，封装一下当一个组件，方便童鞋方便自己。
github源码地址：https://github.com/orangeLong/XBoundlessScrollView 求star
已提交cocoapods
podfile添加 pod 'XBoundlessScrollView', '~> 0.0.1' 后pod install 即可使用如找不到则需要pod repo update一发美滋滋

思路如下 scrollView的contentSize的宽为视图宽度的三倍，scrollView的contentOffset始终在中间位置，使向左向右都可以滑动。当1左滑到2时，改变相应view的frame并将contenOffset置为中间位置。如果是两个view，需要在滚动的时候检测滚动方向，然后改变不在视图中间view的frame，这样就可以无限左滑或者右滑了。

image.png

h文件如下继承于scrollView

#import <UIKit/UIKit.h>

typedef NS_ENUM(NSUInteger, CHDLQBoundlessBlockType) {
    CHDLQBoundlessBlockTypeScroll,      //滚动事件
    CHDLQBoundlessBlockTypeClick,       //点击事件
};

@interface XBoundlessScrollView : UIScrollView

/**< 自动滚动时间间隔 默认为3s 值小于等于0时不自动滚 */
@property (nonatomic) NSTimeInterval scrollInterval;
/**< showView 把所需要展示的view数据源给过来就可以展示 frame自动变为当前frame大小*/
@property (nonatomic, strong) NSArray<UIView *> *showViews;
/**< 滚动到到某个页面或者点击的时候的回调*/
@property (nonatomic, copy) void(^boundlessBlock)(CHDLQBoundlessBlockType blockType, NSInteger index);
/**< 设置delegate会使相关方法失灵 暂时不支持设置delegate*/
- (void)setDelegate:(id<UIScrollViewDelegate>)delegate __attribute__((unavailable("delegate暂时不允许使用")));

@end

初始化设置一些基本参数

- (void)baseInit
{
    self.bounces = NO;
    self.pagingEnabled = YES;
    [self setValue:self forKey:@"delegate"];
    self.showsVerticalScrollIndicator = NO;
    self.showsHorizontalScrollIndicator = NO;
    [self setContentOffset:CGPointMake(kSelfWidth, 0)];
    self.scrollInterval = 3.f;
}

设置需要展示的视图，设置之前移除上次添加的相关视图，我这里是把所有视图都先添加上来。

- (void)setShowViews:(NSArray *)showViews
{
    _showViews = showViews;
    [self.subviews makeObjectsPerformSelector:@selector(removeFromSuperview)];
    if (!showViews.count) {
        return;
    }
    [showViews enumerateObjectsUsingBlock:^(UIView *  _Nonnull obj, NSUInteger idx, BOOL * _Nonnull stop) {
        NSInteger index = idx + 1;
        if (index == showViews.count && index != 1) {
            index = 0;
            //把最后一个view加载在3的位置 如果只有一个view  还是老老实实的待在1的位置
        }
        obj.frame = CGRectMake(kSelfWidth * index, 0, kSelfWidth, kSelfHeight);
        obj.userInteractionEnabled = YES;
        [self addSubview:obj];
    }];
    self.contentSize = CGSizeMake(kSelfWidth * 3, 0);
    [self setContentOffset:CGPointMake(kSelfWidth, 0)];
    self.scrollEnabled = showViews.count != 1;
    UITapGestureRecognizer *tap = [[UITapGestureRecognizer alloc] initWithTarget:self action:@selector(tapClick)];
    [self addGestureRecognizer:tap];
    self.currentIndex = 0;
    [self resetTimer];
}

因为有自动滚动需要设置一下timer，在重新设置滚动时间间隔和设置showViews的时候调用，需要停止上一个timer

- (void)resetTimer
{
    [self.scrollTimer invalidate];
    self.scrollTimer = nil;
    if (self.subviews.count < 2 || self.scrollInterval <= 0) {
        return;
    }
    __weak typeof(self) weakself = self;
    self.scrollTimer = [NSTimer scheduledTimerWithTimeInterval:self.scrollInterval repeats:YES block:^(NSTimer * _Nonnull timer) {
        __strong typeof(weakself) strongself = weakself;
        CGPoint point = strongself.contentOffset;
        point.x += kSelfWidth;
        [strongself setContentOffset:point animated:YES];
    }];
    [[NSRunLoop mainRunLoop] addTimer:self.scrollTimer forMode:NSRunLoopCommonModes];
//把timer添加到commonModes上 这样其他scrollView滑动的时候就不会影响timer
}

监听scrollView滚动代理，为了判断滚动方向，当只有两个视图时能够及时的改变未展示视图的frame

- (void)scrollViewDidScroll:(UIScrollView *)scrollView
{
    if (self.showViews.count != 2) {
        return;
    }
    UIView *subView = [self.showViews objectAtIndex:[self realIndex:self.currentIndex + 1]];
    CGFloat x = 0;
//因为contentOffset始终在中间位置 如果大于一个width的宽度就是左滑 否则就是右滑
    if (scrollView.contentOffset.x > scrollView.frame.size.width) {
        x = kSelfWidth * 2;
    }
    if (!doubleEqual(x, subView.frame.origin.x)) {
        CGRect frame = scrollView.bounds;
        frame.origin.x = x;
        subView.frame = frame;
    }
}

- (NSInteger)realIndex:(NSInteger)index
{
//左滑index+1 右滑index-1
  //防止数组越界 index过大时自动变为第一张 index过小时变为最后一张 使view能够连起来
    NSInteger realIndex = index;
    if (realIndex < 0) {
        realIndex = self.showViews.count - 1;
    } else if (realIndex > self.showViews.count - 1) {
        realIndex = 0;
    }
    return realIndex;
}

当手动拖动到某一个视图或者自动滚动到某个视图的时候调用下面的方法

- (void)setCurrentIndex:(NSInteger)currentIndex
{
    NSInteger realIndex = [self realIndex:currentIndex];
    if (_currentIndex == realIndex) {
        return;
    }
    _currentIndex = realIndex;
    for (int i = 0; i < 3; i++) {
        [self bringShowViewToFront:i];
    }
}

- (void)bringShowViewToFront:(NSInteger)result
{
//result分别是0 1 2代表312三张图 因为currentIndex是当前视图 需要-1获取上一个视图
    NSInteger realIndex = [self realIndex:self.currentIndex + result - 1];
    UIView *showView = [self.showViews objectAtIndex:realIndex];
    CGRect frame = showView.frame;
    frame.origin.x = frame.size.width * result;
    showView.frame = frame;
    [self bringSubviewToFront:showView];
//最后把这三个视图设置到最前面就可以了
}

有疑问或者有bug可以在👇提