CoordinatorLayout与ViewPager联合使用时的奇怪行为

Question

我在我的应用程序中有以下的主页布局：

<?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"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <android.support.v4.view.ViewPager
        android:id="@+id/mainPager"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:layout_behavior="@string/app_bar_scrolling_view_behavior">
    </android.support.v4.view.ViewPager>

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

        <android.support.v7.widget.Toolbar
            xmlns:android="http://schemas.android.com/apk/res/android"
            android:id="@+id/actionToolbar"
            android:layout_height="wrap_content"
            android:layout_width="match_parent"
            android:minHeight="?attr/actionBarSize"
            android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
            app:title="@string/app_name"
            app:popupTheme="@style/ThemeOverlay.AppCompat.Light"
            android:background="?attr/colorPrimary"
            app:layout_scrollFlags="scroll|enterAlways">
        </android.support.v7.widget.Toolbar>

        <android.support.design.widget.TabLayout
            android:id="@+id/tabLayout"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
            app:layout_scrollFlags="scroll|enterAlways">
        </android.support.design.widget.TabLayout>
    </android.support.design.widget.AppBarLayout>
</android.support.design.widget.CoordinatorLayout>

滚动内容是ViewPager。我与TabLayout一起使用ViewPager：

ViewPager viewPager = (ViewPager) v.findViewById(R.id.mainPager);
TabLayout tabLayout = (TabLayout) v.findViewById(R.id.tabLayout);
tabLayout.setupWithViewPager(viewPager);
tabLayout.setTabMode(TabLayout.MODE_FIXED);
tabLayout.setTabGravity(TabLayout.GRAVITY_FILL);

所有ViewPager适配器中的片段都有一个内部RecyclerView。 当我首次向上滚动RecyclerView的内容（以隐藏应用栏），然后切换到ViewPager中的另一页数据并向下滚动RecyclerView的内容时，应用栏是...不可见的。 导致此问题的主要步骤： 1. 在API级别为11或更高的设备上运行（在API级别低于11的设备上一切正常）; 2. 向上滚动内容; 3. 切换到另一个ViewPager页面; 4. 向下滚动内容以使应用栏可见; 5. 应用栏不可见。 我的问题在哪里？谢谢。

编辑1：片段工具栏初始化

Toolbar toolbar = (Toolbar) view.findViewById(R.id.actionToolbar);
toolbar.setTitle(toolbarTitleResId);
toolbar.inflateMenu(menuResId);
toolbar.setOnMenuItemClickListener(listener);

编辑2：片段的布局

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <android.support.v7.widget.Toolbar
        xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:app="http://schemas.android.com/apk/res-auto"
        android:id="@+id/actionToolbar"
        android:layout_height="wrap_content"
        android:layout_width="match_parent"
        android:layout_alignParentTop="true"
        android:minHeight="?attr/actionBarSize"
        android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
        app:popupTheme="@style/ThemeOverlay.AppCompat.Light"
        android:background="?attr/colorPrimary">
    </android.support.v7.widget.Toolbar>

    <View
        android:id="@+id/anchor"
        android:layout_height="8dp"
        android:layout_width="match_parent"
        android:background="@drawable/shadow_gradient_drawable"
        android:layout_below="@+id/actionToolbar">
    </View>

    <android.support.v7.widget.RecyclerView
        android:id="@+id/verticalRecyclerView"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_below="@+id/anchor"/>
</RelativeLayout>

- vadim

---

我在您所发布的代码中没有看到任何引人注目的地方。您能否将工具栏初始化的代码添加到片段和片段布局文件中呢？ - blackcj

通过添加的Fragment代码，我的API 22设备上一切仍然正常工作。我建议给工具栏分配不同的ID以避免命名冲突，但即使使用相同的ID，我也无法复现该问题。如果您可以在此处发布更多代码或将项目放在Github上，我很乐意再次查看。 - blackcj

@blackcj，好的，我会尝试让我的代码更加简洁，如果我找不到错误，我会将其放在Github上。 - vadim

据我所知，CoordinatorLayout的子元素必须是AppBarLayout、NestedScrollView、FloadingActionButton或从这些布局之一继承的任何子布局。将ViewPager作为CoordinatorLayout的直接子项可能会导致该子项不可见或无法正确呈现。我已经尝试过其他一些布局组，但没有使用ViewPager。我的体验并不愉快，这非常混乱，被迫改用更标准的布局。 - Neon Warge

Answer 1

我能够在我的API 16设备上重现这个问题（在API 22上仍然没有问题）。这明显是AppBarLayout中的一个bug，不过有一个快速的解决方法。只有当AppBarLayout完全隐藏时才会出现这个问题。在AppBarLayout中添加一个高度为1dp的视图，就可以在视图上不太引人注目的情况下使一切正常工作。

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

    <!-- Toolbar and tab bar code -->
    ...

    <!-- Add this -->
    <View
        android:layout_width="match_parent"
        android:layout_height="1dp"
        android:background="@color/colorPrimary" />
</android.support.design.widget.AppBarLayout>

- blackcj

---

这个解决方案完美地运行了！感谢您的回复。 - vadim

Answer 2

我们也可以将这个解决方案应用于切换到另一个ViewPager页面。

appBarLayout.setExpanded(true, true);

如果第二个参数为true，AppBarLayout将会以动画的方式展开。

- Naveen Kumar M