androidkotlinnavigation-drawerbottomnavigationviewup-button

Bottom Navigation with Drawer Layout in the same app - Up icon issue


I am a beginner developer for android and I find quite difficult to build the following app.

I'd like to create an app that can use both Bottom Navigation View and Drawer Layout. I succeeded on doing it because both these items are working properly (I am using NavigatioUI utility). My problem is about the Up button. When I change fragment after clicking on an item on one of the two navigation views, the up button transforms to back arrow, so if i click it I return to the default fragment. I want to be able to open the Drawer menu from every fragment but I can't! Can anyone please help me? thanks!

Here is MainActivity.kt

class MainActivity : AppCompatActivity() {

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)
        //setto la toolbar come Action Bar
        setSupportActionBar(toolbar2)


        //inizializzo gli elementi di navigation
        setupNavigation()
    }

    /*
    settaggio degli elementi di Navigation.
    Il NavigationUI recupera l'ID selezionato col bottone e lo collega al fragment dentro il mobile_navigation
    */
    private fun setupNavigation() {

        //per usare la libreria Navigation per viaggiare tra i vari fragment serve un Navigation Controller
        val navController = Navigation.findNavController(this, R.id.nav_host_fragment2)

        //settaggio Toolbar per avere il bottone a sinistra (drawer layout)
        NavigationUI.setupActionBarWithNavController(this, navController, drawer_layout2)

        //settaggio del Bottom Navigation
        bottom_nav2?.let {
            NavigationUI.setupWithNavController(it, navController)
        }

        //settaggio del Drawer Layout
        nav_view2?.let {
            NavigationUI.setupWithNavController(it, navController)
        }

    }

    //popola la Toolbar con i suoi item menu
    override fun onCreateOptionsMenu(menu: Menu?): Boolean {
        menuInflater.inflate(R.menu.menu_toolbar, menu)
        return true
    }

    //funzione per gestire il click sugli elementi della toolbar presi dal menu
    override fun onOptionsItemSelected(item: MenuItem?): Boolean {
        val navController = Navigation.findNavController(this, R.id.nav_host_fragment2)
        val navigated = NavigationUI.onNavDestinationSelected(item!!, navController)
        return navigated || super.onOptionsItemSelected(item)
    }

    //questa funzione consente di attivare il click sull'icona in alto a sinistra qualunque sia
    override fun onSupportNavigateUp(): Boolean {
        return NavigationUI.navigateUp(Navigation.findNavController(this, R.id.nav_host_fragment2), drawer_layout2)
    }
}

Here is activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<androidx.drawerlayout.widget.DrawerLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/drawer_layout2">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical">

        <androidx.appcompat.widget.Toolbar
            android:id="@+id/toolbar2"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:background="?colorPrimary" />

        <fragment
            android:id="@+id/nav_host_fragment2"
            android:layout_width="match_parent"
            android:layout_height="0dp"
            android:layout_weight="1"
            android:name="androidx.navigation.fragment.NavHostFragment"
            app:navGraph="@navigation/mobile_navigation"
            app:defaultNavHost="true" />

        <com.google.android.material.bottomnavigation.BottomNavigationView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:id="@+id/bottom_nav2"
            app:menu="@menu/menu_navigation"/>

    </LinearLayout>

    <com.google.android.material.navigation.NavigationView
        android:id="@+id/nav_view2"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:layout_gravity="start"
        app:menu="@menu/menu_drawer" />

</androidx.drawerlayout.widget.DrawerLayout>

Solution

  • I've finally found the answer. Referring to the code of my question, I needed to declare the following variable and setup the action bar with it (you may want to declare first lateinit var for navController and for appBarConfiguration before onCreate function in order to use the following code)

    //id dei fragment dove voglio vedere l'icona del menu e non la back arrow
    val appBarConfiguration : AppBarConfiguration = AppBarConfiguration(setOf(
                R.id.destination_home, R.id.destination_camera, R.id.destination_photos, 
                R.id.destination_altro), drawer_layout2)
    
    setupActionBarWithNavController(navController, appBarConfiguration)
    

    Then, I needed to modify onOptionsItemSelected and onSupportNavigateUp functions as the following

        override fun onOptionsItemSelected(item: MenuItem?): Boolean {
            return item!!.onNavDestinationSelected(navController) || 
                    super.onOptionsItemSelected(item)
        }
    
        override fun onSupportNavigateUp(): Boolean {
            return navController.navigateUp(appBarConfiguration)
        }