iOS用GKPageScrollView實現多層分類嵌套滑動

前言

最近項目增長新功能，遇到須要多層嵌套滑動的效果，因而利用本身以前寫的一個庫GKPageScrollView實現了下，但在實現過程當中也遇到很多問題，最主要是手勢衝突的問題，因而對庫也進行了更新，下面來詳細說說：

效果圖

先來看下效果圖，主要實現了下面的兩種多層嵌套效果

一、GKPageScrollView + 分類 + 分類

二、分類 + GKPageScrollView + 分類

實現

一、GKPageScrollView + 分類 + 分類

這個實現起來比較簡單，由於用的JXCategoryView自己就支持多層嵌套，只是須要把對應的listView傳遞到GKPageScrollView便可，主要代碼以下：

// 經過JXCategoryViewDelegate獲取當前子列表的scrollView
#pragma mark - JXCategoryViewDelegate
- (void)categoryView:(JXCategoryBaseView *)categoryView didSelectedItemAtIndex:(NSInteger)index {
    switch (index) {
        case 0:
            self.currentListScrollView = self.compListView.tableView;
            break;
        case 1:
            self.currentListScrollView = self.saleListView.tableView;
            break;
        case 2:
            self.currentListScrollView = self.priceListView.tableView;
            break;
        default:
            break;
    }
}

// 傳遞子列表的scrollView到GKPageScrollView
#pragma mark - GKPageListViewDelegate
- (UIScrollView *)listScrollView {
    return self.currentListScrollView;
}
複製代碼

二、分類 + GKPageScrollView + 分類

這個主要是分類嵌套多個GKPageScrollView來實現，主要代碼以下：

// 添加多個帶有GKPageScrollView的GKNest2View
CGFloat width = kScreenW;
CGFloat height = kScreenH - GK_STATUSBAR_HEIGHT - 50.0f;

[self.categoryView.titles enumerateObjectsUsingBlock:^(NSString * _Nonnull obj, NSUInteger idx, BOOL * _Nonnull stop) {
    GKNest2View *nestView = [GKNest2View new];
    nestView.frame = CGRectMake(idx * width, 0, width, height);
    nestView.mainScrollView = self->_contentScrollView;
    [self->_contentScrollView addSubview:nestView];
}];
 _contentScrollView.contentSize = CGSizeMake(self.categoryView.titles.count * width, 0);
複製代碼

GKNest2View的實現

#pragma mark - GKPageScrollViewDelegate
- (UIView *)headerViewInPageScrollView:(GKPageScrollView *)pageScrollView {
    return self.headerView;
}

- (UIView *)segmentedViewInPageScrollView:(GKPageScrollView *)pageScrollView {
    return self.categoryView;
}

- (NSInteger)numberOfListsInPageScrollView:(GKPageScrollView *)pageScrollView {
    return self.categoryView.titles.count;
}

- (id<GKPageListViewDelegate>)pageScrollView:(GKPageScrollView *)pageScrollView initListAtIndex:(NSInteger)index {
    GKNestListView *listView = [GKNestListView new];
    return listView;
}
複製代碼

三、手勢衝突的解決

多層嵌套最難的地方是手勢的衝突問題，其中進行了各類嘗試最終解決了手勢衝突，方法主要是對手勢的代理方法進行實現及修改

0一、列表容器左右滑動與列表上下滑動衝突的解決

- (BOOL)gestureRecognizerShouldBegin:(UIGestureRecognizer *)gestureRecognizer {
    if ([self.gestureDelegate respondsToSelector:@selector(pageListContainerCollectionView:gestureRecognizerShouldBegin:)]) {
        return [self.gestureDelegate pageListContainerCollectionView:self gestureRecognizerShouldBegin:gestureRecognizer];
    }else {
        if (self.isNestEnabled) {
            if ([gestureRecognizer isMemberOfClass:NSClassFromString(@"UIScrollViewPanGestureRecognizer")]) {
                CGFloat velocityX = [(UIPanGestureRecognizer *)gestureRecognizer velocityInView:gestureRecognizer.view].x;
                // x大於0就是右滑
                if (velocityX > 0) {
                    if (self.contentOffset.x == 0) {
                        return NO;
                    }
                }else if (velocityX < 0) { // x小於0是往左滑
                    if (self.contentOffset.x + self.bounds.size.width == self.contentSize.width) {
                        return NO;
                    }
                }
            }
        }
    }
    return YES;
}
複製代碼

0二、GKPageScrollView上下滑動與全屏返回手勢衝突的解決

#pragma mark - GKPageTableViewGestureDelegate
- (BOOL)pageTableView:(GKPageTableView *)tableView gestureRecognizer:(UIGestureRecognizer *)gestureRecognizer shouldRecognizeSimultaneouslyWithGestureRecognizer:(UIGestureRecognizer *)otherGestureRecognizer {
    // 特殊處理，解決返回手勢與GKPageTableView手勢的衝突
    NSArray *internalTargets = [otherGestureRecognizer valueForKey:@"targets"];
    id internalTarget = [internalTargets.firstObject valueForKey:@"target"];
    if ([internalTarget isKindOfClass:NSClassFromString(@"_UINavigationInteractiveTransition")]) return NO;
    
    return YES;
}
複製代碼

上面只是部分的代碼，主要實現仍是要看具體的代碼邏輯。

最後

GKPageScrollView與JXCategoryView結合使用，實現了上面兩種嵌套效果，具體代碼能夠再GKPageScrollView中的Nest中查看。若是您以爲還不錯，還請點個star，您的支持是我最大的動力。