Android:将TabLayout固定到Scrollview的顶部

Question

我正在看手机上的推特应用程序.

你可以看到,当用户向上滚动时,tabLayout实际上只是很好地将自己固定在工具栏的底部而根本不移动.

我想也许他们通过将应用程序的所有顶部(配置文件图片,自行车的配置文件壁纸,草地,文本)放入CollapsingToolBarLayout和AppBarLayout,但实际上只有配置文件壁纸草地上的自行车是CollapsingToolBarLayout和AppBarLayout的一部分,因为这是实际崩溃的唯一部分.文本部分向上滚动,tabLayout只是固定在工具栏下方的顶部.

我在twitter应用程序上阅读了这些学分,看起来他们使用SlidingTabLayout来实现它们的效果.SlidingTabLayout类似于tabLayout,后者在支持库中受支持.

它看起来像现在主流应用程序使用的相当常见的模式 -

Google+应用在应用的个人资料视图中使用它:

Facebook Moments在他们的应用中使用它:

知道他们是怎么做的都设法做到了吗？

我正在寻找类似于所有这些应用程序的东西.

我的要求是:

1. 滚动时有一个collapsingToolBarLayout崩溃
2. 在collapsingToolBarLayout下面有一个textview,当它完全折叠时会在toolBar下面滚动和"隐藏".
3. 当你在collapsingToolBarLayout下滚动textview时,在textview下面有一个tabLayout,它会"粘住"tabLayout.
4. 在tabLayout下面有一个recyclerview,这样当你点击tabLayout中的每个标签时,recyclerview将在"推文","照片","收藏夹"等列表之间切换.

我查看了SO上发布的另外两个问题:

TabLayout的标签选择指示器在滚动时是否可以固定在屏幕顶部？.这里的答案似乎是改变tabLayout的行为,但我怀疑改变行为实际上会生成twitter应用程序的功能.正如我所提到的,tabLayout似乎位于CollapsingToolBarLayout和AppBarLayout之外,只有当它位于CollapsingToolBarLayout和AppBarLayout中时,行为才有效.

如何在ScrollView顶部固定TabLaout？.这个问题提出的问题与我提出的问题类似,但没有给出足够的细节,也没有答案.

Answer 1

对于那些前3个问题看这里(链接似乎死了)所以这个回路机器链接.它指向https://github.com/slidenerd/Android-Design-Support-Library-Demo上的github演示回购

对于第4个,您需要为每个选项卡创建片段并在选择它们时加载它们以进行简单的方法,或者您可以创建一个片段并与其通信以在选择选项卡时显示特定内容.

编辑 无法找到更新的链接,所以这里是答案

1. 使用CoordinaterLayout.
2. 使用工具栏要折叠(或隐藏)的任何内容都会进入collapsingToolBarLayout.
3. 在CollapsingToolbarLayout之后,在折叠的toolBar之后停留的任何内容都会进入AppBarLayout.

前 -

<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:background="@android:color/background_light"
    android:fitsSystemWindows="true"
    >

    <android.support.design.widget.AppBarLayout
        android:id="@+id/main.appbar"
        android:layout_width="match_parent"
        android:layout_height="300dp"
        android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
        android:fitsSystemWindows="true"
        >

        <android.support.design.widget.CollapsingToolbarLayout
            android:id="@+id/main.collapsing"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            app:layout_scrollFlags="scroll|exitUntilCollapsed"
            android:fitsSystemWindows="true"
            app:contentScrim="?attr/colorPrimary"
            app:expandedTitleMarginStart="48dp"
            app:expandedTitleMarginEnd="64dp"
            >

            <ImageView
                android:id="@+id/main.backdrop"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:scaleType="centerCrop"
                android:fitsSystemWindows="true"
                android:src="@drawable/material_flat"
                app:layout_collapseMode="parallax"
                />

            <android.support.v7.widget.Toolbar
                android:id="@+id/main.toolbar"
                android:layout_width="match_parent"
                android:layout_height="?attr/actionBarSize"
                app:popupTheme="@style/ThemeOverlay.AppCompat.Light"
                app:layout_collapseMode="pin"
                />
         <!-- ADD ANY THING THAT GETS SCROLLED ALL THE WAY UP WITH TOOLBAR -->
        </android.support.design.widget.CollapsingToolbarLayout>

     <!--- ADD TAB_LAYOUT HERE---> 

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

    <android.support.v4.widget.NestedScrollView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:layout_behavior="@string/appbar_scrolling_view_behavior"
        >

        <TextView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:textSize="20sp"
            android:lineSpacingExtra="8dp"
            android:text="@string/lorem"
            android:padding="@dimen/activity_horizontal_margin"
            />
    </android.support.v4.widget.NestedScrollView>

    <android.support.design.widget.FloatingActionButton
        android:layout_height="wrap_content"
        android:layout_width="wrap_content"
        android:layout_margin="@dimen/activity_horizontal_margin"
        android:src="@drawable/ic_comment_24dp"
        app:layout_anchor="@id/main.appbar"
        app:layout_anchorGravity="bottom|right|end"
        />
</android.support.design.widget.CoordinatorLayout>