【问题标题】:How can I make work ViewPager with RecyclerView inside NestedScrollView如何在 NestedScrollView 中使用 RecyclerView 制作 ViewPager
【发布时间】:2015-10-08 09:00:32
【问题描述】:

我正在使用带有 ViewPager 的 NestedScrollView。 NestedScrollView 内部有一个 LinearLayout,最后有一些 TextView、TabLayout 和 ViewPager。 TextViews 占据了大部分空间,而为 ViewPager 留下了一点空间。 ViewPager 使用两个 Fragment,其中一个有几个 TextViews 和 ImageViews,另一个 Fragment 有一个 RecyclerView。

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

例如,当我将 ViewPager 的高度设置为 1000dp 时,我可以在第一个片段上向下滚动,但第二个片段仍在小 ViewPager 内滚动。在我使用 RecyclerView scoll 在第一个 Fragment 中滚动片段后不再工作。

如何解决滚动问题并使 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>

【问题讨论】:

  • 嗨,你让这个工作了吗?我试过 fillViewport 但它会将嵌套滚动视图截断为视口高度,并且回收器是嵌套滚动的。通过禁用嵌套滚动,即使是nestedscrollview 也不会滚动(这很奇怪)。请分享如何,如果你能让它工作。

标签: android android-viewpager android-recyclerview


【解决方案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);
}

【讨论】:

  • 你打算给super.onMeasure(...)打两次电话吗?
  • 此解决方案无法正常工作,因为它正在测量所有儿童。在这种情况下,ViewPager 将具有与最高孩子相同的高度。您应该只测量当前视图并在onPageSelected(int position)中使用requestLayout()
【解决方案2】:

@StevenZhang 的解决方案几乎对我有用,但是当两个选项卡的高度不同时出现问题,较小的选项卡占用较大选项卡的高度。

基于这个answer关于如何制作动态高度ViewPager我在Kotlin中做了一个解决方案

自定义视图分页器

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)
      }
   }
}

您可能还需要将RecyclerViewisNestedScrollingEnabled 设置为false

recyclerView.isNestedScrollingEnabled = false

【讨论】:

  • 如果我们需要 viewpager 2 怎么办?
【解决方案3】:

也许你可以试试:

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

如:https://stackoverflow.com/a/33385207/4035627

【讨论】:

  • 这会使 viewPager 可见,但不足以让回收站滚动
猜你喜欢
  • 2023-03-29
  • 2021-03-10
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2021-05-02
  • 1970-01-01
相关资源
最近更新 更多