复选框

复选框是一种用户界面元素，允许用户从提供的选项中选择一个或多个。

§用例

激活复选框时，不会立即触发操作。用户必须点击确认按钮（例如，“保存”、“应用”、“提交”）才能应用更改。在大多数情况下，复选框会与说明性标签一起使用。然而，在某些场景下，复选框也可以不带标签使用，例如在表格中，或者当在每个复选框旁边添加“启用”标签显得多余时。请以积极的措辞开始您的文本，例如，使用“启用”而不是“禁用”，以避免用户陷入逻辑谜题。

§结构

复选框由以下部分组成：

1. 容器 (Container)：围绕复选框的视觉矩形区域。容器指示边界并激活复选框。
2. 勾选标记 (Checkmark)：当用户启用复选框时，出现在容器内的符号。此符号直观地确认用户已选择复选框。
3. 文本标签 (Text label) (可选)：位于复选框右侧的文本。文本标签解释了复选框的含义或目的。

§尺寸

复选框组件有两种主要尺寸：

M 是默认尺寸，具有适合大多数情况的标准尺寸。在此尺寸下，容器为 14x14 像素，文本标签使用 13 像素的字体。

L 用于当复选框需要在其他界面元素中脱颖而出，或者当界面需要更大的元素以便于使用时。在此尺寸下，容器为 17x17 像素，文本标签使用 15 像素的字体。

§状态

默认 (Default) 是用户可以通过单击启用或禁用的主要复选框状态。

悬停 (Hover) 是当用户将光标移到复选框区域（复选框 + 标签）时的状态。

禁用 (Disable) 是当用户因某种原因无法与复选框交互时的状态。

不确定 (Indeterminate) 是复选框组中标题的状态，当选择了几个项目中的一个时（通常发生在具有多行选择的表格中）。

§建议

§使用场景

• 选项选择：如果您希望用户从列表中选择一个或多个选项。

• 启用/禁用功能：如果您希望用户启用或禁用界面中的某些功能。例如，用户可以启用或禁用通知或自动播放等功能。在这种情况下，复选框提供了清晰直观的交互。

• 表格或列表中的多选：如果您希望用户选择多个项目以进行批量操作，例如删除或导出。这简化了数据操作并促进了批量操作。

• 内容或结果过滤：如果您希望用户选择用于过滤内容或搜索结果的参数。

§避免使用场景

• 单选：如果您期望用户从互斥的集合中选择一个选项，请使用单选按钮 (radio buttons)。

• 双状态启用/禁用（即时操作）：如果选项只有两种状态（启用和禁用），并且更改会立即生效，无需“应用”按钮，请使用开关 (switches)。开关更清晰、更紧凑地呈现此类选项，并且更改在切换后立即应用。

• 分段选择：如果您提供多个互斥的选项，用户可以在不同类别中同时选择，请使用分段控件 (segment controls)。它们允许用户在不同的分段或类别中选择选项。

• 从大量选项中选择：如果您提供一个长长的选项列表供用户选择其中一个，请使用下拉列表 (dropdown list / select)。这可以节省屏幕空间并方便从大量选项中进行选择。

§文本撰写

• 力求文本描述简洁。避免冗长的短语或复杂的句子。
• 使用清晰表明与选择相关的操作的主动动词。例如，使用“订阅新闻通讯”而不是“新闻通讯订阅”。
• 让用户充分了解选择复选框后会发生什么。例如，使用“接收新文章的通知”而不是“通知”。