CoordinatorLayout 中的 ViewPager（用于粘性标题）会导致滚动中断

Question

测试应用程序在此处演示问题：https://github.com/jstubing/ViewPagerTest

我正在使用 CoordinatorLayout/AppBarLayout 组合来实现可滚动页面内的粘性标题。页面的最底部是一个ViewPager2。当我滑动到新的

ViewPager

页面时，内容会异步加载并填充 ViewPager 中的

RecyclerView

。这一切都运作良好。

当我滑动到新的

ViewPager

页面时，就会出现问题。此时，内容加载并渲染得很好，但我无法再在 ViewPager 之外启动滚动。换句话说，在“上部页面内容”部分（请参阅 XML）中上下滑动不会执行任何操作。

但是，在 ViewPager 中上下滚动确实有效。如果我在 ViewPager 中向上或向下滚动，甚至只需点击一次 ViewPager，它就会修复所有问题，并且我可以再次从

ViewPager

外部启动滚动。

我尝试切换到原来的

ViewPager

而不是ViewPager2，它肯定更可靠，但问题仍然经常发生。

有什么想法可以解决这个问题吗？最终，我只是希望能够在

ViewPager

页面之间滑动，并使整个活动保持可滚动。我很困惑为什么我一开始就失去了滚动能力，为什么点击

ViewPager

可以修复它。

<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent">

    <androidx.coordinatorlayout.widget.CoordinatorLayout
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:elevation="0dp"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent">

        <com.google.android.material.appbar.AppBarLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:background="@color/background"
            app:elevation="0dp">

            <androidx.constraintlayout.widget.ConstraintLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_marginBottom="32dp"
                app:layout_scrollFlags="scroll">

                <!-- UPPER PAGE CONTENT -->

            </androidx.constraintlayout.widget.ConstraintLayout>

            <!-- Sticky header -->
            <include
                android:id="@+id/sticky_header"
                layout="@layout/sticky_header"
                android:layout_width="match_parent"
                android:layout_height="wrap_content" />

        </com.google.android.material.appbar.AppBarLayout>

        <androidx.viewpager2.widget.ViewPager2
            android:id="@+id/events_pager"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            app:layout_behavior="@string/appbar_scrolling_view_behavior" />

    </androidx.coordinatorlayout.widget.CoordinatorLayout>
</androidx.constraintlayout.widget.ConstraintLayout>

Answer 1

当我滑动到新的 ViewPager 页面时，会出现此问题。在此 点，内容加载并呈现良好，但我不再能够 在 ViewPager 之外启动滚动。

我再次能够从 ViewPager 外部启动滚动。

所以，问题现在仅限于

ViewPager

。很可能是因为

ViewPager2

支持通过其内部

RecyclerView

进行嵌套滚动（我不是指页面的

RecyclerView

，而是使

ViewPager

在内部发挥作用的那个。

因此，我们首先需要禁用

ViewPager2

的嵌套滚动：

科特林：

viewPager.children.find { it is RecyclerView }?.let {
        (it as RecyclerView).isNestedScrollingEnabled = false
}

Java：

for (int i = 0; i < viewPager.getChildCount(); i++) {
    View child = viewPager.getChildAt(i);
    if (child instanceof RecyclerView) 
        child.setNestedScrollingEnabled(false);
}

我们无法完全禁用嵌套滚动，因为这会严重影响外部滚动，因此，我们可以通过包装

NestedScrollView

的

ViewPager

来操纵它：

<androidx.core.widget.NestedScrollView
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:fillViewport="true"
    app:layout_behavior="@string/appbar_scrolling_view_behavior">

    <androidx.viewpager2.widget.ViewPager2
        android:id="@+id/events_pager"
        android:layout_width="match_parent"
        android:layout_height="match_parent />

</androidx.core.widget.NestedScrollView>

Answer 2

当我滑动到新的 ViewPager 页面时，会出现此问题。此时，内容加载并渲染得很好，但我无法再在 ViewPager 之外启动滚动。换句话说，在“上部页面内容”部分（请参阅 XML）中上下滑动不会执行任何操作。

在内部，当嵌套滚动停止时，

AppBarLayout.Behavior

会跟踪最后滚动的视图，使用此引用来确定是否可以拖动

AppBarLayout

。但是，当您切换到

ViewPager2

中的另一个片段时，该行为仍然引用之前的视图，该视图不再可滚动，从而阻止

AppBarLayout

被拖动。要解决此问题，您可以通过实现

DragCallback

来覆盖默认行为，这将优先于内部逻辑。

appBarLayout.updateLayoutParams<CoordinatorLayout.LayoutParams> {
    behavior = AppBarLayout.Behavior().apply {
        setDragCallback(object : AppBarLayout.Behavior.DragCallback() {
            override fun canDrag(appBarLayout: AppBarLayout): Boolean {
                // TODO Performance: cache this in a WeakReference and invalidate when the ViewPager page changes
                val scrollingView = viewPager.findViewById<View>(
                    R.id.target_scroll_view_for_current_page
                )
                
                return scrollingView != null && scrollingView.isShown() && !scrollingView.canScrollVertically(
                    -1
                )
            }
        })
    }
}