Android Jetpack Navigation, Bottomnavigationview with Youtube or Instagram Like Proper Back Navigation (Fragment Back Stack)

Android Jetpack Navigation, BottomNavigationView with Youtube or Instagram like proper back navigation (fragment back stack)?

With the version 2.4.0 of the navigation package, it is finally officially supported!

https://developer.android.com/jetpack/androidx/releases/navigation#version_240_2

Not only that: after uploading the navigation library to this version, this feature is the default behaviour. And as a side note, now this default behaviour includes that fragments are not recreated when navigating among them, that seemed to be something quite requested.

How to save fragment instance on bottomNavigationView using navigation component

Fragment state will be retained in Jetpack Navigation for only the views which have "id" set on them. Views which don't have any "id" will not retain their state. Also, you should use AppBarConfiguration with NavController. There are examples with AppBarConfiguration to look up.

And last and foremost, don't use "app:popUpTo" & "app:popUpToInclusive" attributes in navigation graph xml file for actions. That will pop all the fragments, till that "app:popUpTo" fragment in back stack once the action is triggered.

Android Jetpack Navigation proper back stack with BottomNavigationView

The major reason is you only use one NavHostFragment to hold the whole back stack of the app.

So the solution is each tab should hold its own back stack.

• In your main layout, wrap each tab fragment with a FrameLayout.
• Each tab fragment is a NavHostFragment and contains its own navigation graph in order to make each tab fragment having its own back stack.
• Add a BottomNavigationView.OnNavigationItemSelectedListener to BottomNavigtionView to handle the visibility of each FrameLayout.

---

If you don't want to keep all the fragments in memory, you can use app:popUpTo and app:popUpToInclusive="true" to pop out the ones you don't want to keep.

How can I show a fragment using a BottomNavigationView with valid back stack?

I was asking the wrong question originally. I can just use the navController to call the correct navigation component in order to show the right fragment with a back stack.

val bundle = bundleOf("someId" to "theId")
navController.navigate(R.id.action_navigation_list_to_details, bundle)

Android clear backstack after reselecting Bottom Navigation tab

BottomNavigationView has its own method for handling reselection via setOnItemReselectedListener() (or, when using an earlier version of the Material Design Library, the now deprecated setOnNavigationItemReselectedListener()).

bottomNavigationView.setupWithNavController does not set this listener (as there is no Material specification for exactly what reselecting a tab should do), so you need to set it yourself:

val bottomNavigationView = findViewById<BottomNavigationView>(R.id.bottom_nav)
bottomNavigationView.setupWithNavController(navController)

// Add your own reselected listener
bottomNavigationView.setOnItemReselectedListener { item ->
    // Pop everything up to the reselected item
    val reselectedDestinationId = item.itemId
    navController.popBackStack(reselectedDestinationId, inclusive = false)
}

---

Related Topics