增加价值的原则

在为圆形屏幕设计自适应布局时,滚动视图和非滚动视图在缩放 UI 元素以及保持平衡的布局和构图方面各有其独特要求。下图仅为广泛建议;示例仅供说明之用。请查看各组件或界面的页面,以获取详细的、情境化的响应式指南。

一目了然,获取更多内容

响应式布局允许在单个屏幕上容纳更多的微件 (chips)、卡片、文本行和按钮。

alt text

显示更多内容元素

使用在特定屏幕尺寸断点处应用的新布局,以便在可能的情况下引入更多内容,从而为大屏设备用户提供额外价值。

alt text

提升易读性

利用额外的屏幕空间提供更大的容器、更大的文本、更粗的圆环以及更精细的数据可视化效果,从而提升一眼即得的阅读体验。

alt text

提升易用性

利用额外的屏幕空间提供更大的点击目标、更明显的视觉层级以及内容项目之间的间距,使界面更具可访问性和吸引力。

alt text

优化构图

利用我们更新后的组件和模板,为我们的 UI 在各种屏幕尺寸上提供更好的外观和操作体验。

alt text

使用既定的规范布局

利用既定的规范布局来帮助您的 UI 在各种设备尺寸之间平滑适配。我们的规范布局经过精心开发,旨在为所有屏幕尺寸提供高质量的体验。

alt text

微件 (Tiles)(非滚动布局)

alt text

应用滚动布局

alt text

应用非滚动布局