layout_collapseMode:PIN不生效求助：TabLayout随滚动上移无法固定

问题分析 #

我之前也踩过这个坑！你遇到的核心问题是TabLayout没有和顶部滚动区域配置正确的联动规则，导致整个AppBarLayout的子View都跟着内容滚动了。要实现“顶部图片滚上去后TabLayout固定”的效果，得靠CollapsingToolbarLayout来拆分AppBar的滚动区域，再给TabLayout设置专属的滚动行为。

完整可运行布局示例 #

<?xml version="1.0" encoding="utf-8"?>
<androidx.coordinatorlayout.widget.CoordinatorLayout
    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">

    <!-- 核心滚动容器AppBarLayout -->
    <com.google.android.material.appbar.AppBarLayout
        android:id="@+id/appBar"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:elevation="2dp"
        android:fitsSystemWindows="true"
        android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">

        <!-- 折叠容器：负责顶部图片的滚动折叠逻辑 -->
        <com.google.android.material.appbar.CollapsingToolbarLayout
            android:id="@+id/collapsingToolbar"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            app:layout_scrollFlags="scroll|exitUntilCollapsed"
            android:fitsSystemWindows="true">

            <!-- 顶部可滚动的图片区域 -->
            <ImageView
                android:id="@+id/top_scroll_image"
                android:layout_width="match_parent"
                android:layout_height="220dp"
                android:scaleType="centerCrop"
                android:src="@drawable/your_banner_img"
                app:layout_collapseMode="parallax" <!-- 滚动时的视差效果，可选 -->
                android:fitsSystemWindows="true"/>

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

        <!-- 需要固定的TabLayout -->
        <com.google.android.material.tabs.TabLayout
            android:id="@+id/tabLayout"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            app:layout_scrollFlags="snap|enterAlways"
            app:tabMode="fixed"
            app:tabGravity="fill"/>

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

    <!-- 滚动内容区域：必须绑定AppBar的滚动行为 -->
    <androidx.viewpager2.widget.ViewPager2
        android:id="@+id/viewPager"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:layout_behavior="@string/appbar_scrolling_view_behavior"/>

</androidx.coordinatorlayout.widget.CoordinatorLayout>

关键配置详解 #

• CoordinatorLayout：作为根布局是核心，它能让AppBarLayout和下方的滚动内容产生联动交互，没有它一切滚动规则都不生效。
• CollapsingToolbarLayout的scrollFlags：scroll|exitUntilCollapsed表示顶部图片区域会随内容滚动向上折叠，直到折叠到AppBar的最小高度（也就是TabLayout的高度）就停止。
• TabLayout的scrollFlags：snap|enterAlways确保TabLayout在顶部图片折叠完成后，固定在AppBar的底部，不会继续跟着滚动；snap还能让滚动结束时自动吸附到固定状态。
• ViewPager的layout_behavior：必须设置为@string/appbar_scrolling_view_behavior，这样滚动ViewPager里的内容时，才能触发AppBarLayout的折叠/展开逻辑。

常见问题排查 #

1. 如果你还在用旧的android.support库，把所有com.google.android.material替换成android.support.design对应的组件即可。
2. 确保ViewPager里的Fragment内容是可滚动的（比如用RecyclerView、NestedScrollView），否则不会触发AppBar的滚动联动。
3. 别给TabLayout加layout_collapseMode="pin"，这会让它和顶部图片一起折叠消失，而不是固定在底部。

内容的提问来源于stack exchange，提问作者Gaurav Arora