Drawer Layout does not work without Navigation Controller

Question

Why we cannot setup Drawer Layout in Android without Navigation / Nav-Controller ?
Whenever we want to set up a drawer we need a Nav Controller. Like below:

private lateinit var drawerLayout: DrawerLayout

private lateinit var appBarConfiguration : AppBarConfiguration

val navController = this.findNavController(R.id.myNavHostFragment) NavigationUI.setupActionBarWithNavController(this, navController, drawerLayout)
appBarConfiguration = AppBarConfiguration(navController.graph, drawerLayout)

However, what if an application does not have Nav_Graph / NavController.
What if the application is very simple.
In that case, how do we should setup a Drawer in our App.

Please guide.

Note: Before posting this question I did a lot of homweork and analysis, but in all documentation I saw that Drawer Layout needs NavGraph/NavController/Navigation.

Answer 1

The approach now is to use navigation architecture components in order to have a single activity in your app and multiple fragments; each screen can be represented by a fragment...This is the default for the Android studio Navigation Drawer Activity template. The NavController is used to control the navigation between fragments in this approach

But if you wish you can use a DrawerLayout without using NavController.. but in recent Android Studio versions, there is no templates for that and you have to create it manually, and handle navigation, back stack, almost everything manually.

Example

This is a lightweight example that can make you kick off a bigger one.

When you select an item from the drawer, normally you can make fragment transactions in the NavigationItemSelectedListener but in below example I just show up a Toast

Activity:

class MainActivity : AppCompatActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)

        // Setting custom ActionBar
        val toolbar: Toolbar = findViewById(R.id.toolbar)
        setSupportActionBar(toolbar)

        // Showing the burger button on the ActionBar
        supportActionBar?.setDisplayHomeAsUpEnabled(true); 
        val drawerLayout: DrawerLayout = findViewById(R.id.drawer_layout)
        val toggle =
            ActionBarDrawerToggle(this, drawerLayout, toolbar, R.string.open, R.string.close)
        drawerLayout.addDrawerListener(toggle)
        toggle.syncState()

        // Handle navigation click events
        val navigationView: NavigationView = findViewById(R.id.nav_view)
        navigationView.setNavigationItemSelectedListener { item ->

            when (item.itemId) {
                R.id.nav_account -> {
                    Toast.makeText(this, "Account", Toast.LENGTH_SHORT).show()
                }
                R.id.nav_settings -> {
                    Toast.makeText(this, "Setting", Toast.LENGTH_SHORT).show()
                }
                R.id.nav_logout -> {
                    Toast.makeText(this, "Logout", Toast.LENGTH_SHORT).show()
                }
            }

            // Closing navigation drawer
            drawerLayout.closeDrawer(GravityCompat.START)

            true
        }
    }
}

activity_main.xml

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

    <androidx.constraintlayout.widget.ConstraintLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent">

        <androidx.appcompat.widget.Toolbar
            android:id="@+id/toolbar"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:background="@color/colorPrimary"
            android:theme="@style/ThemeOverlay.AppCompat.Dark"
            app:layout_constraintTop_toTopOf="parent" />

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Hello World!"
            android:textSize="28sp"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintLeft_toLeftOf="parent"
            app:layout_constraintRight_toRightOf="parent"
            app:layout_constraintTop_toTopOf="parent" />

    </androidx.constraintlayout.widget.ConstraintLayout>

    <com.google.android.material.navigation.NavigationView
        android:id="@+id/nav_view"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:layout_gravity="start"
        app:headerLayout="@layout/navigation_header_layout"
        app:menu="@menu/navigation_menu" />

</androidx.drawerlayout.widget.DrawerLayout>

navigation_header_layout.xml

<?xml version="1.0" encoding="utf-8"?>

<TextView xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="120dp"
    android:gravity="center"
    android:layout_centerInParent="true"
    android:background="@color/colorPrimary"
    android:text="Navigation drawer"
    android:textColor="#ffffff"
    android:textSize="24sp" />

navigation_menu.xml

<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android">
    <item
        android:id="@+id/nav_account"
        android:title="My Account" />
    <item
        android:id="@+id/nav_settings"
        android:title="Settings" />

    <item
        android:id="@+id/nav_logout"
        android:title="Log Out" />
</menu>

build.gradle (Module)

 implementation 'com.google.android.material:material:1.2.1'

strings.xml

<resources>
    <string name="app_name">Navigation Drawer Example</string>
    <string name="open">Open</string>
    <string name="close">Close</string>
</resources>

styles.xml (NoActionBar theme)

<resources>
    <style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
        <item name="colorPrimary">@color/colorPrimary</item>
        <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
        <item name="colorAccent">@color/colorAccent</item>
    </style>
</resources>