如何在NestedScrollView中使用RecyclerView实现ViewPager的功能

Question

我正在使用带有ViewPager的NestedScrollView。 NestedScrollView内部有一个LinearLayout，其中包含一些TextView、TabLayout和ViewPager。 TextView占用大部分空间，ViewPager只留下一点空间。 ViewPager使用两个片段，其中一个片段中有几个TextView和ImageViews，另一个片段中有一个RecyclerView。

当我将ViewPager的高度设置为WRAP_CONTENT时，它只占用剩余的空间，我无法滚动以查看第一个片段的其余部分，并且第二个片段在小ViewPager内滚动。

当我将ViewPager的高度设置为1000dp时，例如，我可以向下滚动第一个片段，但第二个片段仍然在小ViewPager内滚动。并且在我滚动带有RecyclerView的片段后，第一个片段中的滚动不再起作用。

如何解决滚动问题并使ViewPager与WRAP_CONTENT一起工作？

以下是我的代码：

<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <android.support.design.widget.AppBarLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

        <android.support.v7.widget.Toolbar
            android:id="@+id/toolbar"
            android:layout_width="match_parent"
            android:layout_height="?attr/actionBarSize"
            android:background="?attr/colorPrimary" />

    </android.support.design.widget.AppBarLayout>

    <android.support.v4.widget.NestedScrollView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:layout_behavior="@string/appbar_scrolling_view_behavior"
        app:layout_scrollFlags="scroll"
        android:fillViewport="true">

        <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:background="@color/mainBackground"
            android:orientation="vertical">

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="SOME TEXT" />

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="SOME TEXT" />

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="SOME TEXT" />

            <android.support.design.widget.TabLayout
                android:id="@+id/tabLayout"
                android:layout_width="match_parent"
                android:layout_height="wrap_content" />

            <android.support.v4.view.ViewPager
                android:id="@+id/viewPager"
                android:layout_width="match_parent"
                android:layout_height="wrap_content" />

        </LinearLayout>

    </android.support.v4.widget.NestedScrollView>

</android.support.design.widget.CoordinatorLayout>

- user2452483

---

你好，你解决了这个问题吗？我尝试了fillViewport，但它将嵌套的scrollview截断为视口高度，并且recycler是嵌套滚动的。通过禁用嵌套滚动，甚至嵌套的scrollview也无法滚动（这很奇怪）。如果你能解决这个问题，请分享一下你的方法。 - AA_PV

Answer 1

我认为你应该这样重写ViewPager：

@Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
    super.onMeasure(widthMeasureSpec, heightMeasureSpec);

    int height = 0;
    for (int i = 0; i < getChildCount(); i++) {
        View child = getChildAt(i);
        child.measure(widthMeasureSpec, MeasureSpec.makeMeasureSpec(0, MeasureSpec.UNSPECIFIED));
        int h = child.getMeasuredHeight();
        if (h > height) height = h;
    }
    heightMeasureSpec = MeasureSpec.makeMeasureSpec(height, MeasureSpec.EXACTLY);
    super.onMeasure(widthMeasureSpec, heightMeasureSpec);
}

- StevenZhang

---

你是否打算调用 super.onMeasure(...) 两次？ - ban-geoengineering

这个解决方案不能正常工作，因为它测量了所有的子视图。在这种情况下，ViewPager将具有最高子视图的相同高度。您应该只测量当前视图，并在onPageSelected(int position)中使用requestLayout()。 - Lennon Spirlandelli

Answer 2

@StevenZhang的解决方案对我来说几乎起作用了，但是当两个选项卡具有不同的高度时，较小的选项卡会采用较大选项卡的高度。

基于这个答案关于如何制作动态高度ViewPager，我用Kotlin做了一个解决方案

自定义View Pager

class CustomViewPager: ViewPager {
    constructor(context: Context) : super(context)
    constructor(context : Context, attrs : AttributeSet) : super(context, attrs)

    private var currentView : View? = null

    override fun onMeasure(widthMeasureSpec: Int, heightMeasureSpec: Int) {

        currentView?.let {
            it.measure(widthMeasureSpec, MeasureSpec.makeMeasureSpec(0, MeasureSpec.UNSPECIFIED))
            val h = it.measuredHeight
            val height = if (h > 0) h else 0
            val newHeightMeasureSpec = MeasureSpec.makeMeasureSpec(height, MeasureSpec.EXACTLY)
            super.onMeasure(widthMeasureSpec, newHeightMeasureSpec)
            return
        }

        super.onMeasure(widthMeasureSpec, heightMeasureSpec)
    }

    fun measureCurrentView(currentView: View?) {
        this.currentView = currentView
        requestLayout()
    }
}

在您的自定义PagerAdapter中覆盖setPrimaryItem方法。原始答案翻译成“最初的回答”。

private var currentPosition = -1

override fun setPrimaryItem(container: ViewGroup, position: Int, `object`: Any) {
    super.setPrimaryItem(container, position, `object`)
    if (position != currentPosition) {
      val fragment = `object` as Fragment
      val pager = container as CustomViewPager
      if (fragment.view != null) {
         currentPosition = position
         pager.measureCurrentView(fragment.view)
      }
   }
}

您可能还需要将您的RecyclerView的isNestedScrollingEnabled设置为false。最初的回答保留HTML标签。

recyclerView.isNestedScrollingEnabled = false

- Jorge Guillermo Negrete

---

如果我们需要使用 ViewPager 2 呢？ - Sharif Rafid Ur Rahman

Answer 3

也许你可以尝试：

 NestedScrollView scrollView = (NestedScrollView) findViewById (R.id.nest_scrollview);
    scrollView.setFillViewport (true);

例如:https://dev59.com/Cl0a5IYBdhLWcg3wNWbA#33385207

- mio4kon

---

这会使ViewPager可见，但对于Recycler滚动还不够。 - Leo DroidCoder