Windows桌面应用程序设计指南(控件篇2-复选框)

复选框 Check Boxes

用户利用选择框,可以做出两种意义截然相反的选择。复选框的标签意为选中状态下的意义,未选中状态下的意义必须与此明确对立相反。因此,** 复选框只能用来表示打开/关闭或选择/不选择标签选项。**

一组典型的复选框

复选框在什么情况下使用?

思考以下问题,再做决定:

  • 控件要用来表示打开/关闭或选择/不选择一个标签选项吗?如果不是,使用别的控件。
  • 选择和不选状态表示的是截然相反的含义吗?如果不是,使用选项按钮radio buttons 或下拉菜单drop-down list 来独立控制各标签状态。
  • 复选框组是否包由一组相互独立的选项构成,并允许用户选择零个或多个选项?如果不是,考虑使用选项按钮或树形视图check box tree views等控制单个选项的控件。
  • 复选框组是否包由一组相互依存的选项构成,并需要用户选择一个或多个选项?这种情况下,使用复选框组,并在用户选择项为零的情况下报错。
  • 选项少于等于10个吗?为了使屏幕效果与选项集合成比例,控制复选框在10个以内。如果多于10个,使用下拉列表check box list。
  • 选项按钮会不会更适用当前情况?当复选框只能用来表示打开或关闭某一个选项的情况下,选项按钮可以用来标示其他不同的选项。如果两种方法都可用:
  • 当复选框勾选与不勾选的意义不明显反向时,使用按钮选项。


    不勾选landscape的含义不十分明确,所以选择复选框不合适
正确示例,在该例中,选项标签并不是相反的意思,所以按钮选项更合适。
  • 在引导页面wizard pages上,在复选框也适用的情况下,使用选项按钮能使选项标签意义更明确。
  • 当屏幕有足够空间、而内容也需要重点突出展示时候,选择选项按钮。除此以外,还是使用复选框或下拉菜单。
错误示例,内容不太重要,不需要用选项按钮来展示
正确示例,这里使用复选框展示内容更高效
  • ** 保持形态一致,如果页面上有其他复选框,也可继续沿用复选框形态。**
  • ** 选项展示的是项目选项,而不是数据内容吗?** 选项的取值不应该来自于标签文本或其他数据源。如果要对选项取数值,用下拉菜单或者多选菜单multiple-selection list.

应用范式

复选框有以下几种应用类型:

  • 单独选项 单个复选框用来作独立选项的选择动作
    示例
  • 独立选项(不选单选或多选) 一组复选框用来作任意数量子集选择
    和选项按钮 radio buttons 这样的单选控件不同,在一组复选框里用户可以选择任意数量的选项。
Windows桌面应用程序设计指南(控件篇2-复选框)_第1张图片
用来表示一组独立选项的复选框
  • 依存选项(一个或多个)一组复选框用来作大于等于一个的子集选择
    用户需要选择一个或多个对选项组有依存关系的选择项。因为Microsoft Windows没有直接支持这种输入类型的控件,所以最好的解决方案就是使用复选框组控件,并在选项为零时报错。
示例,至少需要选择一项
  • 除了选择和清除选择,复选框也有一个** 混合态**:选项设置对一些对象来说有效用,但不是全部对象。
示例,一个混合态的复选框

设计样例

常规项

  • 把复选框建组。把相关联的复选框合并为项数在10以内的组,不相关的放到一边。有必要的话可使用复合选框组。
Windows桌面应用程序设计指南(控件篇2-复选框)_第2张图片
示例
  • 思考需不需要要不要用框来组织复选框组。毕竟这样会需要很大空间。
  • **按照逻辑来排列组织复选框选项, **例如把意义相关的选项放在一起,把常见选项放在前面,接下来放置次常见选项。不要按照字母表顺序放置选项,这种做法对不同语言没有通用性。
  • 纵向排列复选框。横向排列的复选框难以阅读。
正确示例
错误示例
  • 不要用混合态来代表除了选中和非选中之外的第三种状态。混合态表示该选项选中且仅对部分子集有效。它只是子集状态的表现,用户无法直接设置一个混合态。混合态不能当做一个选项的第三种状态来进行独立设置,如果要表示第三态,使用选项按钮表示或下拉菜单选择来实现。
错误示例。这个选项的本意是要表示Theme service未安装
Windows桌面应用程序设计指南(控件篇2-复选框)_第3张图片
正确示例。用户可以选择三种状态中的任意一种
  • 点击混合态复选框会依次循环全选、清除全选和初始混合态。因为混合态复选框对用户可能难以理解或比较陌生,所以必须使得用户能够以这样的方式回到初始混合态。不然就只能清除任务重新来过了。
  • 不要用复选框来作为进程指示。用进程指示控件 progress indicator 来完成该任务。
Windows桌面应用程序设计指南(控件篇2-复选框)_第4张图片
错误示例,复选框不能用来指示进程
正确示例,使用标准的进度条来显示程序进度
  • 用正确的选择状态来显示不能操作的选项。尽管用户无法操作,但禁用的选择框也传达了信息 ,所以它们表达的含义应与状态一致。
错误示例
  • ** 不要用复选框来:**
  • 陈述命令
  • 展示其他窗口,例如用来获取更多输入信息的对话框。
  • 动态展示和选中控件相关联的其他控件(屏幕阅读器监控不到此类事件)。

不再展示此项

  • 在没有更好的解决方法的情况下,给出“不要再展示该‘对象’”的复选框,来允许用户阻止再次弹出的对话框。尝试预先判断用户是否需要该对话提示,如无必要,就不做展示。
    查看更多指导示例,请参见对话框Dialog Boxes.

附属控件

  • 将附属控件放在复选框右边或下方(缩进后对齐复选框标签文字)。标签文字以冒号结束。
示例
  • 可编辑的文本框和下拉列表如果也共享复选框的标签,选中即激活控件。当用户输入或者粘贴内容到输入区,也自动选择相应的选项。这样可以简化交互。
Windows桌面应用程序设计指南(控件篇2-复选框)_第5张图片
示例,输入标题或footer也自动勾选上该选项
  • 如果复选框下设置有选择按钮或其他选择框,** 在上级复选框选择完毕之前要禁用次级选框的操作。**这样能防止次级控件可能造成的歧义。
  • 将次级控件集成为复选框,按标签顺序临近排列在主选择框附近。
  • 如果选择主选项意味着也选择了其下的次级选项,要明确地在次级选项的选择框中显示出来。
Windows桌面应用程序设计指南(控件篇2-复选框)_第6张图片
错误示例,主选项选择了,次级选框却未选择
Windows桌面应用程序设计指南(控件篇2-复选框)_第7张图片
正确示例
  • 在一定情况下,考虑用不互斥的的复选框代替设置起来更为复杂的独立互斥的选项组。尽管选项之间都是独立的,但有时候过于严格限定的控件、例如选择按钮设置起来逻辑过于冗余。
Windows桌面应用程序设计指南(控件篇2-复选框)_第8张图片
准确但是较为复杂的选项设置
Windows桌面应用程序设计指南(控件篇2-复选框)_第9张图片
更好的选项设置方式

注意:这条规则仅适用于比较少见的极端情况,也就是更多的选项只是让情况更复杂而不是更清晰。就如上例,用户不太可能会既勾选主选项又勾选副选项。当可以这样勾选时,选项就明显是独立而有意义的。

默认值

如果复选框需要用户进行选择,默认设置到最为安全和隐私的状态。如果安全和隐私不是需要考虑的最重要的因素,选择最有可能或最合适的值作为默认值。

推荐尺寸和间距

Windows桌面应用程序设计指南(控件篇2-复选框)_第10张图片
如图所示

标签

复选框标签

  • 每个复选框都必须有标签
  • 为每个标签选项分配读取键access key ,分配规则,参见 Keyboard.
  • 使用句法大小写规则sentence-style capitalization.
  • 用短语或祈使语气书写标签,不要加句号
  • 例外情况:如果标签中还有次级控件,以冒号结束标签
  • 标签当描述勾选复选框后的选择状态
  • 复选框组的标签描述最好句式相近,长度相仿
  • 复选框组的标签描述重在不同和独特的点。如果所有选项都包含相同说明文字标签,把相同部分提取出来作为组的总标签。
  • 使用正向积极行动意义的词汇。不要让用户勾选一个选框以避免这个操作。
  • ** 例外情况:“不要再出现这个’对象‘”选框**
  • 标签只用于描述选项。标签要简洁明了,利于表达信息。如果选项需要进一步的解释,用一个装载静态文字的控件以完整句子形式展示。

Note 注意为复选框组中的一个选项作解释并不意味着也要解释其他所有选项。尽量在标签中展示相关信息,只在必要时补充解释。不要只是为了视觉上的一致性重复陈述标签内容。

附有解释说明的标签示例
  • 如果强烈建议用户选择某选项,考虑在标签正文、而不是标签说明文字后加上"(建议选中)"字样。
  • 如果不可避免使用多行标签,第一行要对齐选择框。
  • 不要在标签的句子或短语中放置需要填写值的次级控件。因为句式和文法会随着应用语言的不同而不同,这样的设计没有普适性。


    错误示例:带有文本框的复选框标签

复选框组标签

组标签的作用不是提示如何做选择,而是说明组选项的含义。默认情况为用户知道如何做选择操作。例如,不要在组标签里写“选择下列任意选项”这样的文字。标签以分号结束。
Don't assign an access key to the label. Doing so isn't necessary and it makes the other access keys harder to assign.
对于可以多选几个独立选择项的情况,在标签里最好给出说明。


包含两个选择控件的标签

在上图中,用户可能会认为只能选择一个选项。

标签说明:请选一个至多个

上图是更好的做法。

说明

应用复选框时,请注意:
Use the exact label text, including its capitalization, but don't include the access key underscore or colon. Include the word check box.
Refer to a check box as a check box, not option, checkbox, or just box, because box alone is ambiguous for localizers.
To describe user interaction, use select and clear.
When possible, format the label using bold text. Otherwise, put the label in quotation marks only if required to prevent confusion.Example: Select the Underline check box.

你可能感兴趣的:(Windows桌面应用程序设计指南(控件篇2-复选框))