对话框是一种显示在应用前面的模态窗口,用于显示需要用户立即响应的任务信息。
对话框可以是需要用户互动的提醒。它还可以是选择对话框或确认对话框,要求用户做出或确认选择。对话框将一直保持焦点,直至其关闭或执行所需操作。由于对话框具有干扰性,因此应谨慎使用。
对话框与消息框相关(均属于对话框组件系列的成员),但它们的用途和优先级有所不同,如下所示。
组件 | 目的 | 优先级 |
消息框 | 显示说明性消息。不需要用户互动。8 秒后消失。 | 低 |
对话框 | 显示需要用户互动的信息和任务选项。对话框会在用户做出响应之前一直保持焦点。 | 高 |
解剖学
对话框中包含信息性文本以及请求用户回复的界面控件。
![](https://developers.google.cn/cars/design/automotive-os/components/images/Dialog-Anatomy-new.png?authuser=5&hl=lv)
2. 卡片标题
3. 内容区域
4. 卡片操作区域
规格
无标题的对话框
![](https://developers.google.cn/cars/design/automotive-os/components/images/dialog-spec-3.png?authuser=5&hl=lv)
带有标题的对话框
![](https://developers.google.cn/cars/design/automotive-os/components/images/dialog-spec-4.png?authuser=5&hl=lv)
标题居中的对话框
![](https://developers.google.cn/cars/design/automotive-os/components/images/dialog-spec-5.png?authuser=5&hl=lv)
可滚动的对话框
![](https://developers.google.cn/cars/design/automotive-os/components/images/dialog-spec-6.png?authuser=5&hl=lv)
自定义
OEM 可以通过自定义对话框的以下几个方面来体现其品牌风格:
- 字体
- 活动、非活动状态和已停用的按钮的样式
- 按钮尺寸和展示位置
设计系统提供了有关如何使用布局、颜色、排版和尺寸来自定义组件的指南。
示例
![](https://developers.google.cn/cars/design/automotive-os/components/images/Dialog-Mock-1-new.png?authuser=5&hl=lv)
![](https://developers.google.cn/cars/design/automotive-os/components/images/Dialog-Mock-2-new.png?authuser=5&hl=lv)
![](https://developers.google.cn/cars/design/automotive-os/components/images/dialog-mock-3.png?authuser=5&hl=lv)
![](https://developers.google.cn/cars/design/automotive-os/components/images/dialog-mock-4.png?authuser=5&hl=lv)
![](https://developers.google.cn/cars/design/automotive-os/components/images/dialog-animation-1.gif?authuser=5&hl=lv)