日常效果圖
支持兩個(gè)以上的view無(wú)限展示
項(xiàng)目中剛好有這個(gè)需求缚态,封裝一下當(dāng)一個(gè)組件蟋滴,方便童鞋方便自己粹庞。
github源碼地址:https://github.com/orangeLong/XBoundlessScrollView 求star
已提交cocoapods
podfile添加 pod 'XBoundlessScrollView', '~> 0.0.1' 后pod install 即可使用 如找不到 則需要pod repo update一發(fā) 美滋滋
思路如下 scrollView的contentSize的寬為視圖寬度的三倍浩淘,scrollView的contentOffset始終在中間位置矾利,使向左向右都可以滑動(dòng)。當(dāng)1左滑到2時(shí)馋袜,改變相應(yīng)view的frame并將contenOffset置為中間位置男旗。如果是兩個(gè)view,需要在滾動(dòng)的時(shí)候檢測(cè)滾動(dòng)方向欣鳖,然后改變不在視圖中間view的frame察皇,這樣就可以無(wú)限左滑或者右滑了。
h文件如下 繼承于scrollView
#import <UIKit/UIKit.h>
typedef NS_ENUM(NSUInteger, CHDLQBoundlessBlockType) {
CHDLQBoundlessBlockTypeScroll, //滾動(dòng)事件
CHDLQBoundlessBlockTypeClick, //點(diǎn)擊事件
};
@interface XBoundlessScrollView : UIScrollView
/**< 自動(dòng)滾動(dòng)時(shí)間間隔 默認(rèn)為3s 值小于等于0時(shí)不自動(dòng)滾 */
@property (nonatomic) NSTimeInterval scrollInterval;
/**< showView 把所需要展示的view數(shù)據(jù)源給過(guò)來(lái)就可以展示 frame自動(dòng)變?yōu)楫?dāng)前frame大小*/
@property (nonatomic, strong) NSArray<UIView *> *showViews;
/**< 滾動(dòng)到到某個(gè)頁(yè)面或者點(diǎn)擊的時(shí)候的回調(diào)*/
@property (nonatomic, copy) void(^boundlessBlock)(CHDLQBoundlessBlockType blockType, NSInteger index);
/**< 設(shè)置delegate會(huì)使相關(guān)方法失靈 暫時(shí)不支持設(shè)置delegate*/
- (void)setDelegate:(id<UIScrollViewDelegate>)delegate __attribute__((unavailable("delegate暫時(shí)不允許使用")));
@end
初始化 設(shè)置一些基本參數(shù)
- (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;
}
設(shè)置需要展示的視圖泽台,設(shè)置之前移除上次添加的相關(guān)視圖什荣,我這里是把所有視圖都先添加上來(lái)。
- (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;
//把最后一個(gè)view加載在3的位置 如果只有一個(gè)view 還是老老實(shí)實(shí)的待在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];
}
因?yàn)橛凶詣?dòng)滾動(dòng) 需要設(shè)置一下timer怀酷,在重新設(shè)置滾動(dòng)時(shí)間間隔和設(shè)置showViews的時(shí)候調(diào)用稻爬,需要停止上一個(gè)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滑動(dòng)的時(shí)候就不會(huì)影響timer
}
監(jiān)聽(tīng)scrollView滾動(dòng)代理,為了判斷滾動(dòng)方向蜕依,當(dāng)只有兩個(gè)視圖時(shí)能夠及時(shí)的改變未展示視圖的frame
- (void)scrollViewDidScroll:(UIScrollView *)scrollView
{
if (self.showViews.count != 2) {
return;
}
UIView *subView = [self.showViews objectAtIndex:[self realIndex:self.currentIndex + 1]];
CGFloat x = 0;
//因?yàn)閏ontentOffset始終在中間位置 如果大于一個(gè)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
//防止數(shù)組越界 index過(guò)大時(shí)自動(dòng)變?yōu)榈谝粡?index過(guò)小時(shí)變?yōu)樽詈笠粡?使view能夠連起來(lái)
NSInteger realIndex = index;
if (realIndex < 0) {
realIndex = self.showViews.count - 1;
} else if (realIndex > self.showViews.count - 1) {
realIndex = 0;
}
return realIndex;
}
當(dāng)手動(dòng)拖動(dòng)到某一個(gè)視圖或者自動(dòng)滾動(dòng)到某個(gè)視圖的時(shí)候調(diào)用下面的方法
- (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三張圖 因?yàn)閏urrentIndex是當(dāng)前視圖 需要-1獲取上一個(gè)視圖
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];
//最后把這三個(gè)視圖設(shè)置到最前面就可以了
}
有疑問(wèn)或者有bug可以在??提