Android Jetpack Navigation Refactoring from BottomNavigationView with BackStack and Actions

nav_graph

/** Just to put out there the project was using KTX and Synthetics for the View Integration

First create a menu called nav.xml in the menu folder and fill it like this. **/

<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android">

    <item
            android:id="@+id/navigation_home"
            android:icon="@drawable/ic_seat"
            android:title="@string/title_connect"/>

    <item
            android:id="@+id/navigation_dashboard"
            android:icon="@drawable/ic_dashboard"
            android:title="@string/title_topics"/>

    <item
            android:id="@+id/navigation_notifications"
            android:icon="@drawable/ic_action_game"
            android:title="@string/title_games"/>

</menu>

/** This is how the old code was looking before and i will show you how the new one will look after the update and how many benefits 
your project will have after.
**/

/** 
  set the navigation to the first item and the listener for changes for the bottom nav. 
 **/
 
navigation.setOnNavigationItemSelectedListener(mOnNavigationItemSelectedListener)
navigation.selectedItemId = R.id.navigation_home

/** actuall listener **/

    private val mOnNavigationItemSelectedListener = BottomNavigationView.OnNavigationItemSelectedListener { item ->
            when (item.itemId) {
                R.id.navigation_home -> {
                    supportFragmentManager.beginTransaction().replace(R.id.root_layout, ConnectFragment()).commit()
                    textView.setText(R.string.title_connect)
                    switch1.visibility = View.VISIBLE
                    return@OnNavigationItemSelectedListener true
                }
                R.id.navigation_dashboard -> {
                    supportFragmentManager.beginTransaction().replace(R.id.root_layout, TopicsFragment()).commit()
                    textView.setText(R.string.title_topics)
                    switch1.visibility = View.GONE
                    return@OnNavigationItemSelectedListener true
                }
                R.id.navigation_notifications -> {
                    supportFragmentManager.beginTransaction().replace(R.id.root_layout, GamesFragment()).commit()
                    textView.setText(R.string.title_games)
                    switch1.visibility = View.GONE
                    return@OnNavigationItemSelectedListener true
                }
            }
            false
        }

/** here is the new implementation with the jetPack which can be used in MVVM and MVP so its just an adition that will help 
everyone in the team go forward. **/

val navHostFragment = supportFragmentManager.findFragmentById(R.id.navigation_host_fragment) as NavHostFragment?
NavigationUI.setupWithNavController(navigation, navHostFragment!!.navController)

/** those two lines is pretty much everything on the base part of the host **/

            <fragment
                android:id="@+id/navigation_host_fragment"
                android:name="androidx.navigation.fragment.NavHostFragment"
                android:layout_width="407dp"
                android:layout_height="609dp"
                app:layout_constraintEnd_toEndOf="parent"
                app:layout_constraintTop_toTopOf="parent" app:layout_constraintStart_toStartOf="parent"
                android:layout_marginLeft="2dp" android:layout_marginStart="2dp" android:layout_marginEnd="2dp"
                android:layout_marginRight="2dp" app:layout_constraintHorizontal_bias="0.0"
                app:defaultNavHost="true"
                app:navGraph="@navigation/nav_graph" />
                
/** thats you XML part for the fragment host and after you can manipulate all from the graph which is on the bottom as you see **/

<?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" xmlns:tools="http://schemas.android.com/tools"
            android:id="@+id/nav_graph" app:startDestination="@id/navigation_home">

    <fragment android:id="@+id/navigation_home"
              android:name="com.nikiizvorski.fly.ui.ConnectFragment"
              android:label="@string/title_connect"
              tools:layout="@layout/fragment_connect"/>

    <fragment android:id="@+id/navigation_dashboard"
              android:name="com.nikiizvorski.fly.ui.TopicsFragment"
              android:label="@string/title_topics"
              tools:layout="@layout/fragment_topics"/>

    <fragment android:id="@+id/navigation_notifications"
              android:name="com.nikiizvorski.fly.ui.GamesFragment"
              android:label="@string/title_games"
              tools:layout="@layout/fragment_games"/>
</navigation>

/** the actuall nav graph file you have the start from and everything directly here and you can start manipulating your whole project
from the Graph Editor. How to create the file for the NavGraph.xml simple right clicck on res chose Android Resource call it nav_graph 
and after you will have the file which automatically will be in the proper section in res. Thats it hope it help you understand the process.
**/