# Bottom Navigation ![Bottom Navigation](assets/bottom-navigation.svg) `BottomNavigationView` creates **bottom navigation** bars, making it easy to explore and switch between top-level content views with a single tap. This pattern can be used when you have between 3 and 5 top-level destinations to navigate to. ## Design & API Documentation - [Material Design guidelines: Bottom Navigation](https://material.io/guidelines/components/bottom-navigation.html) - [Class definition](https://github.com/material-components/material-components-android/tree/master/lib/java/android/support/design/widget/BottomNavigationView.java) - [Class overview](https://developer.android.com/reference/android/support/design/widget/BottomNavigationView.html) ## Usage 1. Create a [menu resource](https://developer.android.com/guide/topics/resources/menu-resource.html) with up to 5 navigation targets (`BottomNavigationView` does not support more than 5 items). 2. Lay out your `BottomNavigationView` below your content. 3. Set the `app:menu` attribute on your `BottomNavigationView` to your menu resource. 4. Listen for selection events using `setOnNavigationItemSelectedListener(...)`. A typical layout file would look like this: ```xml ``` ### Handling States The `app:itemIconTint` and `app:itemTextColor` take a [ColorStateList](https://developer.android.com/reference/android/content/res/ColorStateList.html) instead of a simple color. This means that you can write a `selector` for these colors that responds to the items' state changes. For example, you could have a `bottom_navigation_colors.xml` that contains: ```xml ``` And you would use it like this on your `BottomNavigationView`: ```xml ``` ## Related Concepts There are other navigation patterns you should be aware of - [Hierarchical navigation](https://developer.android.com/training/implementing-navigation/index.html). *See also [Navigation with Back and Up](https://developer.android.com/design/patterns/navigation.html).* - Swipeable tabs using [TabLayout](TabLayout.md) and [ViewPager](https://developer.android.com/reference/android/support/v4/view/ViewPager.html). - Using [NavigationView](NavigationView.md) to display a longer list of navigation targets, usually in a navigation drawer.