Back button behaviour with BottomNavigationView implemented using navigation component

Question

I have created a nav_graph.xml for android navigation component and added four fragments for four different views. Now added BottomNavigationView and menu items , used the fragment ids from nav_graph and provided those ids to each menu items for bottom navigation. It works and shows the particular fragment for selected menu item from bottom nav view.

<menu xmlns:android="http://schemas.android.com/apk/res/android">
     <item android:id="@+id/nav_fragmentA"
          android:title="@string/menu_search"
          android:icon="@drawable/ic_search" />
     <item android:id="@+id/nav_fragmentB"
          android:title="@string/menu_settings"
          android:icon="@drawable/ic_add" />
     <item android:id="@+id/nav_fragmentC"
          android:title="@string/menu_navigation"
          android:icon="@drawable/ic_action_navigation_menu" />
     <item android:id="@+id/nav_fragmentD"
          android:title="@string/menu_navigation"
          android:icon="@drawable/ic_action_navigation_menu" />
 </menu>

Issue: When user presses any menu items multiple times and presses back button. It navigates through whole back stack rather going to first menu item and exiting the app.

For example

Four bottom menu items: A B C D
User navigation: A->C->B->D->B->C-A->D
Back button behaviour: D->A->C->B->D-B->C->A->Exit (Reverse of user navigation)

Want to achieve the behaviour as below:

User navigate through menu items: A->C->B->D->B->C-A->D (Any random navigation)
Back button: D->A->Exit (From any selected item to first item and then exit)

@VVB there are no explicit actions defined it works if the same fragment id from the nav_graph.xml provided to the bottom navigation menu items. — takharsh
– takharsh, Commented Jan 29, 2020 at 10:04
If it is the case then can you show code where replace Fragments is handled? — VVB
– VVB, Commented Jan 29, 2020 at 10:08
@VVB There is not explicit code where I am handling fragment switching. It is handled by navigation component. Refer here for reference implementation github.com/android/architecture-components-samples/blob/master/… also github.com/android/architecture-components-samples/tree/master/… — takharsh
– takharsh, Commented Feb 12, 2020 at 4:49

LionKing52 · Accepted Answer · 2021-09-23 10:02:17Z

2

I had this same issue.

The integration between the bottom navigation and the navigation component needs a separate nav graph for each fragment/tab and also a parent nav graph that includes all of these tabs.

The parent nav graph cannot have any other fragments included within it. It can only have the include tags for each of the tabs.

Example:

    <?xml version="1.0" encoding="utf-8"?>
<navigation xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    app:startDestination="@id/home"
    android:id="@+id/bottom_nav">

    <include app:graph="@navigation/frag1" />
    <include app:graph="@navigation/frag2" />
    <include app:graph="@navigation/frag3" />

</navigation>

The sample given by architecture components is also helpful.

answered Sep 23, 2021 at 10:02

LionKing52

213 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Back button behaviour with BottomNavigationView implemented using navigation component

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related