交互设计指南的详细介绍

1 前言

2 总体要求

3 模式

3.4 可用性联动

3.4.1 释义

当某个CheckBox或RadioBox在选中和不选中的状态中切换时，相关的一组控件的可用属性（Enabled）也随之发生变化。

3.4.2 别名

成组激活。

3.4.3 动机

我们经常碰到这样的情形：有一组控件（通常是一些用来表达选项信息的控件，在此我们称其为子选项），它们的状态依赖于其他选项（称为父选项）。当父选项（如一个checkbox）未激活（或未打开）时，子选项的状态是无意义的，即此时不应当也没有必要让用户来操作，因此这个时候将它们的可用属性设置为假。在父选项被激活时，重新将子选项的可用属性设置为真。

使用此模式的意义在于通过可用性的联动，软件系统可以避免出现有关选项设置自相矛盾的情况（比如在禁止输出的情况下又允许设置输出的各项格式）。同时，使用此模式，有助于在界面上更加明确地体现一组控件和某个关键控件的关联和依赖性。

3.4.4 适用性

当一组选项（子选项控件）和某个选项（父选项）存在依赖和关联时使用此模式。

3.4.5 实现

父选项：多使用CheckBox，也有使用多个RadioButton组合的。

子选项：一个或多个选项控件，具体可以是编辑框，CheckBox，一组RadioButton，或者其他。

父选项和子选项的组合有多种方式：

n 简单型

子选项通常布置在父选项的下方，且在水平位置上向右边缩进。以Word 2000中 “选项”窗口的“编辑”页为例：父选项未选中时，子选项不可用，如下图：

父选项选中时，子选项可用，如下图：

再以Foxmail 5.0选项窗口为例，当父选项未激活（未选中）时，如下图：

父选项选中时，如下图：

以上两例子均以CheckBox作为父选项，下面的一个例子(Windows Shell)是以RadioButton作为父选项的。

n 分组型

由于子选项较多，为便于管理和分组，因此将它们整合到一个GroupBox中。

父选项选中时，如下图：

父选项未选中时，如下图：

一般而言，使用CheckBox是比使用RadioButton更为简练的方案。使用CheckBox作为父选项并采用分组型组合方式的例子也比比皆是。如Delhpi 5的Environment Options窗口：

3.4.6 已知应用

在绝大多数的软件中都能够找到它的踪影。

3.4.7 讨论

推荐使用较为简练的CheckBox作为父选项的控件。

当子选项数量较少，或者种类比较单一时，可考虑采用简单型组合方式。当子选项内容较多较复杂时，采用分组型的组合方式。

允许嵌套使用该模式，即在子选项的内部又包含一对父选项和一组子选项。嵌套使用的层数不宜太多，一般嵌套一层即可。若需要嵌套更多的层次，则意味着该选项比较复杂，此时使用单独的TabSheet进行表达或许比较合适。

3.4.8 相关模式

3.5 省略号命名

3.5.1 释义

在菜单项或按钮的Caption上包含“…”的文字，表明该菜单项或按钮将激活（弹出）一个新的窗口。

3.5.2 别名

点点点命名。

3.5.3 动机

没有什么动机，一切只是约定俗成。始作俑者可能是微软或者苹果电脑的某位工程师。

3.5.4 适用性

适用于菜单项以及按钮，前提是这些对象的click操作将激活一个新的窗口。

一些简单的操作，如“复制”或者“粘贴”操作，则不适用。当然，“选择性粘贴(&S)…”除外，因为它需要弹出一个对话框，以便用户选择粘贴的来源。

3.5.5 实现

在菜单项或按钮文字的末尾添加“…”即可。

使用按钮作为载体时，还有一种简化的用法，即整个按钮的Caption就是一个“…”。这种情况多见于以下几种场合：

n 在一个路径的编辑框的右边摆放“点点点”按钮，点击后选择路径；

n 在一个下拉选择框（用于选择路径）的右边摆放该按钮，点击后弹出路径管理窗口；

总之，如果按钮文字为“…”，要求按钮所处的位置能够让用户容易地联想到按钮的功能。

当使用单纯的“…”作为按钮文字时，要求按钮：

高度为20，宽度为20。

字体采用“times new roman”，9号。

3.5.6 已知应用

使用省略号命名的菜单项太多了，比如你正在使用的Word。打开“文件”菜单，你就可以看到不少。

包含省略号命名的按钮也多不胜数，在Windows Shell中我们就可以看到，如下图：

而使用单纯的“…”作为按钮名字的，也比较常见，特别是在一些开发工具中。如Vc++ 6、Delphi 5。见下图：

3.5.7 讨论

3.5.8 相关模式

此为基本模式，不依赖于其他模式。

3.6 属性窗口

3.6.1 释义

在选中某个对象（单个或多个）的前提下，打开另一个窗口以显示更详细的信息。

3.6.2 别名

编辑/状态窗口。

3.6.3 动机

以模态的方式显示对象的相关数据，并确保在关闭该窗口前不能做其他事情。例如在浏览一些记录的时候，此时要编辑其中的一条记录，则需要打开一个属性窗口对该条记录进行编辑。

有时，在不选中（严格地说应该是未显式地选中）任何对象的情形下也可以弹出属性窗口，如在windows 2000下，在桌面上点击右键，选中“属性”菜单后弹出的“显示 属性”窗口。

3.6.4 适用性

在数据浏览的过程中，用于显示或编辑指定的记录。

选中单个对象（记录）时，属性窗口的内容为该单个对象的详细信息。

选中多个对象时，属性窗口的内容为汇总信息。

3.6.5 实现

3.6.5.1 要素

界面要素通常分作两个部分，窗体上部使用一个多页(TabSheet)的PageControl来显示内容；窗体底部显示操作按钮。

操作按钮，包括：

确定和取消按钮。如果是修改数据的窗口，采用“确定”和“取消”可以明确地指示操作。

应用按钮，表明在不关闭窗体的情况下保存更改。

关闭按钮：适用于仅用来进行数据显示的场合。一般情况下关闭按钮和确定/取消按钮不会同时出现。

典型的属性窗口如下图：

下图的属性窗口来自Foxmail：

3.6.5.2 标题栏文字

文字一般为“xxx 属性”或者“xxx 编辑”或者“xx选项”或者“xx设置”或其它。可能有些时候，标题栏会随着窗口内某项数据的变化而变化（如编辑某个数据条目的关键字段时）。

3.6.5.3 标题栏图标

没有图标，或使用应用程序的图标。

包含关闭图标。

帮助图标可选，常见于微软的软件中。

一般没有最小化以及最大化图标。

3.6.5.4 位置

以调用者窗口（即失去焦点的窗口）为基准的中央位置。

3.6.5.5 大小

符合总体要求的相关描述。

3.6.5.6 对齐

符合总体要求的相关描述。

3.6.5.7 焦点

初始焦点：窗体刚刚出来时，其焦点位置应当位于第一个TabSheet上的第一个可用的控件内。

焦点切换：焦点切换的次序和界面上控件排列的次序一致。从上到下，从左到右。

3.6.5.8 键盘响应

回车键：做出如同确定/保存/关闭等按钮一致的动作。

Escape键：做出如同取消/关闭等按钮一样的动作。

Tag键：切换焦点。

3.6.6 已知应用

在Ms Windows的操作系统中应用很多，如网络状态属性窗口，文件属性窗口，显示属性窗口等等。许多流行软件，如Word，Delphi其选项(options)/系统设置窗口均应用了此模式。

3.6.7 讨论

允许以模态（独占）或者非模态的方式显示属性窗口。

当属性窗口的内容改变，而用户点击了“取消”按钮，这时可以根据情况决定是否给出保存改动的确认对话框。评价的依据是该属性窗口的内容是否较多，以及该属性窗口用作修改的功用是否是主要的。

若该属性窗口主要用作修改数据，则应当给出提示。若主要用作数据的显示，而改动的情况以及可以改动的数据元素很少，则不给出提示。

或者可以更智能一些：根据改动过的元素占能够被改动的元素的百分比来决定。比如有四个元素可以改动，而用户改动了其中两项（此处的改动不代表数据变化，而仅仅表明用户曾经使之变化过），此时，若提示的标准为改动率大于等于50%，则此时可以给出提示。

这种做法有个弊端，那就是用户可能会有些茫然，会发现软件有时会提示，有时又不提示，使他/她觉得软件的行为怪异，不可捉摸。因此，假如要采取上述做法，可能还得搭配一些选项或者提示，以便让用户来决定是否启用或者停用上述特性。

3.6.8 相关模式

在该模式中可使用其他基本模式，如下图：