Tabs

GuidelinesReact

When to use

  • You have a lot of content that can be divided into separate tasks.
  • You have related views.

When not to use

  • You have many groups (more than, say, 6 tabs)—use a drawer.
  • You want to connect content across screens—use a navigation bar.

Component status

Released
Released
Released
Released

Content structure

Behavior

Keep everything necessary in one tab

Limit the number of tabs

Content

Keep content similar

Make content clear

My profile, My trips, Preferences
My trips, Upcoming, Completed
Guidelines, React, iOS, Android
Your user profile, Trips, Settings for your account
My trips, Trips you have planned, Trips you have taken
Some general thoughts, Specifics for React, iOS implementation, How it’s done in Android