Search code examples
androidmaterial-designandroid-animationbottomnavigationview

BottomNavigationView does not show up when auto hide/show is enabled


I've a single Activity with a BottomNavigationView inside of it's layout:

<androidx.coordinatorlayout.widget.CoordinatorLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        >

        <androidx.fragment.app.FragmentContainerView
            android:id="@+id/nav_host"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            />


        <com.google.android.material.bottomnavigation.BottomNavigationView
            android:id="@+id/bottom_navigation"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_gravity="bottom"
            app:layout_behavior="@string/hide_bottom_view_on_scroll_behavior"
            app:menu="@menu/menu_home_bottom_navigation"
            />
    </androidx.coordinatorlayout.widget.CoordinatorLayout>

My bottom_avigation changes nav_host FragmentContainerView with fragments. All of this fragments have NestedScrollView or RecyclerView and because of app:layout_behavior="@string/hide_bottom_view_on_scroll_behavior", my bottom_navigation automatically hides/shows on scrollDown/scrollUp.

I saw this question: Hide/Show bottomNavigationView on Scroll . I'm currently using the answer given by Abhishek Singh but the problem is not this.

This is my problem: Imagine FragA and FragB both have RecyclerViews but FragA has less items causing that all items fit to the screen and not scrollable. Now when I switch from FragA to FragB and then scrollDown, bottom_navigation hides with animation and if I press back button I cannot see bottom_navigation anymore and because FragA is not scrollable I cannot make it visible by scrolling.

I've also tried bottom_navigation.visibility = View.Visible in FragA onResume event, but still does not work. I think that it somehow translates bottom_navigation to the bottom and because of that this code does not help.

So how can I fix this issue?


Solution

  • I found the answer. instead of changing the visibility property of the bottom_navigation, I wrote two extension functions on BottomNavigationView for hiding/showing it:

    private fun BottomNavigationView.showUp() {
        animate().setDuration(200L).translationY(0f).withStartAction { visibility = View.VISIBLE }.start()
    }
    
    private fun BottomNavigationView.hideDown() {
        animate().setDuration(200L).translationY(height.toFloat()).withEndAction { visibility = View.GONE }.start()
    }
    

    Now in onResume of FragA I have this:

    override onResume() {
        super.onResume()
        bottom_navigation.showUp()
    }