Material Design 基础 - Applying density

1. 前言

Material设计为提高密度改善用户体验的用例提供高密度间距指导。

2. 用法

这些指南描述了如何以及何时应用密度。

2.1. 原则

2.1.1. 可扫描

密集的UI提高了查看和浏览大量内容的便利性。

2.1.2. 优先考虑

密集的UI通过减少操作之间的空间来帮助用户集中精力。

2.1.3. 可见的

增加密度可以在单个屏幕上容纳更多内容和动作。

2.2. 组件密度指南

2.2.1. 怎样使用组件密度

Material密度指南是了解何时以及为什么应用密度可以改善用户体验的资源。在代码的支持下，Material组件密度可以在刻度上进行一致调整。
组件密度中解释了使用密度标度的指导，平台支持可在组件密度实施指南中找到。

2.2.2. 何时使用组件密度

用户与组件的交互方式应决定是否增加UI中的密度。当用户查看和交互大量信息时，高密度组件可以改善体验。
通过在屏幕上提供更多内容，增加列表、表格和长表单的密度，使信息更易于扫描、查看和比较。

2.2.3. 何时不应该使用组件密度

任务和基于警报的组件不应增加密度。

2.2.3.1. 重点任务

不要增加涉及重点任务的组件的密度，例如与下拉菜单或选择器交互。增加日期选择器等组件的密度会限制可点击空间，从而降低可用性。

2.2.3.2. 警报和消息

不要增加Alert或消息组件的密度，例如snackbar或对话框。增加警报的密度会降低它们吸引用户注意力的效率。在对话框的例子中，当密度增加时，消息的可读性和突出性会受到影响。

2.3. 布局

2.3.1. 网格和组件密度

保持组件密度和网格布局之间的平衡。
要创建可扫描的内容组，请结合使用密度较低的网格布局和高密度组件。组件的密度越大，边距和边沟宽度就应该越大。将密集的布局网格与密集的组件相结合，可以让用户更难区分内容组。

2.3.2. 将密度应用于组件

不应单独调整组件密度。相反，要始终如一地应用密度，以创建一个内聚组件集。当你调整一个组件的密度时，考虑一下这一变化将如何影响应用程序中的其他组件。
下面的工具演示了材质组件随三种密度设置（默认、舒适和紧凑）的变化。

2.3.3. 密度标尺

密度比例允许您在需要时控制单个组件的密度。
“密度比例”已编号，从组件的默认密度0开始。随着空间的减少，比例会移到负数（-1，-2，-3），从而产生更高的密度。每个增量表示组件高度减少4dps。

不要从“密度比例”中选择破坏组件的数字。

2.3.4. 间距法

当组件的密度增加时，填充和对齐保持一致，但尺寸会发生变化。增加时不要更改组件的填充.

• padding
  增加密度时，不要改变组件的填充。组件填充会影响高度，减少填充会对用户交互产生负面影响。

• Dimensions
  增加零部件密度时更改尺寸。构件尺寸会影响构件或图元的长度和高度。

• Alignment

使用中心规格来对齐零部件容器中的图元。中心对齐元件允许在不需要额外对齐元件的情况下调整元件高度

2.3.5. 分隔多个元素

当多个元素在一个组件内垂直堆叠时，使用4dp增量将它们分开。将已分组的元素置于组件容器的中心。

2.3.6. 可达性

触摸目标适用于接收触摸和非触摸输入的任何设备。为了平衡信息密度和可用性，默认密度组件的触摸目标应至少为48 x 48 dp，每个目标之间至少有8 dp的空间。注意：在iOS上，44 x 44 dp是建议的触摸目标。

2.4. 排版

2.4.1. 线条高度

行高是文本行之间的间距。线条高度可以作为在排版布局中创建密度的一种方式。

3. Material Design 系列文章

最新更新以及更多Material Design相关文章请访问 鹏叔的技术博客-Material Design