[ISUX转译]iOS7人机界面指南-UI元素(下)

译者注：

本次主要翻译了iOS Human Interface Guideline的Part 4-UI Element的后半部分，包括控件(Controls)和临时视图(Temporary Views)。本次翻译与截至2013年10月20日的苹果官方文档相匹配。如您在阅读中发现任何疏漏，恳切地希望您提出宝贵的意见和建议，感谢。

重要：这是一份针对API或其它相关技术开发而准备的预备文档。尽管文档在专业精确程度上已经过多次审查，它仍不是最终版本。文档仅供已注册苹果开发者计划的开发者使用。苹果提供这份文档的目的，是帮助开发者根据文档来规划自身应用的开发技术与界面设计。这些信息将可能发生变化，您的应用也应当根据最新的操作系统与最终文档进行相应的调整。该文档可能会由于API与相关技术的发展而更新版本。

xa0

控件(Controls)

活动指示器(Activity Indicator)

活动指示器表明任务或进程正在进行中，如下图所示。

API提示：想要了解如何在代码中定义活动指示器，可以参考 UIActivityIndicatorView Class Reference.

活动指示器：

当任务进行和加载时旋转，任务完成后自动消失
不支持用户交互行为

在工具栏或主视图中使用活动指示器来告知用户任务或加载正在进行中，但并不提示该过程何时会结束。

不要使用静止的活动指示器。用户会以为该进程停滞了。

用活动指示器来让用户知道进程仍在进行中。有些时候，告诉用户进程没有停止比告诉他们何时完成更加重要。

可以的话，最好可以设计一个与应用的风格协调的活动指示器。

添加联系人按钮(Contact Add Button)

添加联系人按钮让用户将现有联系人添加到文本框或者其它文字视图中。

API提示：想要了解如何在代码中国定义添加联系人按钮，参考 Buttons.

xa0添加联系人按钮：

展示联系人列表
帮助用户将一个联系人添加到当前联系人按钮所在的视图中

使用添加联系人按钮让用户在不需要使用键盘的情况下就可以方便地访问到联系人。举个例子，在新建邮件的界面中，用户可以点击该按钮来添加收件人，而不需要用键盘输入收件人的名字。

由于添加联系人按钮属于键盘输入联系人方法的替代品，我们不推荐在不支持键盘输入的界面中使用添加联系人按钮。

日期时间选择器(Date Picker)

日期时间选择器展示关于日期和时间的组件，比如小时，分钟，天，以及年。

API提示：想要了解如何在代码中定义日期选择器，请参考xa0 Date Pickers.

日期时间选择器：

最多可以展示4个独立的滑轮，每一个滑轮表示一个不同的值，比如月份或小时等
在每个滑轮的中央使用深色字体来表示当前选中的值
日期时间选择器的大小与iPhone键盘的大小相同，并且不可更改
包括四种模式，每一种模式代表了一组不同的值：

· 日期和时间。日期和时间模式（默认模式）包含日期、小时、和分钟，以及一个可选的AM/PM值。

· 时间。时间模式包括小时和分钟，以及可选的AM/PM值。

· 日期。日期模式包括月份，天以及年三个值。

· 倒计时器。倒计时器模式展示了小时和分钟值。你可以精确地设定总共的倒计时间，倒计时的最大值为23小时59分钟。

使用日期时间选择器来让用户选择时间，而不是让用户自己输入一个包含了日期、时间等多个部分的时间值。

尽量地让用户在当前内容中使用日期选择器。最好避免用户在使用日期选择器的时候要进入另外一个界面。在iPad上，日期时间选择器可能会出现在一个浮层中，或者嵌入在当前内容里。

有必要的时候，改变分钟滑轮的单位刻度。在默认情况下，分钟滑轮包含从0到59共60个值，如果你要展示一个颗粒度较大的时间，你可以让分钟滑轮的单位刻度变大，只要这个刻度可以整除60。比如说你可能会设定每15分钟为一个刻度，此时分钟滑轮就有4个值，0、15、30、45。

详情展开按钮(Detail Disclosure Button)

详情展开按钮展示了与该项相关的更多详细信息与功能描述。

API提示：想要了解如何在代码中定义详情展开按钮，可以参考xa0 UITableViewCell Class Referencexa0和xa0Buttons.

详情展开按钮以一个单独的视图展示特定项目的更多详情信息与功能。

当详情展开按钮在表格行中出现时，点击表格行的其它区域不会激活此按钮，只会选中该行，或者触发app中其它自定义的行为。

一般来说，你会在一个表格视图中使用详情展开按钮来让用户知道更多关于这个列表项的信息。当然你也可以将这个按钮用在其它类型的视图中来为用户展示更多与特定项目相关的信息和功能。

信息按钮(Info Button)

信息按钮展示了app的配置信息，有时候它会出现在当前视图的背面。

API提示：想要了解如何在代码中定义信息按钮，可以参考 Buttons.

iOS包含了两种信息按钮样式：适用于浅色内容上的深色按钮，以及适用于深色内容上的浅色按钮。

使用信息按钮来显示app的配置信息或选项。你可以根据自己app的UI风格来选择最为协调的信息按钮样式。

标签(Label)

标签用于放置静态文本。

API提示：想要了解如何在代码中定义标签，可以参考 UILabel Class Reference.

标签可以：

展示任意数量的静态文本
禁止除了复制文本外的任何用户交互行为

你可以使用标签来命名或解释你的部分UI，又或者用它来给用户提供一些简单的信息。标签最适合拿来展示相对简单的文本信息。

保证你的标签清晰易读。最好支持动态文本(Dynamic Type)，并使用xa0UIFontxa0中的preferredFontForTextStyle来获得标签中的展示文本。如果你要用自定义字体的话，请慎重选择字体种类，不要以牺牲清晰度为代价来换取花哨的颜色和字体效果。（想要了解关于app中字体使用的指南，可以参考xa0Color and Typography;想要了解更多动态文本的内容，可以参考xa0Text Programming Guide for iOSxa0里面的xa0Text Stylesxa0部分。）

网络活动指示器(Network Activity Indicator)

网络活动指示器在状态栏中出现，表示网络活动正在进行。

API提示：你可以在代码中使用xa0UIApplicationxa0Methodxa0 networkActivityIndicatorVisiblexa0来控制该活动指示器的可见性。

网络活动指示器：

出现在状态栏中，当网络活动正在进行时它会旋转，在活动停止时它则消失
不支持用户交互行为

当你的app正在链接网络，而这个连接过程将会持续好几秒的时候，你可以通过网络活动指示器来给用户以反馈。如果进程所需时间很短，则不需要用到它，因为很可能在用户注意到它之前，它就消失了。

页面控件(Page Control)

页面控件告诉用户当前共打开了多少个视图，还有他们正处在其中哪一个。

API提示：想要了解如何在代码中定义页面控件，可以参考xa0 Page Controls.

页面控件：

包含一系列圆点，圆点的个数代表了当前打开的视图数量（从左到右，这些圆点代表了视图打开的先后顺序）。
默认情况下，使用不透明点来标识当前打开的视图，使用半透明点来表示所有其它视图。
不支持用户访问不连续的视图
当视图数量超过页面宽度可承载的氛围时，点的大小和间距并不会因此变小，如果需要显示的点超过一定数量，系统会把它截断。

当你的app中所有的视图都属于同级的时候，你可以使页面控件。

当你的app结构存在信息层级，请不要使用页面控件。因为页面控件不能让用户跟踪自己的访问路径，回到上一级。

将页面控件垂直居中放置于当前打开视图的底边与屏幕底边之间，这样可以保证它的可见性而又不会对内容造成干扰。避免展示太多的点，一般来说，iPhone竖屏方向最多可以容纳差不多20个点。

选择器(Picker)

选择器展示了一组值，用户可以从中选择一个。

API提示：想要了解如何在代码中定义选择器，请参考 UIPickerView Class Reference.

选择器：

是日期时间选择器的通用模式
包括一个或多个滑轮，每个滑轮含有一组值
当前选中的值在中间，以深色标识
不可以自定义大小（选择器的大小与iPhone的键盘相同）

使用选择器可以让用户更容易从一系列不同的值中间进行选择。

一般来说，当用户对整组值都比较熟悉的时候，可以使用选择器。由于当滑轮静止的时候，大部分的数值会被隐藏，最好是在用户对所有数值均有预期的情况下才使用选择器。当你需要展示一大组用户并不熟悉的选项，此种选择器可能不太适合。

尽可能让让用户在当前视图中使用选择器。不要让他们在使用选择器时还要进入其它的视图。

如果你需要展示的备选项数量很多，考虑使用表格视图(Table View)而不是选择器。因为表格视图的高度较大，内容滚动起来会更快。

进度视图（Progress View）

进度视图展示了任务或进程的进度（下图是iOS默认邮件App的工具栏）。

xa0进度视图：

是一条轨迹，随着进程的进行从左向右进行填充
不支持用户交互行为

iOS定义了两种进度视图样式：

默认(Default).默认样式适合用在app的主要内容区中。
进度条(Bar).此样式比默认样式细，适合用在工具栏中。

当一个任务存在明确的进程，可以使用进度条来给与用户反馈，尤其是告诉用户这个任务大约需要多少时间才能完成。

可以的话，请根据你的app的风格来设计进度条的外观。你可以自定义进度条的底色以及轨迹颜色，也可以直接使用图片。

刷新控件(Refresh Control)

刷新控件执行用户触发的内容刷新——一个典型的例子，它常在表格中出现（下图展示的是iOS默认的邮件app的mailbox列表页）。

API提示：想要了解如何在代码中定义刷新控件，请参考xa0 UIRefreshControl Class Reference.

刷新控件：

看起来类似活动指示器
可以出现在标题中
默认状态下不可见，当用户在表格上缘往下拖拽以刷新内容时才出现

就算你使用了刷新控件，也不要因此就不支持内容自动刷新。尽管用户喜欢在执行刷新操作时内容立刻刷新，他们也同样会喜欢内容自动刷新。如果过于一来用户自己执行所有刷新操作的话，那些不会自动刷新的用户就会疑惑，为何你app中的数据永远都不更新。一般来说，刷新控件给了用户多一个选择，让他们可以立刻获得最新的内容，但同时，你也不能奢望用户会主动获取所有的更新信息。

只有在必要的时候才加短标题。特别需要注意的是，不要使用短标题来描述刷新控件怎么使用。

圆角矩形按钮(Rounded Rectangle Button)

iOS 7已经不再使用圆角矩形按钮，而是使用了新的系统按钮——类型为UIButtonTypeSystem的UI按钮(UIButton).使用指南可参考xa0System Button.

分段控件(Segmented Control)

分段控件是一组分段的线性集合，每一个分段的作用类似按钮，点击之后将切换到相应的视图。

API提示：想要了解如何在代码中定义分段控件，请参考xa0 Segmented Controls.

分段控件：

由两个或以上的分段组成，每一个分段的宽度相同，与分段的数量成比例（分段数量越多，则宽度越小）；
可以包含文字或者图片

使用分段控件来提供密切相关而又互斥的选项。

保证每个分段都容易点击。为了保证每个分段的大小有至少44×44像素，请控制分段的数量。在iPhone上，1个分段控件最多包含5个分段。

尽可能地保持每个分段中的文字长度一致。因为每个分段都是等宽的，当文本长度差异很大时看上去会很不协调。

不要在同一个分段控件中混用文字和图片。每一个分段都仅可支持纯文字或纯图片。避免在同一个分段控件中，一些分段里使用纯文字，另一些分段里使用纯图。

如果你自定义了分段控件的外观，请在必要时调整分段控件中文本的对齐方式。如果你给分段控件添加了自定义底图，请确保控件里自动居中的文本依然清晰美观。你可以通过bar metrics APIs 来调整分段控件内文本的对齐方式(想要了解如何定义bar metrics，可以参考 UISegmentedControlxa0中关于自定义API外观(appearance-customization APIs)的描述)。