用户使用滑动条在一系列连续值中进行选择。滑动条包含一个表示范围的数值栏、一个指示当前值的指针，以及一个可选的刻度标记。

一个典型的滑动条

何时使用该控件

如果希望用户能够设置确定的连续值(如音量或亮度)或离散值范围(如屏幕分辨率设置)，请使用滑块。

当用户能理解当前的值是相对数量而不是绝对数值的时候，使用滑动条是一个很好的选择。例如调节音量时，用户在意的是将音量调到低或者中等，而不会关注音量是2还是5。

考虑以下几点：

• 需要设置的是否是相对的值？如果不是，使用单选按钮、下拉控件或者单选列表。
• 需要设置的是否是一个明确的数字值？如果是，使用数字文本框。
• 变更设置时的即时反馈是否对用户有帮助？如果这样，使用滑动条。例如在选择颜色时，用户如果能实时看到色相、纯度和明度的变化效果，选择起来会更直观。
• 可设置值是否超过四个？如果没有，使用单选按钮。
• 用户可以对值进行更改吗？滑动条的作用是供用户交互操作使用。如果用户不能自行更改值的话，使用只读的文本框代替。

当使用滑动条和数字文本框都可以时，以下情况倾向于使用数字文本框：

• 屏幕空间有限
• 用户更倾向于使用键盘
  以下情况则使用滑动条：
• 变更设置的即时反馈对用户有帮助

设计指南

• 使用更自然的方向。例如，若滑动条代表的值在现实世界中就是竖向表示的（例如温度），则使用竖直方向滑动条。

• 根据目标用户的文化背景设置滑动条方向。例如，西方文化圈的阅读顺序是从左至右，所以对于水平滑块来说，最小值放置在最左边，最大值放置在最右边。而对于阅读顺序从右至左的国家和地区，则需要相反设置。

• 合理设置控件尺寸，保证用户能方便地设置到理想的值上。对于离散值的设置，确保用户能使用鼠标选择到想要的值。

• 如果值的范围很大，而且用户很有可能去选择在范围某一端的数值，考虑将滑块标尺设置为非线性的。例如，时间刻度尺可以设置为1分钟，1小时、1天或1个月。

• 如果可行，在用户做出选择时或之后立即给予反馈。例如，microsoftwindows音量控制器在音量调整后会立即发出哔哔声以表示调整结果。

• 使用标签文字显示值的范围。

例外: 如果滑块是垂直方向的，顶部的标签是最大值、最高、更多，或者类似文字，你可以省略其他的标签，因为意思很清楚。

示例

• 当用户需要知道设置的大概数值时，使用刻度标尺。

• 当用户需要知道设置的确切数值时，使用刻度标尺以及表明值范围的文字标签。当用户需要知道设置值的单位以保证设置正确时，一定要使用文字标签进行说明。
  

  该例中，文字标签显示了用户选择的确切数值

• 在水平方向的滑动条中，刻度标尺放置在滑动条下方。对竖向的滑动条，从左到右阅读习惯的国家和地区，刻度标尺放在滑动条右边；从右至左的地区则相反。

• 将值标签完全放置于滑动条下方，以明确逻辑关系。
  

  错误示例：没有完全放置于滑动条下方的值标签文字会引起歧义

• 禁用滑动条时，也要同时禁用所有相关的标签。

• 对一个设置，不要同时使用滑动条和数字文本框。选择更合适的那个使用。
  例外情况: 当用户既需要即时反馈，又需要设置精确数值的能力时，同时使用这两个控件。

• 不要使用滑动条作为进程指示器。

• 不要更改滑动指针的默认尺寸。
  

  错误示例：指针过小
  
  
  正确示例：默认尺寸

• 不要对每个刻度都标注数值标签。

建议尺寸和间距

滑动条的建议尺寸和间距

标签

滑动条标签

• 使用以冒号结尾的静态文本标签，或者使用没有结尾标点符号的分组框标签。
• 为每个标签分配一个唯一的访问键。
• 使用句式大小写规则。
• 滑动条标签放置在滑动条的左边，或在滑动条的上方与其或其最左边范围的标识符左对齐。

范围标签

• 除了垂直方向的滑动条不需要，横向滑动条的的两端都需要标出范围。
• 如果可能的话，每个标签只使用单词表达。
• 不要在结尾使用标点符号。
• 确保这些标签是描述性、并且结构是平行的。例如: 最大 / 最小值，多 / 少，低 / 高，柔和 / 响亮。
• 使用句式大小写规则。
• 不要给范围标签分配存取键。

数值标签

• 如需要展示数值标签，将它放置于滑动条下方。

• 将文本相对于控件居中并包含单位(例如像素)。

  
  
  示例：数值标签相对控件居中

说明

在提到滑动条时：

• 使用确切的标签文本，包括其大小写，并包括单词 slider | 滑动条文字描述。 不要包含访问键下划线或冒号。
• 要描述用户交互，请使用 move（滑动）。
• 如果可能，使用粗体文本格式化标签。 否则，只有在需要时才将标签加上引号，以防混淆。
  示例：要提高屏幕分辨率，请将屏幕分辨率滑动条向右滑动。