ViewPager嵌套NestedScrollView后不显示内容的问题求助

嘿，我完全懂你遇到的糟心情况——原本好好的ViewPager，套上NestedScrollView之后直接“隐身”了，去掉ScrollView又能正常显示页面，这可太闹心了😅。让我来帮你分析原因，再给你两个可行的解决思路：

问题根源 #

你遇到的核心问题是ViewPager和NestedScrollView的滚动测量冲突：
当你用NestedScrollView包裹ViewPager，并且给ViewPager设置android:layout_height="wrap_content"时，NestedScrollView的滚动特性会导致ViewPager无法正确计算自身的高度，最终被压缩成高度为0，自然就看不见了。

方案一：推荐！给每个Fragment的布局套NestedScrollView（更合理的交互逻辑） #

其实咱们完全不需要给整个ViewPager套滚动容器，正确的做法是让每个Fragment内部的长内容自己负责滚动，ViewPager只专注于页面切换。这样既不会有测量问题，交互体验也更符合用户习惯。

先修改你的主布局，去掉外层的NestedScrollView，让ViewPager直接和ConstraintLayout绑定：

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

    <FrameLayout
        android:id="@+id/templateContainer"
        android:layout_width="0dp"
        android:layout_height="0dp"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintBottom_toTopOf="@id/newjobcardtabLayout"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHeight_percent="0.5">

        <ImageView
            android:id="@+id/templateLayout"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:scaleType="fitCenter"
            app:srcCompat="@drawable/veh_cond_template" />

    </FrameLayout>

    <com.google.android.material.tabs.TabLayout
        android:id="@+id/newjobcardtabLayout"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:tabTextAppearance="@style/TabLayoutTextStyle"
        app:layout_constraintTop_toBottomOf="@id/templateContainer"/>

    <!-- 直接让ViewPager占满TabLayout下方的剩余空间 -->
    <androidx.viewpager.widget.ViewPager
        android:id="@+id/newjobcardviewPager"
        android:layout_width="0dp"
        android:layout_height="0dp"
        app:layout_constraintTop_toBottomOf="@id/newjobcardtabLayout"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintEnd_toEndOf="parent"/>

</androidx.constraintlayout.widget.ConstraintLayout>

然后，在你ViewPager对应的每个Fragment的布局文件里，把需要滚动的长内容放到NestedScrollView中，比如其中一个Fragment的布局示例：

<androidx.core.widget.NestedScrollView
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <!-- 用垂直线性布局包裹Fragment的所有内容 -->
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="vertical"
        android:padding="16dp">

        <!-- 这里放你的长内容，比如多行文本、表单元素等 -->
        <TextView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="这里是Fragment里需要滚动的超长内容，比如大量的说明文字、多个输入框列表..."
            android:textSize="18sp"
            android:lineSpacingExtra="8dp"/>
        
        <!-- 更多需要滚动的组件... -->

    </LinearLayout>

</androidx.core.widget.NestedScrollView>

这种方式既保证了ViewPager正常显示，又能让每个Fragment的长内容独立滚动，是Android开发中处理此类场景的标准做法。

方案二：如果一定要给ViewPager套NestedScrollView（不推荐，仅作备选） #

如果你因为某些特殊需求，必须给整个ViewPager套NestedScrollView，那可以通过自定义ViewPager来解决高度测量的问题：

1. 先创建一个自定义的ViewPager类，让它能正确测量自身高度：

public class WrapContentHeightViewPager extends ViewPager {
    public WrapContentHeightViewPager(Context context) {
        super(context);
    }

    public WrapContentHeightViewPager(Context context, AttributeSet attrs) {
        super(context, attrs);
    }

    @Override
    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
        int maxHeight = 0;
        // 遍历所有子页面，获取最高页面的高度作为ViewPager的高度
        for (int i = 0; i < getChildCount(); i++) {
            View childPage = getChildAt(i);
            childPage.measure(widthMeasureSpec, MeasureSpec.makeMeasureSpec(0, MeasureSpec.UNSPECIFIED));
            int pageHeight = childPage.getMeasuredHeight();
            if (pageHeight > maxHeight) {
                maxHeight = pageHeight;
            }
        }

        // 如果测量到了有效高度，就用这个高度设置ViewPager的测量规格
        if (maxHeight != 0) {
            heightMeasureSpec = MeasureSpec.makeMeasureSpec(maxHeight, MeasureSpec.EXACTLY);
        }

        super.onMeasure(widthMeasureSpec, heightMeasureSpec);
    }
}

2. 然后修改你的主布局，使用这个自定义ViewPager，同时给NestedScrollView设置fillViewport="true"：

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

    <!-- 保留你原有的FrameLayout和TabLayout -->
    <FrameLayout
        android:id="@+id/templateContainer"
        android:layout_width="0dp"
        android:layout_height="0dp"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintBottom_toTopOf="@id/newjobcardtabLayout"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHeight_percent="0.5">

        <ImageView
            android:id="@+id/templateLayout"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:scaleType="fitCenter"
            app:srcCompat="@drawable/veh_cond_template" />

    </FrameLayout>

    <com.google.android.material.tabs.TabLayout
        android:id="@+id/newjobcardtabLayout"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:tabTextAppearance="@style/TabLayoutTextStyle"
        app:layout_constraintTop_toBottomOf="@id/templateContainer"/>

    <!-- 修改NestedScrollView的约束，让它占满剩余空间，同时设置fillViewport -->
    <androidx.core.widget.NestedScrollView
        android:layout_width="0dp"
        android:layout_height="0dp"
        app:layout_constraintTop_toBottomOf="@id/newjobcardtabLayout"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        android:fillViewport="true">

        <!-- 使用自定义的WrapContentHeightViewPager -->
        <com.yourpackage.WrapContentHeightViewPager
            android:id="@+id/newjobcardviewPager"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"/>
    </androidx.core.widget.NestedScrollView>
</androidx.constraintlayout.widget.ConstraintLayout>

⚠️ 注意：这个方案可能会出现页面切换时高度跳动的问题，因为ViewPager会根据当前页面的高度动态调整自身高度，体验不如方案一流畅，所以优先推荐方案一哦。

备注：内容来源于stack exchange，提问作者user23914997