布局

Android Auto 的自适应响应 (AR) 框架可适应任何车载屏幕尺寸的应用布局。

应用界面和功能(例如媒体浏览和播放操作)也会在 Android Auto 中自动进行调整。Android Auto 适用于从用户手机投屏的应用的兼容汽车。

资讯一览

  • 布局会在特定断点处根据屏幕尺寸进行调整
  • 以 8dp 为增量应用内边距
  • 在较小的组件之间谨慎放置 12dp 的内边距

如何确定布局

Android Auto 的 AR 框架同时使用自适应设计和自适应设计:

  • 自适应设计(确切屏幕尺寸决定布局)用于左右外边距
  • 使用自适应设计(屏幕高度和宽度的范围确定布局)

布局使用称为断点的测量结果确定。划分点是策略性定义的屏幕高度和宽度测量值,用于确定何时显示特定布局。对于每个断点范围,布局都会调整为适合屏幕尺寸和屏幕方向。

自适应断点动画

自适应

自适应设计使用断点来确定屏幕的布局。对于指定的屏幕尺寸范围(例如宽度小于 1280dp 的设备),系统会显示特定的布局。
自适应断点动画

自适应

自适应设计会按照与确切屏幕尺寸成比例的方式调整布局。组件具有灵活的区域,可以针对每辆汽车的屏幕展开或缩小到合适的尺寸。

自适应断点

Android Auto 依靠自适应断点来确定屏幕布局,该布局是根据应用窗口的尺寸而不是整个屏幕计算得出的。

不同屏幕尺寸的断点
适用于窄 (0-600dp)、标准 (600-930dp)、宽 (930-1280dp) 和超宽 (1280dp+) 屏幕尺寸的自适应断点

自适应利润率

Android Auto 根据整个车载显示屏的尺寸使用自适应边距。左右外边距会调整为屏幕宽度的 12%,且通常包含滚动条和导航控件。剩下的屏幕空间称为应用画布,其中包含应用内容。

为了提供更多空间,可以在较小的屏幕上移除右侧边距。应用可以将此空间用作辅助区域,以显示更多信息。

自适应页边距动画
自适应外边距会根据屏幕尺寸调整宽度。

布局网格

Android Auto 布局会沿着 8dp 网格对齐界面元素,其中一些较小的组件会对齐到 4dp 网格。

内边距

内边距是指界面元素之间的间距。Android Auto 内边距缩放比例为 8dp 的倍数,内边距大小不超过 96dp。如果内边距较大,还应以 8dp 的倍数添加。

下表列出了 Auto 界面中显示的典型内边距值。尺寸增量按升序排列,由以字母“P”开头的标签标记:

P0 P1 P2 P3 P4 P5 P6 P7 P8
4dp 8dp 12dp 16dp 24dp 32dp 48dp 64dp 96dp
在布局中填充值
在此布局中,上边距值由上表中的 P1、P3 和 P5 表示。

适用于较小组件的内边距

为了实现更好的对齐效果并留出足够的间距,较小组件可能会谨慎使用 12dp 的内边距。

组件中的内边距值
在此微件中,元素使用上表中的 P2、P3、P4 和 P5 表示的内边距值。

框线

框线是一种测量结果,用于通过显示元素和组件在布局中应沿着 x 轴方向水平放置的位置来组织界面。它们都以字母“KL.”开头。

框线可放置在布局中的任何位置。它们可用于指示元素、组件或屏幕本身的任何两条垂直边之间的距离。组件和元素的左边缘或右边缘与最近的框线对齐。

组件中的框线
在此组件中,KL0 将所有列表图标和文本以相等的间距对齐。KL1 将所有列表项与组件的左右边缘对齐。

使用框线进行测量

框线随屏幕宽度而变化,使界面元素能够针对不同的屏幕尺寸一致缩放其位置。

对于一系列屏幕尺寸,建议使用标有“KL(n)”的标签表示,框线如下。这些维度按框线大小递增的顺序显示:

吉隆坡 窄屏幕
(0-600dp)
标准屏幕
(600-930dp)
宽屏
(930-1280dp)
超宽屏幕
(1280dp+)
吉隆坡 16dp 24dp 24dp 32dp
吉隆坡 24dp 32dp 32dp 48dp
吉隆坡 96dp 112dp 112dp 不适用
吉隆坡 112dp 128dp 128dp 152dp
吉隆坡 148dp 168dp 168dp 不适用