How to bind FAB to Bottom Navigation Bar from outer layout?

Question

How to bind FAB to Bottom Navigation Bar from outer layout? I want to to bind FAB to Bottom Navigation Bar in such way that when user is scrolling up and Bottom Navigation Bar is hiding (by scrolling down) I want my FAB to scroll down together with Bottom Navigation Bar. And I have one layout (parent layout) with BottomNavigationView (activity_main.xml):

<?xml version="1.0" encoding="utf-8"?>
<androidx.coordinatorlayout.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">

    <!-- Content Container -->
    <FrameLayout
        android:id="@+id/main_container"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />

    <com.google.android.material.bottomnavigation.BottomNavigationView
        android:id="@+id/bottom_navigation_bar"
        android:layout_width="match_parent"
        android:layout_height="@dimen/bottom_navigation_bar_height"
        android:layout_gravity="bottom|start|end"
        android:background="@color/colorPrimary"
        app:itemBackground="@color/colorPrimary"
        app:itemIconTint="@drawable/nav_item_color_state"
        app:itemTextColor="@color/white"
        app:layout_behavior="@string/hide_bottom_view_on_scroll_behavior"
        app:layout_insetEdge="bottom"
        app:elevation="@dimen/bottom_navigation_bar_elevation"
        app:menu="@menu/navigation_items" />

</androidx.coordinatorlayout.widget.CoordinatorLayout>

Abd I have the following fragment_day.xml with FAB:

<?xml version="1.0" encoding="utf-8"?>
<androidx.coordinatorlayout.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">

    <LinearLayout
        android:id="@+id/ll_header"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="@drawable/border_background"
        android:orientation="vertical"
        android:padding="@dimen/header_padding">

        ...  

    <com.google.android.material.floatingactionbutton.FloatingActionButton
        android:id="@+id/fab_add"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="end|bottom"
        android:layout_marginBottom="@dimen/fab_bottom_margin"
        android:layout_marginEnd="@dimen/md_keylines"
        android:layout_marginRight="@dimen/md_keylines"
        android:src="@drawable/ic_add_circle"
        app:layout_behavior="@string/fabs_on_scroll_behavior"
        app:fabCustomSize="@dimen/fab_large_diameter" />

</androidx.coordinatorlayout.widget.CoordinatorLayout>

And when it looks like this, while user is scrolling, only BottomNavigationView is moving, but FAB remains stationary.

I've tried also to add the following line to <FloatingActionButton> tag:

app:layout_behavior="@string/fabs_on_scroll_behavior"

and the following line to strings.xml: com.example.view.utils.FABScrollingViewBehavior

where this com.example.view.utils.FABScrollingViewBehavior class is actually FloatingActionButton.Behavior + HideBottomViewOnScrollBehavior:

public class FABScrollingViewBehavior extends FloatingActionButton.Behavior {
    protected static final int ENTER_ANIMATION_DURATION = 225;
    protected static final int EXIT_ANIMATION_DURATION = 175;
    private static final int STATE_SCROLLED_DOWN = 1;
    private static final int STATE_SCROLLED_UP = 2;
    private int height = 0;
    private int currentState = 2;
    private ViewPropertyAnimator currentAnimator;

    public FABScrollingViewBehavior() {
    }

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

    public boolean onLayoutChild(CoordinatorLayout parent,
                                 FloatingActionButton child,
                                 int layoutDirection) {
        this.height = child.getMeasuredHeight();
        return super.onLayoutChild(parent, child, layoutDirection);
    }

    public boolean onStartNestedScroll(CoordinatorLayout coordinatorLayout,
                                       FloatingActionButton child,
                                       View directTargetChild,
                                       View target,
                                       int nestedScrollAxes) {
        return nestedScrollAxes == 2;
    }

    public void onNestedScroll(CoordinatorLayout coordinatorLayout,
                               FloatingActionButton child, View target,
                               int dxConsumed, int dyConsumed,
                               int dxUnconsumed, int dyUnconsumed) {
        if(this.currentState != 1 && dyConsumed > 0) {
            this.slideDown(child);
        } else if(this.currentState != 2 && dyConsumed < 0) {
            this.slideUp(child);
        }

    }

    protected void slideUp(FloatingActionButton child) {
        if(this.currentAnimator != null) {
            this.currentAnimator.cancel();
            child.clearAnimation();
        }

        this.currentState = 2;
        this.animateChildTo(child, 0, 225L, AnimationUtils.LINEAR_OUT_SLOW_IN_INTERPOLATOR);
    }

    protected void slideDown(FloatingActionButton child) {
        if(this.currentAnimator != null) {
            this.currentAnimator.cancel();
            child.clearAnimation();
        }

        this.currentState = 1;
        this.animateChildTo(child, this.height, 175L, AnimationUtils.FAST_OUT_LINEAR_IN_INTERPOLATOR);
    }

    private void animateChildTo(FloatingActionButton child, int targetY, long duration, TimeInterpolator interpolator) {
        this.currentAnimator = child.animate().translationY((float)targetY).setInterpolator(interpolator).setDuration(duration).setListener(new AnimatorListenerAdapter() {
            public void onAnimationEnd(Animator animation) {
                FABScrollingViewBehavior.this.currentAnimator = null;
            }
        });
    }
}

But in this case only FAB is moving down by scrolling, and BottomNavigationView remains stationary. How to bind this FAB to BottomNavigationBar so that they will move together?

Answer 1

try this this will work for me

int oldPostion = 0

myScrollView.getViewTreeObserver().addOnScrollChangedListener(new ViewTreeObserver.OnScrollChangedListener() {
        @Override
        public void onScrollChanged() {
            if (myScrollView.getScrollY() > oldPostion) {
                myfab.hide();
            } else if (myScrollView.getScrollY() < oldPostion || myScrollView.getScrollY() <= 0) {
                myfab.show();
            }
            oldPostion = myScrollView.getScrollY();
        }
    });