Last Updated:

Example Code for Bottom Navigation View - Menu in Android 


The bottom navigation bar is a new UI component in the Material Design style. This widget was created to replace the top menu of the app so that users don't have to reach through the entire 5.5" display to press a single button. This provides easier navigation and can refresh your app's designBottomNavigationView

Example of working with BottomNavigationView in Android

 

The BottomNavigationView widget is the successor to the FrameLayout with internal ViewGroup containers for menu items. This is a fairly lightweight and easy-to-use widget in material design styles.

Let's get to work. Create a new project in Android Studio or add a widget from the Design Support library to an existing project.BottomNavigationView

The support library itself must be added in the project-level dependencies of the gradle.build file:

 

Note that the version of the library in your project may be different.

In this example, I'll show a simple application with a bottom navigation bar with three menu items and snippets.

BottomNavigationView

Let's take a look at the layout of the activity_main.xml:

From the listing above, you can see that FrameLayout (space for slices) takes up all the space, displacing the BottomNavigationView down the screen. This is a fairly common practice and allows you to do without unnecessary additional investments in the layout.

The menu itself looks like this:

Where is the vector action icon on the menu item. These icons, as well as the entire project, you will find at the link at the end of the article.

android:icon