当 ViewPager 包含额外的非 RecyclerView 组件时如何隐藏 TabLayout答案

【问题标题】：How to hide TabLayout, when ViewPager contains additional non-RecyclerView components当 ViewPager 包含额外的非 RecyclerView 组件时如何隐藏 TabLayout
【发布时间】：2016-03-16 16:14:52
【问题描述】：

当ViewPager 包含其他非RecylerView 组件时，我遇到了隐藏TabLayout 的问题。

目前，我有以下布局。

在能够隐藏 TabLayout 之前

XML文件如下

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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:orientation="vertical" >

    <android.support.design.widget.AppBarLayout
        android:id="@+id/app_bar_layout"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar" >
        <android.support.design.widget.TabLayout
            android:id="@+id/tab_layout"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            app:tabIndicatorColor="?attr/portfolioTabIndicatorColor" />
    </android.support.design.widget.AppBarLayout>

    <android.support.v4.view.ViewPager
        android:id="@+id/view_pager"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1"
        />

</LinearLayout>

以下组件属于ViewPager 中3 个子片段中的1 个。

RecylerView - 包含白卡的视图
LinearLayout 页脚 - 包含“Profit”和“RM-5,936.88”的页脚
LinearLayout 状态栏 - 包含“每日利润：RM-172.00”的状态栏

ViewPager的这个子片段看起来像（更多细节可以在https://gist.github.com/yccheok/da69b317e48af132f54c找到）

ViewPager 的子片段布局

<LinearLayout>
    <android.support.v7.widget.RecyclerView/>
    <LinearLayout /> <!-- Footer -->
    <LinearLayout /> <!-- Status bar -->
</LinearLayout>

目前，只有 RecylerView 可以滚动。

Toolbar、TabLayout、LinearLayout Footer 和LinearLayout Status Bar 等其他组件的位置和大小是静态的。

现在我希望在滚动RecylerView 时隐藏TabLayout。我指的是Hide TabLayout on Scroll of Content instead of ToolBar

能够隐藏 TabLayout 后

<?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:id="@+id/coordinator_layout"
    android:layout_width="match_parent"
    android:layout_height="match_parent" >

    <android.support.design.widget.AppBarLayout
        android:id="@+id/app_bar_layout"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar" >

        <android.support.design.widget.CollapsingToolbarLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            app:layout_scrollFlags="scroll|enterAlways">

            <android.support.design.widget.TabLayout
                android:id="@+id/tab_layout"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                app:tabIndicatorColor="?attr/portfolioTabIndicatorColor" />

        </android.support.design.widget.CollapsingToolbarLayout>
    </android.support.design.widget.AppBarLayout>

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

</android.support.design.widget.CoordinatorLayout>

结果不是我想要的，因为“LinearLayout 页脚”和“LinearLayout 状态栏”被按下了

但滚动隐藏TabLayout 一些工作原理。请参考下面的 2 个屏幕截图。

有可能吗？

继续将 LinearLayout 页脚和 LinearLayout 状态栏作为 ViewPager 的子片段布局的一部分。
将 LinearLayout 页脚和 LinearLayout 状态栏的位置设为静态。
执行RecylerView滚动时可以隐藏TabLayout。

【问题讨论】：

标签： android android-layout

【解决方案1】：

据我了解，要实现这一点，您必须在活动 xml 中定义布局，而不是在视图寻呼机中定义片段。并使用可以更改 LinearLayout 和 StatusBarLayout 数据的接口将数据从片段传递到 Activity，您可以使用 android:layout_gravity="bottom" 为您的 LinearLayout 和 StatusBarLayout 容器将它们静态定位在协调器布局的底部。

【讨论】：

【解决方案2】：

在您不使用回收视图的情况下。尝试使用支持库中提供的嵌套滚动视图来包装视图。这将启用协调器布局的滚动行为。

【讨论】：

【解决方案3】：

通过以下教程，我能够实现我想要的目标

https://mzgreen.github.io/2015/02/15/How-to-hideshow-Toolbar-when-list-is-scroling%28part1%29/

http://mzgreen.github.io/2015/02/28/How-to-hideshow-Toolbar-when-list-is-scrolling%28part2%29/

关键思想是

不要使用CoordinatorLayout
将TabLayout 和RecyclerView 放在FrameLayout 中，这样TabLayout 将覆盖在RecyclerView 的顶部
在RecyclerView 上添加顶部填充。拥有android:clipToPadding="false" 也很重要。
要在滚动过程中隐藏/显示TabLayout，请将HidingScrollListener 附加到RecyclerView。

此解决方案的缺点是，由于顶部填充，requiresFadingEdge 将不再适用于 RecyclerView。

【讨论】：