Components are the building blocks for the visual design of the Android Automotive OS (AAOS) interface. Some AAOS components and their customizable properties are implemented in the car UI library, while others are standard AOSP components, or need to be built from scratch following the specs provided here.
This section describes the anatomy, visual specs, and styles for AAOS components.
![](https://developers.google.cn/cars/design/automotive-os/components/images/component-1.png?authuser=3)
App bar & header
A dedicated space for important app-related functions
![](https://developers.google.cn/cars/design/automotive-os/components/images/component-2.png?authuser=3)
Buttons
Action affordances that communicate their purpose to the user
![](https://developers.google.cn/cars/design/automotive-os/components/images/component-3.png?authuser=3)
Control bar
An expandable set of controls associated with a particular view
![](https://developers.google.cn/cars/design/automotive-os/components/images/component-4.png?authuser=3)
Dialogs
Cards featuring messages to users about timely or urgent information, sometimes with action options for responding
![](https://developers.google.cn/cars/design/automotive-os/components/images/component-5.png?authuser=3)
Grids
Scrollable arrays of images representing content items, with brief text beneath each image
![](https://developers.google.cn/cars/design/automotive-os/components/images/keypad-ov.png?authuser=3)
Keypad
Allows users to enter phone numbers in Dialer
![](https://developers.google.cn/cars/design/automotive-os/components/images/component-6.png?authuser=3)
List items
Content displayed as lines of text (with optional small images or icons) in a single, scrollable column
![](https://developers.google.cn/cars/design/automotive-os/components/images/Comp-Ov-Pi.png?authuser=3)
Media progress indicator
A visual representation of the duration and elapsed playing time for a media source in a media app
![](https://developers.google.cn/cars/design/automotive-os/components/images/component-7.png?authuser=3)
Minimized control bar
A smaller version of the control bar available across multiple views, with minimal controls and metadata
![](https://developers.google.cn/cars/design/automotive-os/components/images/noti-card-ov.png?authuser=3)
Notification card
Communicate small amounts of timely information from the system or from an app
![](https://developers.google.cn/cars/design/automotive-os/components/images/component-8.png?authuser=3)
Subheader
A list tile that identifies a section of content in a grid or list view
![](https://developers.google.cn/cars/design/automotive-os/components/images/component-10.png?authuser=3)
Scrollbar
A position indicator and navigational aid for situations where the document is larger than the window in which it's displayed
![](https://developers.google.cn/cars/design/automotive-os/components/images/component-9.png?authuser=3)
Tabs
Buttons that always occur in groups and are dependent on each other’s state
![](https://developers.google.cn/cars/design/automotive-os/components/images/component-toast.png?authuser=3)
Toasts
Informational messages briefly displayed near the bottom of the screen about an action an app has taken or will take