Text Boxes

备注

此设计指南是为 Windows 7 创建的，尚未针对较新版本的 Windows 进行更新。 大部分指南原则上仍然适用，但演示和示例并不反映我们 当前的设计指南。

使用文本框，用户可以显示、输入或编辑文本或数值。

典型的文本框。

备注

与 布局、 字体和 气球 相关的指南在单独的文章中提供。

这是正确的控件吗？

在决定之前，请考虑以下问题：

• 高效枚举所有有效值是否可行？ 如果是这样，请考虑 使用单选列表、 列表视图、 下拉列表、可编辑下拉列表或 滑块 。
• 有效数据是否完全不受限制？ 或者有效数据是否仅受格式 (受约束的长度或字符类型) ？ 如果是，请使用文本框。
• 该值是否表示具有常见专用控件的数据类型？ 示例包括日期、时间或 IPv4 或 IPv6 地址。 如果是，请使用相应的控件，例如日期控件而不是文本框。
• 如果数据为数值：
  • 用户是否将设置视为相对数量？ 如果是，请使用滑块。
  • 用户是否会从设置更改效果的即时反馈中获益？ 如果是这样，请使用滑块，可能与文本框一起使用。 例如，用户可以使用滑块轻松选择颜色，因为他们可以立即看到色调、饱和度或亮度值更改的影响。

设计概念

虽然文本框具有非常灵活的优点，但它们的缺点是约束最少。 可编辑文本框的唯一约束是：

• 可以选择设置最大字符数。
• 可以选择将输入限制为仅 (0 9) 的数字字符。
• 如果使用 旋转控件，则可以将旋转控件选项限制为有效值。

除了其长度和旋转控件的可选存在之外，文本框没有任何视觉线索来建议有效值或其格式。 这意味着依赖标签向用户传达此信息。 如果用户输入的文本无效，则必须使用错误消息处理错误。

一般情况下， 应使用受限制最多的控件。 使用不受约束的控件（如文本框）作为最后的手段。 也就是说，在考虑约束时，请记住全局用户的需求。 例如，限制为美国邮政编码的控件不会全球化，但接受任何邮政编码格式的不受约束的文本框是 。

使用模式

文本框是具有多种用途的灵活控件。

Label	值
数据输入 用于输入或编辑短字符串的单行无约束文本框。	无约束的单行文本框。
格式化数据输入 一组用于以特定格式输入数据的短、固定大小的单行文本框。	用于格式化数据输入的文本框。 注意：自动退出功能会自动将输入焦点从一个文本框推进到下一个文本框。 此方法的一个缺点是无法将数据复制或粘贴为单个单元。
辅助数据输入 用于输入或编辑字符串的单行无约束文本框，并结合可帮助用户选择有效值的命令按钮。	在此示例中，浏览命令可帮助用户选择有效值。
文本输入 用于输入或编辑长字符串的多行无约束文本框。	无约束的多行文本框。
数字输入 用于输入或编辑数字的单行纯数字文本框，具有可选的 自旋控件 ，以便于基于鼠标的输入。	用于数字输入的文本框。 文本框及其关联的旋转控件的组合称为 旋转框。
密码和 PIN 输入 用于安全输入密码和 PIN 的单行无约束文本框。	用于输入密码的文本框。
数据输出 一个单行只读文本框，始终不带边框显示，用于显示短字符串。	与静态文本不同，如果数据比控件) 、选择和复制的控件宽，则可以滚动使用文本框显示的数据 (有用。 用于显示数据的单行只读文本框。
文本输出 用于显示长字符串的多行只读文本框。	用于显示数据的只读文本框。

准则

常规

• 禁用文本框时，还要禁用任何关联的标签、指令标签、旋转控件和命令按钮。

• 使用自动完成来帮助用户输入可能重复使用的数据。 示例包括用户名、地址和文件名。 但是，对于可能包含敏感信息（如密码、PIN、信用卡号码或医疗信息）的文本框，请勿使用自动完成。

• 不要让用户不必要地滚动。 如果预期数据大于文本框，并且你可以轻松地在不损害布局的情况下使文本框变大，请调整框的大小以消除滚动的需要。

  不正确：

  

  在此示例中，文本框应更长的时间来处理其数据。

• 滚动条：

  • 不要在多行文本框上放置水平滚动条。 请改用垂直滚动和换行。
  • 不要在单行文本框上放置任何滚动条。

• 对于数值输入，可以使用旋转控件。 对于文本输入，请改用下拉列表或可编辑下拉列表。

• 请勿使用自动退出功能，格式化数据输入除外。 焦点的自动转移可能会给用户带来惊喜。

可编辑文本框

• 如果可以，请限制输入文本的长度。 例如，如果有效输入是介于 0 和 999 之间的数字，请使用限制为 3 个字符的数字文本框。 使用格式化数据输入的文本框的所有部分都必须具有较短的固定长度。

• 灵活处理数据格式。 如果用户可能使用各种格式输入文本，请尝试处理所有最常见的格式。 例如，可以使用可选空格和标点符号输入许多名称、数字和标识符，而大写通常并不重要。

• 如果无法处理可能的格式，请使用带格式的数据输入要求特定格式，或者在标签中指示有效格式。

  可以接受：

  

  在此示例中，文本框需要特定格式的输入。

  良好：

  

  在此示例中，格式化数据输入模式用于要求特定格式。

  最好：

  

  在此示例中，文本框处理所有可能的格式。

• 选择最大输入长度时，请考虑格式灵活性。 例如，有效的信用卡数字最多可以使用 19 个字符，因此将长度限制为较短的长度会使使用较长格式输入数字变得困难。

• 如果用户更有可能粘贴较长的复杂数据，请不要使用格式化数据输入模式。 相反，对于用户更可能键入数据的情况，请保留格式化数据输入模式。

  

  在此示例中，不使用格式化的数据输入模式，因此用户可以粘贴 IPv6 地址。

• 如果用户更有可能重新输入整个值，请选择输入焦点上的所有文本。 如果用户更有可能进行编辑，请将插入点放在文本的末尾。

  

  在此示例中，用户更有可能替换而不是编辑，因此在输入焦点上选择整个值。

  

  在此示例中，用户更有可能添加关键字而不是替换文本，因此插入符号放置在文本的末尾。

• 如果新行字符是有效输入，请始终使用多行文本框。

• 当文本框用于文件或路径时，请始终提供“浏览”按钮。

数字文本框

• 选择最方便的单位并标记单位。 例如，请考虑使用毫升而不是升 (反之亦然) 、百分比而不是直接值 (，反之亦然) ，等等。

  正确：

  

  在此示例中，单位已标记，但它要求用户输入十进制数。

  良好：

  

  在此示例中，文本框使用更方便的单元。

• 每当旋转控件有用时，请使用它。 但是，有时旋转控件不切实际，例如当用户需要输入许多大型数字时。 在以下情况下使用旋转控件：

  • 输入可能是一个小数字，通常小于 100。
  • 用户可能会对现有数字进行小幅更改。
  • 用户更有可能使用鼠标而不是键盘。

• 每当出现时，右对齐数字文本：

  • 有多个数字文本框。
  • 文本框垂直对齐。
  • 用户可能会添加或比较值。

  正确：

  

  在此示例中，数值文本右对齐，以便于比较值。

  不正确：

  

  在此示例中，数字文本不正确地左对齐。

• 始终右对齐货币值。

• 不要将特殊含义分配给特定数值，即使应用程序在内部使用这些特殊含义也是如此。 请改用检查框或单选按钮进行显式用户选择。

  不正确：

  

  在此示例中，值 -1 具有特殊含义。

  正确：

  

  在此示例中，检查框使选项显式。

密码和 PIN 输入

• 始终使用密码通用控件，而不是创建自己的控件。 密码和 PIN 需要特殊处理才能安全处理。

有关更多指南和示例，请参阅 气球。

文本输出

• 请考虑对大型多行只读文本使用白色背景系统颜色。 白色背景使文本更易于阅读。 灰色背景上的大量文本会阻止阅读。

有关背景色的详细信息，请参阅 字体。

数据输出

• 不要对单行只读文本框使用边框。 边框是文本可编辑的视觉线索。
• 不要禁用单行只读文本框。 这会阻止用户选择文本并将其复制到剪贴板。 它还可防止用户在数据超出其边界大小时滚动数据。
• 不要在单行只读文本框上设置制表位，除非用户可能需要滚动或复制文本。

输入验证和错误处理

由于文本框通常不受限制，只能接受有效输入，因此可能需要验证输入并处理任何问题。 按如下所示验证各种类型的输入问题：

• 如果用户输入的字符无效，请忽略该字符并显示解释有效字符的 输入问题气球 。

  

  在此示例中，气球报告输入字符不正确。

• 如果输入数据的值或格式无效，请在文本框失去输入焦点时显示输入问题气球。

• 如果输入数据与窗口上的其他控件不一致，请在完成整个输入时（例如当用户单击模式对话框的“确定”时）发出错误消息。

除非用户无法轻松更正错误，否则不要清除无效的输入数据。 这样一来，用户就可以纠正错误，而无需从头开始。 例如，应清除不正确的密码和 PIN，因为用户无法轻松更正它们。

有关更多指南和示例，请参阅 错误消息 和 气球。

提示

提示符是放置在文本框内的标签或短指令作为其默认值。 与静态文本不同，一旦用户在文本框中键入内容或获得输入焦点，提示就会从屏幕上消失。

典型提示。

在以下情况下使用提示：

• 屏幕空间非常溢价，因此不需要使用标签或指令，例如在工具栏上。
• 提示主要用于以紧凑方式标识文本框的用途。 它不得是用户在使用文本框时需要查看的重要信息。

不要仅使用提示来指示用户键入内容或单击按钮。 例如，不要写入提示文本，指出“输入文件名”，然后单击“发送”。

使用提示时：

• 以斜体灰色绘制提示文本，以普通黑色绘制实际输入文本。 不得将提示文本与真实文本混淆。
• 使提示文本保持简洁。 可以使用片段而不是完整句子。
• 使用句式大写。
• 请勿使用结束标点符号或省略号。
• 提示文本不应是可编辑的，用户单击或按 Tab 进入文本框后应消失。
  • 例外： 如果文本框具有默认输入焦点，则会显示提示，并在用户开始键入后消失。
• 如果文本框在失去输入焦点时仍为空，则会还原提示文本。

建议的大小和间距

建议调整文本框的大小和间距。

文本框的宽度是预期输入大小的可视线索。 调整文本框大小时：

• 选择适合最长有效数据的宽度。 在大多数情况下，用户不必滚动将输入或查看的最长可能字符串。
• 对于要本地化的任何文本 (，请额外包含 30% (最多 200%的短文本) ，但不包括将本地化的数字) 。
• 如果预期的输入没有特定大小，请选择与窗口上其他文本框或控件一致的宽度。
• 调整多行文本框的大小以显示整型文本行数。

标签

文本框标签

• 所有文本框都需要标签。 将标签编写为单词或短语，而不是句子，以冒号结尾，并使用 静态文本。

  异常：

  • 包含提示的文本框位于空间的溢价位置。

  • 对于标记，一组用于 格式化数据输入 的文本框应视为单个文本框。

  • 如果文本框从属于单选按钮或检查框，并且由其标签以冒号结尾引入，请不要在文本框上添加其他标签。

  • 省略重述main指令的控件标签。 在这种情况下，main指令会将冒号 (，除非这是) 和访问密钥的问题。

    可以接受：

    

    在此示例中，文本框标签只是main指令的重述。

    良好：

    

    在此示例中，删除了冗余标签，因此main指令采用冒号和访问键。

• 分配唯一的访问密钥。 有关访问键分配指南，请参阅 键盘。

• 使用句式大写。

• 将标签置于文本框的左侧或上方，并将标签与文本框的左边缘对齐。 如果标签位于左侧，则标签文本与文本框文本垂直对齐。

  正确：

  

  

  在这些示例中，顶部的标签与文本框的左边缘对齐，左侧的标签与文本框中的文本对齐。

  不正确：

  

  

  在这些不正确的示例中，顶部的标签与文本框中的文本对齐，左侧的标签与文本框的顶部对齐。

• 可以指定 (单位，例如，在标签后的括号中) 秒或连接。

• 如果文本框接受任意较小的最大字符数，则可以在标签中声明最大输入。 文本框宽度还应建议最大大小。

  

  在此示例中，标签提供最大字符数。

• 不要将文本框的内容 (或其单位标签) 句子的一部分，因为这不可本地化。

• 如果文本框可用于输入多个项，请明确如何分隔标签中的项目。

  

  在此示例中，标签中提供了项分隔符。

• 有关指示所需输入的指南，请参阅 对话框中的必需输入。

指令标签

• 如果需要添加有关文本框的说明文本，请将其添加到标签上方。 使用带有结尾标点符号的完整句子。

• 使用句式大写。

• 其他有用但不需要的信息应保持简短。 将此信息放在标签和冒号之间的括号中，或在文本框下方不带括号。

  

  在此示例中，其他信息放置在文本框下方。

提示标签

• 使提示文本保持简洁。 可以使用片段而不是完整句子。
• 使用句式大写。
• 请勿使用结束标点符号或省略号。
• 如果提示指示用户输入将由文本框旁边的按钮操作的信息，只需将按钮放在文本框旁边即可。 不要使用提示指示用户单击按钮 (例如，不要写入提示文本，指出“拖动文件”，然后单击“发送) ”。

文档

引用文本框时：

• 使用类型引用需要键入或粘贴的用户交互;否则，如果用户可以使用其他方式（例如从列表中选择值或使用“浏览”按钮）将信息放入文本框中，请使用 enter。

• 使用 select 引用只读文本框中的条目。

• 使用确切的标签文本（包括其大写），并包含单词框。 不要包含访问键下划线或冒号。 不要将文本框称为文本框或字段。

• 如果可能，请使用加粗文本设置标签的格式。 否则，仅在需要时将标签置于引号中以防止混淆。

  示例 ：在“ 密码”框中键入密码，然后单击“ 确定”。

• 如果文本框需要特定格式，则仅记录最常用的可接受格式。 让用户自行发现任何其他格式。 希望灵活处理数据格式，但这样做不应产生复杂的文档。

  正确：

  使用 1234-56-7890 格式输入部件的序列号。

  不正确：

  使用以下任何格式输入部件的序列号：

  1234567890

  1234-56-7890

  1234 56 7890