Android QuickReturn Pattern with RecyclerView

Question

I want to place a view above a RecyclerView which scrolls away with the RecyclerView and scrolls immediatly down with a down scroll. I know this behavior as quick return but it was implemented for Listview. I know some similiar can be done with CoordinatorLayout But all samples do something with the toolbar. What i want is done in the eBay App.

Answer 1

You will want to set up a CoordinatorLayout with an embedded AppBarLayout that contains a CollapsingToolbarLayout that wraps a Toolbar and a sibling ViewGroup such as LinearLayout. It is the sibling ViewGroup that will slide behind the toolbar. The other key is to set up the appropriate scroll flags on the CollapsingToolbarLayout as scroll|exitUntilCollapsed|enterAlways.

Here is a short video of the result:

Here is the XML:

<android.support.design.widget.CoordinatorLayout 
    android:id="@+id/coordinatorLayout"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <android.support.design.widget.AppBarLayout
        android:id="@+id/appBar"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:fitsSystemWindows="true"
        android:theme="@style/AppTheme.AppBarOverlay"
        app:expanded="true">

        <android.support.design.widget.CollapsingToolbarLayout
            android:id="@+id/collapsingToolbarLayout"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            app:layout_scrollFlags="scroll|exitUntilCollapsed|enterAlways"
            app:statusBarScrim="?attr/colorPrimaryDark">

            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="?attr/actionBarSize"
                android:layout_marginTop="?attr/actionBarSize"
                android:background="@color/colorAccent"
                android:orientation="vertical"
                app:layout_collapseMode="parallax"
                app:layout_collapseParallaxMultiplier="0.0">

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="This is line #1 of the sliding layout..." />

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="This is line #2 of the sliding layout..." />
            </LinearLayout>

            <android.support.v7.widget.Toolbar
                android:id="@+id/toolbar"
                android:layout_width="match_parent"
                android:layout_height="?attr/actionBarSize"
                android:background="@color/colorPrimary"
                app:layout_collapseMode="pin" />

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

    </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"
        tools:context="example.com.myapp.ScrollingActivity"
        tools:showIn="@layout/activity_scrolling">

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_margin="@dimen/text_margin"
            android:text="@string/large_text" />

    </android.support.v4.widget.NestedScrollView>

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