objective-c - UIScrollView 中的 UIScrollView，如何在两者之间滚动时保持平滑过渡

Question

我有以下布局(见下文)，在大多数情况下都可以正常工作。用户可以在蓝色的 UIScrollView 中滚动(就所有意图和目的而言，它是一个 UITableView，但这个问题概括了这一点)，然后当他们到达在这个 ScrollView 结束时，他们可以再次开始滚动(他们必须 Handlebars 指拿开，然后再打开，因为内部 ScrollView 否则会像橡皮筋一样)，“ super ” ScrollView 开始滚动，显示图像的其余部分。

我不想要的是整个(他们必须松开手指，然后再松开手指，否则内部 ScrollView 会像橡皮筋一样)。理想情况下，一旦包含的 UIScrollView 到达其内容的末尾，我希望 super View 立即接管滚动，这样内部 ScrollView 就不会像橡皮筋一样。

当用户向上滚动时也是如此；当红色 ScrollView 到达其内容的顶部时，我希望内部蓝色 ScrollView 立即开始向上滚动，而不是顶部的红色 ScrollView 橡皮筋。

知道怎么做吗？我能够确定 ScrollView 何时到达其内容的末尾，但我不确定如何应用这些知识来实现​​我想要的效果。谢谢。

// Inner (blue) scroll view bounds checking
if (scrollView.contentOffset.y + scrollView.frame.size.height > scrollView.contentSize.height) { ... }

// Outer (red) scroll view bounds checking
if (scrollView.contentOffset.y < 0) { ... }

Answer 1

是的。我有一个妙招要教给你。

不是让你的红色轮廓 View 成为 ScrollView ，而是让它成为一个充满屏幕的普通 UIView。在该 View 中按照插图中的样式布置 ScrollView (表格 View )和 ImageView 。

在所有其他 ScrollView 和 ImageView 之上放置一个填充 Root View 边界(即也填充屏幕)的 ScrollView 。将此 View 的内容大小设置为您要滚动浏览的所有 View 的总内容高度。换句话说，有一个不可见的 ScrollView 位于所有其他 View 之上，其内容大小高度是内部 ScrollView (表格 View )内容大小高度 + ImageView 大小高度。

层次结构应该是这样的:

然后，您使用非常高的内容大小制作的顶部 ScrollView 使其委托(delegate)成为您的 View Controller 。实现 scrollViewDidScroll，我们将施展魔法。

Scrollviews 基本上是通过使用时髦的动量公式调整边界原点来滚动的。所以在我们的 scrollviewDidScroll 方法中，我们将简单地调整底层 View 的边界:

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

    //the scroll view underneath (in the container view) will have a max content offset equal to the content height
    //but minus the bounds height
    CGFloat maxYOffsetForUnderScrollView = self.underScrollView.contentSize.height - self.underScrollView.bounds.size.height;

    CGRect scrolledBoundsForContainerView = self.view.bounds;

    if (scrollView.contentOffset.y <= maxYOffsetForUnderScrollView) {
        //in this scenario we are still within the content for the underScrollView
        //so we make sure the container view is scrolled to the top and set the offset for the contained scrollview
        self.containerView.bounds = scrolledBoundsForContainerView;
        self.underScrollview.contentOffset = scrollView.contentOffset;
        return;
    }

    //in this scenario we have scrolled throug the entirety of the contained scrollview
    //set its offset to the max and change the bounds of the container view to scroll everything else.
    self.underScrollView.contentOffset = CGPointMake(0, maxYOffsetForUnderScrollView);

    scrolledBoundsForContainerView.origin.y = scrollView.contentOffset.y - maxYOffsetForUnderScrollView;
    self.containerView.bounds = scrolledBoundsForContainerView;
}

您会发现，由于每帧动画都调用了 scrollViewDidScroll，因此所包含 View 的这种虚假滚动看起来非常自然。

但是等等!我听到你说。顶部的 ScrollView 现在拦截所有触摸，它下面的 View 也需要被触摸。我也有一个有趣的解决方案。

将顶部的 ScrollView 设置为离开屏幕某处(即将其框架设置为离开屏幕，但仍保持相同大小。)然后在您的 viewDidLoad 方法中添加 ScrollView 的 panGestureRecogniser 到主视图。这意味着您可以获得所有 iOS 自然滚动动力和东西，而无需实际在屏幕上查看。包含的 ScrollView 现在可能会变得困惑，因为它的平移手势识别器也会被调用(它们的工作方式与 UIEvent 处理不同)，因此您需要将其删除。

- (void)viewDidLoad
{
    [super viewDidLoad];
    // Do any additional setup after loading the view, typically from a nib.

    [self.view addGestureRecognizer:self.scrollview.panGestureRecognizer];

    [self.underScrollview removeGestureRecognizer:self.underScrollView.panGestureRecognizer];

    //further code to set up content sizes and stuff
}

我做这个很开心所以这里是 github 上示例项目的链接: https://github.com/joelparsons/multipleScrollers

编辑:

要在顶部 ScrollView 离开屏幕时显示滚动条，无论您将其放置在何处，您都可以将 scrollIndicatorInsets 设置为像这样创建的插图:

CGPoint scrollviewOrigin = self.scrollview.frame.origin;
self.scrollview.scrollIndicatorInsets = UIEdgeInsetsMake(-scrollviewOrigin.y,0,scrollviewOrigin.y,scrollviewOrigin.x);

*请注意， ScrollView 仍然必须是正确的高度，但我相信您明白了。

然后要使条形图绘制在 ScrollView 的可见边界之外，您必须关闭 clips to bounds

self.scrollview.clipsToBounds = NO;