android - AppBarLayout 在 Toolbar 下方滚动内容

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"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/coordinator_layout"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".ui.MainActivity">

    <android.support.design.widget.AppBarLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:theme="@style/AppTheme.AppBarOverlay">

        <android.support.v7.widget.Toolbar
            android:id="@+id/toolbar"
            android:layout_width="match_parent"
            android:layout_height="?attr/actionBarSize"
            android:background="?attr/colorPrimary"
            app:popupTheme="@style/AppTheme.PopupOverlay" />

        <RelativeLayout
            android:id="@+id/box_search"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginBottom="16dp"
            android:layout_marginLeft="16dp"
            android:layout_marginRight="16dp"
            app:layout_scrollFlags="scroll|enterAlways">

            <TextView
                android:id="@+id/text_search_filter"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:text="Line 1"
                android:textColor="#FFF" />

            <TextView
                android:id="@+id/text_search_category"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_below="@id/text_search_filter"
                android:text="Line 2"
                android:textColor="#FFF" />

            <TextView
                android:id="@+id/text_search_location"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_below="@id/text_search_category"
                android:text="Line 3"
                android:textColor="#FFF" />
        </RelativeLayout>
    </android.support.design.widget.AppBarLayout>

    <include layout="@layout/content_main" />

    <android.support.design.widget.FloatingActionButton
        android:id="@+id/fab"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="bottom|end"
        android:layout_margin="@dimen/fab_margin"
        android:src="@drawable/ic_add_white_24dp" />
</android.support.design.widget.CoordinatorLayout>

如果我将内容区域放在工具栏上方，我可以获得预期的效果，但显然它的位置不对。

如果我将内容区域放在工具栏下方，则不会滚动...

Answer 1

If I put content area above Toolbar I am able to get the desired effect, but obviously it's in the wrong position.

当然它的位置是错误的，因为:http://www.google.com/design/spec/layout/structure.html#structure-app-bar

The app bar, formerly known as the action bar in Android, is a special kind of toolbar that’s used for branding, navigation, search, and actions.

所以，你需要添加一个CollapsingToolbarLayout以及上面的内容。

和:

I'd like to have a content area below my Toolbar. Its behavior should be to scroll while scrolling up and to enter immediately while scrolling down, Toolbar should stay on its place without any scrolling.

为了在添加 CollapsingToolbarLayout 后不滚动 Toolbar，您可能需要将 app:layout_collapseMode="pin" 添加到 工具栏。