Bottom Navigation Bar in Android

Bottom navigation bars allow movement between primary destinations in an app.

Usage

Bottom navigation bars display three to five destinations at the bottom of a screen. Each destination is represented by an icon and an optional text label. When a bottom navigation icon is tapped, the user is taken to the top-level navigation destination associated with that icon.

When to use

Bottom navigation should be used for:

  • Top-level destinations that need to be accessible from anywhere in the app

  • Three to five destinations

  • Mobile or tablet only

Anatomy

There are three destinations in this bottom navigation, each with an icon and text label.
  1. Container

  2. Inactive icon

  3. Inactive text label

  4. Active icon

  5. Active text label

Icons

Bottom navigation destinations always include an icon. It’s best to pair icons with text labels, especially if the icon doesn’t have obvious meaning.

Icons paired with text labels in bottom navigation

Text labels

Text labels provide short, meaningful descriptions of bottom navigation destinations.

Implementation

Step 1: Create a new project

create a new project with empty activity

References

Last updated

Was this helpful?