Jerry W.
Reputation: 25
BottomNavigationView only hiding on scroll for one fragment
I have a BottomNavigationView in my activity_main.xml, along with a FrameLayout to swap between 3 fragments.
I'm using CoordinatorLayout.
I'm trying to make it so that when the fragment in the FrameLayout is scrolled, the navigation bar hides itself.
I've added the behaviour attribute to the the nav bar in my layout, and it's working for the first fragment, which is a RelativeLayout with a RecyclerView in it.
However, when I switch the a different fragment, which is a ScrollView, the nav bar no longer hides itself.
activity_main.xml
<?xml version="1.0" encoding="utf-8"?>
<androidx.coordinatorlayout.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="@+id/mainLayout"
android:background="@color/colorMain"
xmlns:app="http://schemas.android.com/apk/res-auto"
tools:context=".MainActivity">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<View
android:layout_alignParentTop="true"
android:id="@+id/mainPaddingTop"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"/>
<FrameLayout
android:layout_below="@id/mainPaddingTop"
android:layout_above="@id/mainPaddingBottom"
android:id="@+id/frag_container"
android:clipToPadding="true"
android:layout_alignParentStart="true"
android:layout_alignParentEnd="true"
android:layout_width="match_parent"
android:layout_height="match_parent" />
<View
android:visibility="visible"
android:layout_alignParentBottom="true"
android:id="@+id/mainPaddingBottom"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"/>
</RelativeLayout>
<com.google.android.material.floatingactionbutton.FloatingActionButton
app:layout_behavior="@string/hide_bottom_view_on_scroll_behavior"
android:id="@+id/fab"
android:layout_marginBottom="74dp"
android:layout_gravity="end|bottom"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:rippleColor="@color/colorPrimary"
android:clickable="true"
android:layout_marginEnd="18dp"
android:tint="@color/colorMain"
app:srcCompat="@drawable/ic_plus" />
<androidx.appcompat.widget.Toolbar
android:minHeight="?attr/actionBarSize"
android:layout_gravity="top"
android:id="@+id/toolbar_top"
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:elevation="1dp"
android:background="@color/colorMain">
<ImageButton
android:id="@+id/accountButton"
android:layout_gravity="end"
android:tint="@color/colorSecondary"
android:background="?attr/selectableItemBackgroundBorderless"
app:srcCompat="@drawable/ic_account"
android:layout_width="36dp"
android:layout_height="36dp"
android:layout_marginStart="16dp"
android:layout_marginEnd="16dp"
android:contentDescription="@string/account" />
<ImageButton
android:visibility="gone"
android:id="@+id/searchButton"
android:layout_gravity="start"
android:tint="@color/colorSecondary"
android:background="?attr/selectableItemBackgroundBorderless"
app:srcCompat="@drawable/ic_magnify"
android:layout_width="36dp"
android:layout_height="36dp"
android:layout_marginStart="16dp"
android:layout_marginEnd="16dp"
android:contentDescription="@string/account" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/app_title"
android:textColor="@color/colorSecondary"
android:fontFamily="@font/productsansmedium"
android:textSize="20sp"
android:layout_gravity="center"
android:id="@+id/toolbar_title" />
</androidx.appcompat.widget.Toolbar>
<com.google.android.material.bottomnavigation.BottomNavigationView
android:layout_gravity="bottom"
app:layout_behavior="@string/hide_bottom_view_on_scroll_behavior"
android:theme="@style/Widget.BottomNavigationView"
android:background="@color/bottomNavColor"
app:itemIconTint="@drawable/navbar_color_selector"
app:itemTextColor="@drawable/navbar_color_selector"
app:elevation="26dp"
android:id="@+id/bottom_navigation"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:menu="@menu/bottom_nav_items" />
</androidx.coordinatorlayout.widget.CoordinatorLayout>
fragment_start.xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".StartFragment">
<androidx.recyclerview.widget.RecyclerView
android:id="@+id/recycler_view"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_centerInParent="true"
android:scrollbars="none" />
</RelativeLayout>
fragment_centre.xml
<?xml version="1.0" encoding="utf-8"?>
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:focusable="true"
android:scrollbars="none"
android:descendantFocusability="blocksDescendants"
xmlns:app="http://schemas.android.com/apk/res-auto"
tools:context=".CentreFragment">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<TextView
android:layout_marginStart="16dp"
android:layout_marginTop="12dp"
android:textSize="12sp"
android:fontFamily="@font/productsansmedium"
android:textColor="@color/colorSecondary"
android:text="@string/section_1"
android:id="@+id/section1Text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
<TextView
android:layout_marginStart="16dp"
android:layout_marginTop="12dp"
android:layout_marginBottom="12dp"
android:textSize="12sp"
android:layout_below="@id/horizontalScroll"
android:fontFamily="@font/productsansmedium"
android:textColor="@color/colorSecondary"
android:text="@string/section_2"
android:id="@+id/section2Text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
<LinearLayout
android:orientation="vertical"
android:layout_below="@id/section2Text"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<LinearLayout
android:clickable="true"
android:focusable="true"
android:foreground="?attr/selectableItemBackground"
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<com.google.android.material.card.MaterialCardView
android:layout_margin="16dp"
app:strokeWidth="1.5dp"
app:strokeColor="@color/colorQuad"
app:cardElevation="0dp"
app:cardBackgroundColor="@color/colorMain"
app:cardCornerRadius="28dp"
android:layout_width="38dp"
android:layout_height="38dp">
<ImageView
android:tint="@color/colorSecondary"
android:layout_gravity="center"
android:src="@drawable/ic_folder_pound"
android:layout_width="22dp"
android:layout_height="22dp"/>
</com.google.android.material.card.MaterialCardView>
<FrameLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:layout_gravity="center_vertical"
android:textSize="16sp"
android:textColor="@color/colorFont"
android:fontFamily="@font/productsansmedium"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/category_1" />
<ImageView
android:layout_gravity="bottom|start"
android:tint="@color/colorQuad"
android:src="@drawable/line_seperator"
android:layout_width="match_parent"
android:layout_height="1dp"/>
</FrameLayout>
</LinearLayout>
<LinearLayout
android:clickable="true"
android:focusable="true"
android:foreground="?attr/selectableItemBackground"
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<com.google.android.material.card.MaterialCardView
android:layout_margin="16dp"
app:strokeWidth="1.5dp"
app:strokeColor="@color/colorQuad"
app:cardElevation="0dp"
app:cardBackgroundColor="@color/colorMain"
app:cardCornerRadius="28dp"
android:layout_width="38dp"
android:layout_height="38dp">
<ImageView
android:tint="@color/colorSecondary"
android:layout_gravity="center"
android:src="@drawable/ic_folder_pound"
android:layout_width="22dp"
android:layout_height="22dp"/>
</com.google.android.material.card.MaterialCardView>
<FrameLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:layout_gravity="center_vertical"
android:textSize="16sp"
android:textColor="@color/colorFont"
android:fontFamily="@font/productsansmedium"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/category_2" />
<ImageView
android:layout_gravity="bottom|start"
android:tint="@color/colorQuad"
android:src="@drawable/line_seperator"
android:layout_width="match_parent"
android:layout_height="1dp"/>
</FrameLayout>
</LinearLayout>
<LinearLayout
android:clickable="true"
android:focusable="true"
android:foreground="?attr/selectableItemBackground"
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<com.google.android.material.card.MaterialCardView
android:layout_margin="16dp"
app:strokeWidth="1.5dp"
app:strokeColor="@color/colorQuad"
app:cardElevation="0dp"
app:cardBackgroundColor="@color/colorMain"
app:cardCornerRadius="28dp"
android:layout_width="38dp"
android:layout_height="38dp">
<ImageView
android:tint="@color/colorSecondary"
android:layout_gravity="center"
android:src="@drawable/ic_folder_pound"
android:layout_width="22dp"
android:layout_height="22dp"/>
</com.google.android.material.card.MaterialCardView>
<FrameLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:layout_gravity="center_vertical"
android:textSize="16sp"
android:textColor="@color/colorFont"
android:fontFamily="@font/productsansmedium"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/category_3" />
<ImageView
android:layout_gravity="bottom|start"
android:tint="@color/colorQuad"
android:src="@drawable/line_seperator"
android:layout_width="match_parent"
android:layout_height="1dp"/>
</FrameLayout>
</LinearLayout>
<LinearLayout
android:clickable="true"
android:focusable="true"
android:foreground="?attr/selectableItemBackground"
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<com.google.android.material.card.MaterialCardView
android:layout_margin="16dp"
app:strokeWidth="1.5dp"
app:strokeColor="@color/colorQuad"
app:cardElevation="0dp"
app:cardBackgroundColor="@color/colorMain"
app:cardCornerRadius="28dp"
android:layout_width="38dp"
android:layout_height="38dp">
<ImageView
android:tint="@color/colorSecondary"
android:layout_gravity="center"
android:src="@drawable/ic_folder_pound"
android:layout_width="22dp"
android:layout_height="22dp"/>
</com.google.android.material.card.MaterialCardView>
<FrameLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:layout_gravity="center_vertical"
android:textSize="16sp"
android:textColor="@color/colorFont"
android:fontFamily="@font/productsansmedium"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/category_4" />
<ImageView
android:layout_gravity="bottom|start"
android:tint="@color/colorQuad"
android:src="@drawable/line_seperator"
android:layout_width="match_parent"
android:layout_height="1dp"/>
</FrameLayout>
</LinearLayout>
<LinearLayout
android:clickable="true"
android:focusable="true"
android:foreground="?attr/selectableItemBackground"
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<com.google.android.material.card.MaterialCardView
android:layout_margin="16dp"
app:strokeWidth="1.5dp"
app:strokeColor="@color/colorQuad"
app:cardElevation="0dp"
app:cardBackgroundColor="@color/colorMain"
app:cardCornerRadius="28dp"
android:layout_width="38dp"
android:layout_height="38dp">
<ImageView
android:tint="@color/colorSecondary"
android:layout_gravity="center"
android:src="@drawable/ic_folder_pound"
android:layout_width="22dp"
android:layout_height="22dp"/>
</com.google.android.material.card.MaterialCardView>
<FrameLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:layout_gravity="center_vertical"
android:textSize="16sp"
android:textColor="@color/colorFont"
android:fontFamily="@font/productsansmedium"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/category_5" />
<ImageView
android:layout_gravity="bottom|start"
android:tint="@color/colorQuad"
android:src="@drawable/line_seperator"
android:layout_width="match_parent"
android:layout_height="1dp"/>
</FrameLayout>
</LinearLayout>
<LinearLayout
android:clickable="true"
android:focusable="true"
android:foreground="?attr/selectableItemBackground"
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<com.google.android.material.card.MaterialCardView
android:layout_margin="16dp"
app:strokeWidth="1.5dp"
app:strokeColor="@color/colorQuad"
app:cardElevation="0dp"
app:cardBackgroundColor="@color/colorMain"
app:cardCornerRadius="28dp"
android:layout_width="38dp"
android:layout_height="38dp">
<ImageView
android:tint="@color/colorSecondary"
android:layout_gravity="center"
android:src="@drawable/ic_folder_pound"
android:layout_width="22dp"
android:layout_height="22dp"/>
</com.google.android.material.card.MaterialCardView>
<FrameLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:layout_gravity="center_vertical"
android:textSize="16sp"
android:textColor="@color/colorFont"
android:fontFamily="@font/productsansmedium"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/category_6" />
<ImageView
android:layout_gravity="bottom|start"
android:tint="@color/colorQuad"
android:src="@drawable/line_seperator"
android:layout_width="match_parent"
android:layout_height="1dp"/>
</FrameLayout>
</LinearLayout>
<LinearLayout
android:clickable="true"
android:focusable="true"
android:foreground="?attr/selectableItemBackground"
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<com.google.android.material.card.MaterialCardView
android:layout_margin="16dp"
app:strokeWidth="1.5dp"
app:strokeColor="@color/colorQuad"
app:cardElevation="0dp"
app:cardBackgroundColor="@color/colorMain"
app:cardCornerRadius="28dp"
android:layout_width="38dp"
android:layout_height="38dp">
<ImageView
android:tint="@color/colorSecondary"
android:layout_gravity="center"
android:src="@drawable/ic_folder_pound"
android:layout_width="22dp"
android:layout_height="22dp"/>
</com.google.android.material.card.MaterialCardView>
<FrameLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:layout_gravity="center_vertical"
android:textSize="16sp"
android:textColor="@color/colorFont"
android:fontFamily="@font/productsansmedium"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/category_7" />
<ImageView
android:layout_gravity="bottom|start"
android:tint="@color/colorQuad"
android:src="@drawable/line_seperator"
android:layout_width="match_parent"
android:layout_height="1dp"/>
</FrameLayout>
</LinearLayout>
<LinearLayout
android:clickable="true"
android:focusable="true"
android:foreground="?attr/selectableItemBackground"
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<com.google.android.material.card.MaterialCardView
android:layout_margin="16dp"
app:strokeWidth="1.5dp"
app:strokeColor="@color/colorQuad"
app:cardElevation="0dp"
app:cardBackgroundColor="@color/colorMain"
app:cardCornerRadius="28dp"
android:layout_width="38dp"
android:layout_height="38dp">
<ImageView
android:tint="@color/colorSecondary"
android:layout_gravity="center"
android:src="@drawable/ic_folder_pound"
android:layout_width="22dp"
android:layout_height="22dp"/>
</com.google.android.material.card.MaterialCardView>
<FrameLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:layout_gravity="center_vertical"
android:textSize="16sp"
android:textColor="@color/colorFont"
android:fontFamily="@font/productsansmedium"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/category_8" />
<ImageView
android:layout_gravity="bottom|start"
android:tint="@color/colorQuad"
android:src="@drawable/line_seperator"
android:layout_width="match_parent"
android:layout_height="1dp"/>
</FrameLayout>
</LinearLayout>
</LinearLayout>
</RelativeLayout>
</ScrollView>
The result is that when I scroll in the second fragment, the bar doesn't hide itself and covers up the bottom of the fragment.
Upvotes: 2
Views: 208
Answers (1)
Mukund Desai
Reputation: 106
Use NestedScrollView instead of ScrollView.
<android.support.v4.widget.NestedScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="@string/hide_bottom_view_on_scroll_behavior">
<!-- Your scrolling content -->
</android.support.v4.widget.NestedScrollView>
Hope it solves.
Upvotes: 2
Related Questions
- Fragment content is hidden behind BottomNavigationView when scrolling
- Hide/Show bottomNavigationView on Scroll
- Hide Bottom Navigation View in fragment
- Fragment doesn't overlay whole layout
- BottomNavView remains hidden onNavigation between Fragments
- Fragment loaded in bottom navigation view becoming null on orientation change
- BottomNavigationView does not hide on scrolling inside fragment, if fragment contains AppBarLayout
- BottomNavigationView is not hiding when scroll
- Hide the BottomNavigationView when Scrolling Fragment
- Android - Fragment called by Bottom navigation tabs is reloading every time