iOS 嵌套滚动（Nested Scroll）实现原理

一、页面结构

• outerScrollView：负责整体纵向滚动，承载 Header + TabBar + 内容区
• TabBar：Tab 切换栏，需要吸顶
• innerTableView（TV0/TV1/TV2）：3 个内层列表，通过横向 ScrollView 实现 Tab 切换
• stickyOffset：headerHeight - safeAreaTop，即外层滚动到此位置时 TabBar 刚好吸顶

二、核心难题

外层 ScrollView 和内层 TableView 都是纵向滚动，默认情况下 iOS 只会让其中一个响应手势。我们需要实现：

• 向上滑：先滚外层（Header 收起），Tab 吸顶后无缝切换到滚内层列表
• 向下滑：先滚内层列表回到顶部，再无缝切换到滚外层（Header 露出）
• 同一个手势中无缝过渡，不需要松手再重新滑

三、解决方案：手势同时识别 + 实时 Clamp

3.1 手势同时识别

// 子类化外层 ScrollView
@interface NestedOuterScrollView : UIScrollView <UIGestureRecognizerDelegate>
@end

@implementation NestedOuterScrollView

- (BOOL)gestureRecognizer:(UIGestureRecognizer *)gestureRecognizer
shouldRecognizeSimultaneouslyWithGestureRecognizer:(UIGestureRecognizer *)otherGestureRecognizer {
    return YES;
}

@end

3.2 实时 Clamp（scrollViewDidScroll: 核心逻辑）

两个 ScrollView 同时被手势驱动，但每一帧只有一个应该真正滚动，另一个应该被"钉住"。

- (void)scrollViewDidScroll:(UIScrollView *)scrollView {

    // ===== 外层 ScrollView =====
    if (scrollView == outerScrollView) {
        if (offsetY >= stickyOffset) {
            // 外层到达吸顶 → 锁死外层，允许内层
            scrollView.contentOffset = CGPointMake(0, stickyOffset);
            innerCanScroll = YES;
        } else {
            if (innerTV.contentOffset.y > 0) {
                // 【关键】内层还有内容没滚到顶
                // → 外层也锁死在吸顶，优先让内层先滚
                scrollView.contentOffset = CGPointMake(0, stickyOffset);
            } else {
                // 内层已在顶部 → 外层自由滚动
                innerCanScroll = NO;
            }
        }
    }

    // ===== 内层 TableView =====
    if (scrollView == innerTableView) {
        if (!innerCanScroll) {
            // 外层还没到吸顶，钉住内层
            scrollView.contentOffset = CGPointZero;
        } else if (scrollView.contentOffset.y <= 0) {
            // 内层到顶了，交还给外层
            innerCanScroll = NO;
            scrollView.contentOffset = CGPointZero;
        }
    }
}

四、向上滑（看更多内容）的流程

同一个手势，无需松手，从外层滚动无缝过渡到内层滚动。

五、向下滑（回到顶部）的流程

同一个手势，无需松手，从内层滚动无缝过渡到外层滚动。

六、关键设计要点总结

七、踩坑记录