03. Bottom bar
Utilize bottom bar for actions buttons with higher priority.
A maximum of five action buttons in the bottom bar can be provided, using a combination of icons and text.
These buttons can be shown or hidden when the user scrolls up and down, depending on the amount of information displayed in the body text area.
Don’t provide a more options button in the bottom bar. Do not allow the buttons to scroll horizontally. Don’t place the bar above the keyboard, except for components that are relevant to keyboard input (e.g., Cancel, Done, Save, or Next).
Example of device application
Definitions and Function Differences
The bottom toolbar, which is designed for action buttons, and the bottom tabs, which are used for navigation, are defined and function differently.
Action buttons in the app bar on the action screen & action buttons in detail view
Place higher priority action buttons at the bottom.
List/Grid view – For screens where browsing is the main purpose
Place action buttons at the top.
1Toolbar at the top
2Tabs at the bottom