Slide RecyclerView up as you swipe it up, or slide recyclerview down as you swipe down

Question

I want to create a Fragment with a RecyclerView that slides up and shows more items as you slide it up.

Here is an example of what I am talking about.

Initial Creation:

User Swipes Up to slide RecyclerView up, shows more items:

There are a few issues, I would like to not use a CoordinatorLayout, and I would like to set it to where the items in the RecyclerView stack up directly on top of the EditText.

This is the layout code I am using:

<android.support.design.widget.CoordinatorLayout
android:id="@+id/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:visibility="visible">

<android.support.design.widget.AppBarLayout
    android:id="@+id/appBarLayout"
    android:layout_width="match_parent"
    android:layout_height="400dp"
    android:background="@android:color/transparent"
    android:fitsSystemWindows="true"
    android:orientation="vertical">

    <android.support.design.widget.CollapsingToolbarLayout
        android:id="@+id/collapsingToolbar"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="@android:color/transparent"
        android:fitsSystemWindows="true"
        app:layout_scrollFlags="scroll|exitUntilCollapsed">

        <View
            android:id="@+id/emptyView"
            android:layout_width="match_parent"
            android:layout_height="400dp"
            android:background="@android:color/transparent"
            app:layout_collapseMode="parallax"/>

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

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

<android.support.v7.widget.RecyclerView
    android:id="@+id/recyclerView"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    app:layout_behavior="@string/appbar_scrolling_view_behavior"/>

<RelativeLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="vertical">

        <EditText
            android:id="@+id/editText"
            android:paddingLeft="16dp"
            android:inputType="textAutoCorrect"
            android:layout_centerVertical="true"
            android:background="@android:color/transparent"
            android:layout_width="match_parent"
            android:layout_height="56dp"/>

    </RelativeLayout>

</RelativeLayout>

And I get something like this:

This is definitely not scalable, and empty view would need to be consistently measured.

Is there a reason why you don't want a CoordinateLayout implementation? — Ari, Nov 22 '15 at 13:51

score 11 · Accepted Answer · answered Dec 01 '15 at 19:58

11

I solved this by using a custom TouchListener all of the other solutions were very basic and limited to a specific and boxed use-case.

The way I did this was to implement a new TouchListener based off of this library:

BounceTouchListener

I get the following results:

answered Dec 01 '15 at 19:58

AndyRoid

5,062
8
38
73

Thanks @AndyRoid for BounceTouchListener – Jaymin Panchal Dec 21 '16 at 12:14

David · Answer 2 · 2015-11-27T06:37:30.260

5

Use RecyclerView with 2 types of rows:

Empty row/rows colored gray (without divider)
Rows with content as you already have

The RecyclerView will have to match_parent to the entire fragment

So you will get the right effect of a "blank" area on top of the RecyclerView.

edited Nov 27 '15 at 06:37

answered Nov 27 '15 at 04:29

David

37,109
32
120
141

This would be a solution I would go to off the top of my head, and I did consider this BUT there are a few key issues, you can slide up the entire `RecyclerView` I would like it to not slide past the items. So I basically want to prevent something like image 3 – AndyRoid Nov 27 '15 at 04:59
@AndyRoid I didn't understand what is your issue with that option? Can you explain it with more details? – David Nov 28 '15 at 15:50
In iOS land you can set additional contentInset to the top or bottom of a tableview, this gives additional scrolling area. Is there anything similar in Android? I want to set the live above the edittext and then give additional contentInset below the RecyclerView so that you can scroll just a little bit underneath the keyboard. – AndyRoid Nov 30 '15 at 23:03

score 0 · Answer 3 · answered Nov 30 '15 at 18:38

You can use setReverseLayout of LinearLayoutManager

Used to reverse item traversal and layout order. This behaves similar to the layout change for RTL views. When set to true, first item is laid out at the end of the UI, second item is laid out before it etc. For horizontal layouts, it depends on the layout direction. When set to true, If RecyclerView is LTR, than it will layout from RTL, if RecyclerView} is RTL, it will layout from LTR. If you are looking for the exact same behavior of setStackFromBottom(boolean), use setStackFromEnd(boolean)

Slide RecyclerView up as you swipe it up, or slide recyclerview down as you swipe down

3 Answers3