Hide FloatingActionButton on scroll of RecyclerVie

Question

I want to hide/show FloatingActionButton on scroll of RecyclerView.

My XML layout :

<android.support.design.widget.CoordinatorLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent" >

            <android.support.v7.widget.RecyclerView
                android:id="@+id/recyclerview_eventlist"
                android:layout_width="match_parent"
                android:layout_height="match_parent" />

            <android.support.design.widget.FloatingActionButton
                android:id="@+id/fab_createevent"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_margin="@dimen/fab_margin"
                app:layout_anchor="@id/recyclerview_eventlist"
                app:layout_anchorGravity="bottom|right|end"
                app:layout_behavior="com.eventizon.behavior.ScrollAwareFABBehavior"
                android:src="@drawable/ic_edit"
                app:backgroundTint="@color/custom_color_1"
                app:borderWidth="0dp" />
        </android.support.design.widget.CoordinatorLayout>

DrawerLayout is the parent layout of this layout.

    public class ScrollAwareFABBehavior extends FloatingActionButton.Behavior {


    private static final String TAG = "ScrollAwareFABBehavior";

    public ScrollAwareFABBehavior(Context context, AttributeSet attrs) {
        super();
        Log.e(TAG,"ScrollAwareFABBehavior");
    }

    @Override
    public void onNestedScroll(CoordinatorLayout coordinatorLayout,
            FloatingActionButton child, View target, int dxConsumed,
            int dyConsumed, int dxUnconsumed, int dyUnconsumed) {
        // TODO Auto-generated method stub
        super.onNestedScroll(coordinatorLayout, child, target, dxConsumed, dyConsumed,
                dxUnconsumed, dyUnconsumed);
        Log.e(TAG,"onNestedScroll called");
        if (dyConsumed > 0 && child.getVisibility() == View.VISIBLE) {
            Log.e(TAG,"child.hide()");
            child.hide();
        } else if (dyConsumed < 0 && child.getVisibility() != View.VISIBLE) {
            Log.e(TAG,"child.show()");
            child.show();
        }
    }
}

Used this layout behaviour for FloatingActionButton.

When I see logcat only constructor is getting called. onNestedScroll() doesn't get called when I scroll the list.

Answer 1

All the answers which goes on the Behavior path and onNestedScroll (instead of recyclerview listener) don't comment about the fact that onNestedScroll will be called many times while scrolling. This means that child.show() and child.hide() will be called many times as well. Although show() and hide() are designed to handle that scenario, they still run a lot of code and create some objects which multiplied by the times onNestedScroll is called, result in a lot of objects created unnecessarily.

Considering that and because I wanted to run a different animation instead of the default show() and hide(), I came up with the following Behavior implementation:

public class ScrollAwareFABBehavior extends CoordinatorLayout.Behavior<FloatingActionButton>  {

private static final String TAG = "ScrollAwareFABBehavior";

private boolean fabAnimationStarted = false;
private boolean flingHappened = false;

public ScrollAwareFABBehavior(Context context, AttributeSet attrs) {
    super(context, attrs);
}

@Override
public boolean onStartNestedScroll(@NonNull CoordinatorLayout coordinatorLayout, @NonNull FloatingActionButton child, @NonNull View directTargetChild, @NonNull View target, int axes, int type) {

    if (target instanceof RecyclerView) {
        return true;
    }
    return false;
}

@Override
public void onStopNestedScroll(@NonNull CoordinatorLayout coordinatorLayout, @NonNull final FloatingActionButton child, @NonNull View target, int type) {
    super.onStopNestedScroll(coordinatorLayout, child, target, type);

    // If animation didn't start, we don't need to care about running the restore animation.
    // i.e.: when the user swipes to another tab in a viewpager. The onNestedPreScroll is never called.
    if (!fabAnimationStarted) {
        return;
    }

    // Animate back when the fling ended (TYPE_NON_TOUCH)
    // or if the user made the touch up (TYPE_TOUCH) but the fling didn't happen.
    if (type == ViewCompat.TYPE_NON_TOUCH || (type == ViewCompat.TYPE_TOUCH && !flingHappened)) {
        ViewCompat.animate(child).translationY(0).start();

        fabAnimationStarted = false;
    }
}

@Override
public boolean onNestedFling(@NonNull CoordinatorLayout coordinatorLayout, @NonNull FloatingActionButton child, @NonNull View target, float velocityX, float velocityY, boolean consumed) {

    // We got a fling. Flag it.
    flingHappened = true;
    return false;

}

@Override
public void onNestedPreScroll(@NonNull CoordinatorLayout coordinatorLayout, @NonNull FloatingActionButton child, @NonNull View target, int dx, int dy, @NonNull int[] consumed, int type) {

    if (!fabAnimationStarted) {
        Log.d(TAG, "onStartNestedScroll: animation is starting");
        fabAnimationStarted = true;
        flingHappened = false;
        CoordinatorLayout.LayoutParams lp = (CoordinatorLayout.LayoutParams) child.getLayoutParams();

        ViewCompat.animate(child).translationY(child.getHeight() + lp.bottomMargin).start();

    }
}
}

Answer 2

//lv = ListView

    lv.setOnScrollListener(new AbsListView.OnScrollListener() {
        @Override
        public void onScrollStateChanged(AbsListView view, int scrollState) {

        }

        @Override
        public void onScroll(AbsListView view, int firstVisibleItem, int visibleItemCount, int totalItemCount) {
            fab.setVisibility(view.getFirstVisiblePosition() == 0 ? View.VISIBLE : View.INVISIBLE);
        }
    });

Answer 3

This should work for you:

recyclerView.addOnScrollListener(new RecyclerView.OnScrollListener() {
    @Override
    public void onScrolled(RecyclerView recyclerView, int dx,int dy){
        super.onScrolled(recyclerView, dx, dy);

        if (dy >0) {
            // Scroll Down
            if (fab.isShown()) {
                fab.hide();
            }
        }
        else if (dy <0) {
            // Scroll Up
            if (!fab.isShown()) {
                fab.show();
            }
        }
     }
});

Answer 4

Short and Simple Solution:

mRecyclerView.addOnScrollListener(new RecyclerView.OnScrollListener() {
    @Override
    public void onScrolled(RecyclerView recyclerView, int dx, int dy) {
        super.onScrolled(recyclerView, dx, dy);
        if (dy > 0 && mFloatingActionButton.getVisibility() == View.VISIBLE) {
            mFloatingActionButton.hide();
        } else if (dy < 0 && mFloatingActionButton.getVisibility() !=View.VISIBLE) {
            mFloatingActionButton.show();
        }
    }
});

Answer 5

This is how I did. It works for me! If you don't know how to implement, You can see detail in this link https://guides.codepath.com/android/floating-action-buttons

public class ScrollAwareFABBehavior extends FloatingActionButton.Behavior {

    public ScrollAwareFABBehavior(Context context, AttributeSet attributeSet){
        super();
    }

    @Override
    public void onNestedScroll(CoordinatorLayout coordinatorLayout, FloatingActionButton child, View target, int dxConsumed, int dyConsumed, int dxUnconsumed, int dyUnconsumed) {
        super.onNestedScroll(coordinatorLayout, child, target, dxConsumed, dyConsumed, dxUnconsumed, dyUnconsumed);
        if (dyConsumed > 0 && child.getVisibility() == View.VISIBLE) {
            child.hide();
        } else if (dyConsumed < 0 && child.getVisibility() == View.GONE) {
            child.show();
        }
    }

    @Override
    public boolean onStartNestedScroll(CoordinatorLayout coordinatorLayout, FloatingActionButton child, View directTargetChild, View target, int nestedScrollAxes) {
        return nestedScrollAxes == ViewCompat.SCROLL_AXIS_VERTICAL;
    }
}