How to implement new material BottomAppBar as BottomNavigationView

Question

I was trying to implement the new BottomAppBar that usually looks like this: material BottomAppBar as a BottomNavigationView like in the Google home app that looks like this

Answer 1

The team that implement the material components for android says that this design is not part of the specification, but they generously offer a simple solution that can be seen in the link below.

Is it possible to have the BottomAppBar & FloatingActionButton with menu evenly distributed? #72

Basically, one need to change the layout params of the container of the menu buttons:

if(bottomAppBar.childCount > 0) {
     val actionMenuView = bottomAppBar.getChildAt(0) as androidx.appcompat.widget.ActionMenuView
     actionMenuView.layoutParams.width = androidx.appcompat.widget.ActionMenuView.LayoutParams.MATCH_PARENT   
}

The combination of this with your void menu item will do the trick, avoiding the use of another android component.