Top Toolbar Menu + BottomAppBar Menu + BottomNavigationDrawerFragment Just like Material Design

Question

What I want to achieve is like this image (Without top NavigationView though) but with Toolbar Menu + BottomAppBar Menu + BottomNavigationDrawerFragment exactly like material design:

I could manage the BottomAppBar menu by replace() (My Answer):

val bottomBar = findViewById<BottomAppBar>(R.id.bottomAppBar)
bottomBar.replaceMenu(R.menu.menu_main)

Which allow me to inflate menu for the BottomAppBar and used below codes plus onCreateOptionsMenu() for the Toolbar Menu and setSupportActionBar():

val toolbar = findViewById<Toolbar>(R.id.myToolbar)
setSupportActionBar(toolbar)

The point is, in this tutorial (for example), he used setSupportActionBar(bottom_app_bar) for setting SupportActionBar on the BottomAppBar. So, if we use setSupportActionBar(bottom_app_bar) for the BottomAppBar, it will show the BottomNavigationDrawerFragment + Menus are handlable on the Bottom Side.

But, what about Toolbar and menus? Toolbar + menu items won't be handlable nor showing up if we use setSupportActionBar(bottomAppbar).

The things that I have tested are:

• Might sound ridiculous but used two setSupportActionBar() for both Toolbar and BottomAppBar
• Even tried to inflate two menus by onCreateOptionsMenu() method but none worked.

The question is, How can we have Top Toolbar Menu + BottomAppBar Menu + BottomNavigationDrawerFragment all together?

Any thoughts?

Answer 1

Hopefully, I have found the answer. So if we want to create such layouts (Without Top NavigationDrawer - view) Here are the steps:

Declare the Toolbar as usual:

val toolbar = findViewById<Toolbar>(R.id.myToolbar)
setSupportActionBar(toolbar)

Override onCreateOptionsMenu with the Top Toolbar menu:

override fun onCreateOptionsMenu(menu: Menu?): Boolean {
    menuInflater.inflate(R.menu.top_menu, menu)
    return super.onCreateOptionsMenu(menu)
}

Use the following for handling BottomBar menus and replacing a new Menu in Bottom of the app & showing BottomSheetFragment when NavigationIcon selected:

val bottomBar = findViewById<BottomAppBar>(R.id.bottomAppBar)
bottomBar.replaceMenu(R.menu.bottom_menu)
bottomBar.setNavigationOnClickListener {
        val bottomNavDrawerFragment = BottomNavigationDrawerFragment()
        bottomNavDrawerFragment.show(supportFragmentManager, bottomNavDrawerFragment.tag)
    }
bottomBar.setOnMenuItemClickListener { menuItem ->

        when (menuItem.itemId) {
            R.id.search_Action ->{
                Toast.makeText(this@MainActivity, "Clicked", Toast.LENGTH_LONG).show()
            }
        }
         true
    }

And finally, Overriding onOptionsItemSelected():

override fun onOptionsItemSelected(item: MenuItem?): Boolean {
    when (item!!.itemId) {

        R.id.action_settings -> {

            startActivity(Intent(this@MainActivity, SettingsActivity::class.java))

        }

        R.id.changeView -> {
            toast("Test")

        }
    }
    return true
}