27

有几篇关于让 ViewPager 使用不同高度的项目的帖子,这些项目以扩展ViewPager自身为中心以修改其onMeasure以支持这一点。

但是,鉴于它ViewPager2被标记为最终类,扩展它不是我们可以做的事情。

有谁知道是否有办法解决这个问题?


例如,假设我有两种观点:

视图1 = 200dp

视图2 = 300dp

当 ViewPager2 ( layout_height="wrap_content") 加载时——查看 View1,它的高度将为 200dp。

但是当我滚动到 View2 时,高度仍然是 200dp;View2 的最后 100dp 被截断。

4

12 回答 12

18

解决的办法是在让孩子重新测量自己之后,注册一个PageChangeCallback并调整一个。LayoutParamsViewPager2

pager.registerOnPageChangeCallback(object : ViewPager2.OnPageChangeCallback() {
    override fun onPageSelected(position: Int) {
        super.onPageSelected(position)
        val view = // ... get the view
        view.post {
            val wMeasureSpec = MeasureSpec.makeMeasureSpec(view.width, MeasureSpec.EXACTLY)
            val hMeasureSpec = MeasureSpec.makeMeasureSpec(0, MeasureSpec.UNSPECIFIED)
            view.measure(wMeasureSpec, hMeasureSpec)

            if (pager.layoutParams.height != view.measuredHeight) {
                // ParentViewGroup is, for example, LinearLayout
                // ... or whatever the parent of the ViewPager2 is
                pager.layoutParams = (pager.layoutParams as ParentViewGroup.LayoutParams)
                    .also { lp -> lp.height = view.measuredHeight }
            }
        }
    }
})

或者,如果您的视图的高度可能由于例如异步数据加载而在某些时候发生变化,那么请改用全局布局侦听器:

pager.registerOnPageChangeCallback(object : ViewPager2.OnPageChangeCallback() {
    private val listener = ViewTreeObserver.OnGlobalLayoutListener {
        val view = // ... get the view
        updatePagerHeightForChild(view)
    }

    override fun onPageSelected(position: Int) {
        super.onPageSelected(position)
        val view = // ... get the view
        // ... IMPORTANT: remove the global layout listener from other views
        otherViews.forEach { it.viewTreeObserver.removeOnGlobalLayoutListener(layoutListener) }
        view.viewTreeObserver.addOnGlobalLayoutListener(layoutListener)
    }

    private fun updatePagerHeightForChild(view: View) {
        view.post {
            val wMeasureSpec = MeasureSpec.makeMeasureSpec(view.width, MeasureSpec.EXACTLY)
            val hMeasureSpec = MeasureSpec.makeMeasureSpec(0, MeasureSpec.UNSPECIFIED)
            view.measure(wMeasureSpec, hMeasureSpec)

            if (pager.layoutParams.height != view.measuredHeight) {
                // ParentViewGroup is, for example, LinearLayout
                // ... or whatever the parent of the ViewPager2 is
                pager.layoutParams = (pager.layoutParams as ParentViewGroup.LayoutParams)
                    .also { lp -> lp.height = view.measuredHeight }
            }
        }
    }
}

请参阅此处的讨论:

https://issuetracker.google.com/u/0/issues/143095219

于 2019-10-30T19:43:51.037 回答
11

就我而言,添加adapter.notifyDataSetChanged()帮助onPageSelected

于 2020-02-24T23:40:59.683 回答
6

只需为所需Fragment的 in执行此操作ViewPager2

override fun onResume() {
     super.onResume()
     layoutTaskMenu.requestLayout()
}

Jetpack:(binding.root.requestLayout()感谢@syed-zeeshan 提供详细信息)

于 2021-08-07T10:18:34.703 回答
5

然而,我自己偶然发现了这个案例。我决定将视图包装在 ConstraintLayout 中,而不是调整视图的大小作为接受的答案。这要求您指定 ViewPager2 的大小,而不是使用 wrap_content。

因此,与其改变我们的 viewpager 的大小,它必须是它处理的最大视图的最小尺寸。

对 Android 有点新,所以不知道这是否是一个好的解决方案,但它对我有用。

换句话说:

<androidx.constraintlayout.widget.ConstraintLayout
  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"
  >
    <!-- Adding transparency above your view due to wrap_content -->
    <androidx.constraintlayout.widget.ConstraintLayout
      android:layout_width="match_parent"
      android:layout_height="wrap_content"
      app:layout_constraintBottom_toBottomOf="parent"
      app:layout_constraintStart_toStartOf="parent"
      app:layout_constraintEnd_toEndOf="parent"
      >

      <!-- Your view here -->

    </androidx.constraintlayout.widget.ConstraintLayout>
</androidx.constraintlayout.widget.ConstraintLayout>
于 2020-02-26T09:44:04.167 回答
5

对我来说,这非常有效:


    viewPager2.registerOnPageChangeCallback(object : ViewPager2.OnPageChangeCallback() {
            override fun onPageScrolled(
                position: Int,
                positionOffset: Float,
                positionOffsetPixels: Int
            ) {
                super.onPageScrolled(position,positionOffset,positionOffsetPixels)
                if (position>0 && positionOffset==0.0f && positionOffsetPixels==0){
                    viewPager2.layoutParams.height =
                        viewPager2.getChildAt(0).height
                }
            }
        })
于 2020-10-03T13:23:04.267 回答
2

只需在 ViewPager2 中使用的 Fragment 类中调用.requestLayout()布局的根视图onResume()

于 2021-08-11T13:44:59.960 回答
1

@sonique 在这里有一个非常详细的答案和解释。

https://stackoverflow.com/a/64235840/2867351

基本上,您应该尝试做的是在onPageSelected().

您可以ViewPager2通过使用轻松访问您内部的视图childFragmentManager

确保您的子片段layout_heightwrap_content. 否则,当视图尝试测量其高度时,您将看到奇怪的行为。

我学得很辛苦。

viewPager.registerOnPageChangeCallback(object : ViewPager2.OnPageChangeCallback() {
    override fun onPageSelected(position: Int) {
        super.onPageSelected(position)
        if (childFragmentManager.fragments.size > position) {
            val fragment = childFragmentManager.fragments.get(position)
            fragment.view?.let {
                updatePagerHeightForChild(it, viewPager)
            }
        }
    }

    fun updatePagerHeightForChild(view: View, pager: ViewPager2) {
        view.post {
            val widthMeasureSpec = View.MeasureSpec.makeMeasureSpec(
                view.width, View.MeasureSpec.EXACTLY
            )
            val heightMeasureSpec = View.MeasureSpec.makeMeasureSpec(
                0, View.MeasureSpec.UNSPECIFIED
            )
            view.measure(widthMeasureSpec, heightMeasureSpec)
            if (pager.layoutParams.height != view.measuredHeight) {
                pager.layoutParams = (pager.layoutParams).also {
                    it.height = view.measuredHeight
                }
            }
        }
    }
})
于 2021-04-15T07:43:01.030 回答
1

没有发布的答案完全适用于我的情况 -事先不知道每页的高度- 所以我使用以下方式解决了不同的ViewPager2页面高度:ConstraintLayout

<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"
    >

    <com.google.android.material.appbar.AppBarLayout
        android:id="@+id/appBarLayout"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        >

        <!-- ... -->

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

    <!-- Wrapping view pager into constraint layout to make it use maximum height for each page. -->
    <androidx.constraintlayout.widget.ConstraintLayout
        android:id="@+id/viewPagerContainer"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        app:layout_constraintBottom_toTopOf="@id/bottomNavigationView"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@id/appBarLayout"
        >

        <androidx.viewpager2.widget.ViewPager2
            android:id="@+id/viewPager"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:orientation="horizontal"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toTopOf="parent"
            />

    </androidx.constraintlayout.widget.ConstraintLayout>

    <com.google.android.material.bottomnavigation.BottomNavigationView
        android:id="@+id/bottomNavigationView"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:menu="@menu/bottom_navigation_menu"
        />

</androidx.constraintlayout.widget.ConstraintLayout>
于 2021-03-18T08:48:46.220 回答
1

@ Mephoros代码在视图之间滑动时可以完美运行,但在第一次查看视图时无法正常工作。刷卡后它按预期工作。

因此,以编程方式滑动 viewpager:

binding.viewpager.setCurrentItem(1)
binding.viewpager.setCurrentItem(0) //back to initial page 
于 2021-04-23T09:13:20.010 回答
0

我也被这个问题困住了。我正在为带有帐户信息的几个选项卡实现 TabLayout 和 ViewPager2。这些标签必须具有不同的高度,例如:View1 - 300dp、View2 - 200dp、Tab3 - 500dp。高度被锁定在第一个视图的高度内,其他的被剪切或延伸到(示例)300dp。像这样:

在此处输入图像描述

因此,经过两天的搜索,我没有任何帮助(或者我不得不尝试更好),但我放弃了并使用 NestedScrollView 来查看我的所有视图。当然,现在我没有效果,配置文件的标题在 3 个视图中滚动显示信息,但至少它现在以某种方式工作。希望这个对某人有所帮助!如果您有任何建议,请随时回复!

Ps 我很抱歉我的英语不好。

于 2021-11-21T16:00:13.950 回答
0

我有一个类似的问题并解决如下。就我而言,我让 ViewPager2 与 TabLayout 一起使用不同高度的片段。在 onResume() 方法的每个片段中,我添加了以下代码:

@Override
public void onResume() {
    super.onResume();
    setProperHeightOfView();
}

private void setProperHeightOfView() {
    View layoutView = getView().findViewById( R.id.layout );
    if (layoutView!=null) {
        ViewGroup.LayoutParams layoutParams = layoutView.getLayoutParams();
        if (layoutParams!=null) {
            layoutParams.height = ViewGroup.LayoutParams.WRAP_CONTENT;
            layoutView.requestLayout();
        }
    }
}

R.id.layout 是特定片段的布局。我希望我有所帮助。最好的问候,T。

于 2021-11-27T22:16:14.547 回答
-1
viewPager.registerOnPageChangeCallback(object : ViewPager2.OnPageChangeCallback() {
  override fun onPageSelected(position: Int) {
    super.onPageSelected(position)
    val view = (viewPager[0] as RecyclerView).layoutManager?.findViewByPosition(position)

    view?.post {
      val wMeasureSpec = MeasureSpec.makeMeasureSpec(view.width, MeasureSpec.EXACTLY)
      val hMeasureSpec = MeasureSpec.makeMeasureSpec(0, MeasureSpec.UNSPECIFIED)
      view.measure(wMeasureSpec, hMeasureSpec)

      if (viewPager.layoutParams.height != view.measuredHeight) {
        viewPager.layoutParams = (viewPager.layoutParams).also { lp -> lp.height = view.measuredHeight }
      }
    }
  }
})
于 2021-07-06T07:15:23.230 回答