前一篇：iOS 8人机交互指南（2）
3. 自适应性与布局（Adaptivity and Layout）
3.1 内置的自适应性（Build In Adaptivity）
People generally want to use their favorite apps on all their devices and in any orientation. In iOS 8 and later, you use size classes and Auto Layout to help you meet this expectation by defining how the layout of screens, view controllers, and views should adapt when the display environment changes. (The concept of display environment can refer to the entire device screen or only a portion of it, such as the area in a popover or the primary view in a split view controller.)
人们通常希望在他们所有的设备上、无论横屏竖屏，都能使用他们喜爱的 app。在 iOS 8 及之后，开发者可以使用尺寸类（size classes）和自动布局（Auto Layout）来辅助实现期望，这需要定义屏幕布局、视图控制器和视图如何随显示环境改变而自适应。（“显示环境”的概念指的是整个设备屏幕或者仅仅一部分，例如弹出框区域或者分开的视图控制器中的主要视图）
iOS defines two size classes: regular and compact. The regular size class is associated with expansive space and the compact size class is associated with constrained space. To characterize a display environment, you specify a horizontal size class and a vertical size class. As you might guess, an iOS device can use one set of size classes for portrait orientation and a different set of size classes for landscape.
iOS 定义了两种尺寸类：常规（regular）和紧密（compact）。常规尺寸类与可扩展空间相关，紧密尺寸类与约束空间相关。为了描述显示环境，可以指定一个水平尺寸类和一个垂直尺寸类。如你所想，一个 iOS 设备可以在竖屏和横屏使用不同的尺寸类集合。
iOS automatically makes various layout changes when the size classes of a display environment change. For example, when the vertical size class changes from compact to regular, navigation bars and toolbars automatically become taller.
When you rely on size classes to drive changes in the layout, your app can look great in any display environment. To learn how to work with size classes in Interface Builder, see Size Classes Design Help.
当显示环境的尺寸类发生变化时，iOS 自动进行多种布局变换。例如，当垂直尺寸类由紧密变为常规，导航栏和工具栏自动变高。
当开发者依赖尺寸类来驱动布局的改变，那么 app 可以在任何显示环境下都有不错的显示效果。参见 Size Classes Design Help 学习在 Interface Builder 中使用尺寸类的方法。
NOTE
Within a size class, continue to use Auto Layout to make small layout adjustments, such as stretching or condensing content.
注：在尺寸类里，可以继续使用自动布局来进行小的界面调整，例如延伸或紧缩内容。
The following concrete examples can help you visualize how size classes characterize the display environments of various devices. For example, iPad uses the regular size class in both dimensions and in both orientations. In other words, the iPad display environment is always horizontally and vertically regular.
下面具体的例子有助于可视化理解尺寸类如何描述多种设备上的显示环境。例如，iPad 无论尺寸大小还是横屏竖屏，都使用常规尺寸类。即，iPad 的显示环境总是水平常规且垂直常规。
The display environment of iPhone can vary depending on the device and its orientation.
iPhone 的显示环境随设备大小和横屏竖屏而变化。
（在竖屏时，iPhone 6 Plus 使用水平紧密和垂直常规的尺寸类；在横屏时，iPhone 6 Plus 使用水平常规和垂直紧密的尺寸类。）
All other iPhone models, including iPhone 6, use the same sets of size classes.
除 iPhone 6 Plus 之外的所有其他 iPhone 模型，包括 iPhone 6，都使用相同的尺寸类集合。
（在竖屏时，iPhone 6、iPhone 5、iPhone 4s 都使用水平紧密和垂直常规的尺寸类；在横屏时，这些设备都使用水平紧密和垂直紧密的尺寸类。）
3.2 各环境下均有美好体验（Provide a Great Experience in Each Environment）
When you take advantage of adaptivity, you can ensure that your UI responds appropriately to changes in the display environment. Follow these guidelines to give people a great experience on all devices and orientations.
充分利用自适应性，可以确保 UI 随显示环境变化而及时响应。遵循这些指南带给人们全设备、无论横屏竖屏的美好体验。
Maintain focus on the primary content in all environments. This is your highest priority. People use your app to view and interact with the content they care about. Changing the focus when the environment changes can disorient people and make them feel they’ve lost control over the app.
Avoid gratuitous changes in layout. A comparable experience in all environments lets people maintain their usage patterns when they rotate a device or run your app on a different device. For example, if you use a grid to display images in a horizontally regular environment, you don’t have to display the same information in a list in a horizontally compact environment, although you might adjust the dimensions of the grid.
所有环境下均聚焦于主要内容。这是最高优先级。人们使用 app 来查看他们关心的内容，并与之交互。如果当环境改变时改变聚焦，就会使用户迷惑，让他们觉得自己好像对 app 失去了掌控。
避免布局的无故改变。在所有的环境下，让人们在旋转设备或在不同设备上运行 app 时，仍然保持他们原有的使用模式，就能对比看出问题所在。例如，如果在水平常规环境下使用网格显示图片，那就不必在水平紧密环境下用列表形式显示同样的信息，虽然可以调整网格的尺寸来实现。
Be straightforward if your app runs in only one orientation. People expect to use your app in different orientations, and it’s best when you can fulfill that expectation. But if it’s essential that your app run in only one orientation, you should:
（1）Avoid displaying a UI element that tells people to rotate the device. Running in the supported orientation clearly tells people to rotate the device, if required, without adding unnecessary clutter to the UI.
（2）Support both variants of an orientation. For example, if an app runs only in landscape, people should be able to use it whether they’re holding the device with the Home button on the right or on the left. And if people rotate the device 180 degrees while using the app, it’s best if the app responds by rotating its content 180 degrees.
如果 app 只在横屏或者竖屏下运行，那就要明确说明。人们期待在横屏和竖屏下都能使用 app，所以实现时最好按此思路。但如果 app 确有必要只在横屏或者竖屏一种情况下运行，那么应该：
（1）避免显示会引导用户旋转设备的 UI 元素。如果需要的话，在被支持的方向运行时，清晰地告知用户旋转设备，而不要对 UI 增加不必要的干扰。
（2）支持一个方向上的变种。例如，如果 app 只在横屏上运行，那无论手持设备时 Home 键在左侧还是右侧，用户都能正常使用。如果人们使用 app 过程中旋转 180 度，app 里的内容最好也相应旋转 180 度。【译者注：“iDaily 2014 年度别册”（iphone 版）就是一个很好的例子来说明上面的问题】
If your app interprets changes in device orientation as user input, handle rotation in app-specific ways. For example, a game that lets people move game pieces by rotating the device can’t respond to device rotation by rotating the screen. In a case like this, you should launch in both variants of the required orientation and allow people to switch between the variants until they start the main task of the app. As soon as people begin the main task, begin responding to device movement in app-specific ways.
如果用户输入时，app 正在解析设备方向的改变，那就用 app 特有的方式处理旋转。例如，一个游戏让用户通过旋转设备来移动游戏块，这时不能响应设备来旋转屏幕。在这样的例子中，应该启动需要的方向上所有变种，然后允许用户在变种间切换，直到他们开始 app 的主要任务。一旦用户开始主任务，再开始使用 app 特有方式响应设备移动。
3.3 使用布局来交流（Use Layout to Communicate）
Layout encompasses more than just how UI elements look on an app screen. With your layout, you show users what’s most important, what their choices are, and how things are related.
Make it easy to focus on the main task by elevating important content or functionality. Some good ways to do this are to place principal items in the upper half of the screen and—in left-to-right cultures—near the left side of the screen:
布局不仅仅是控制 UI 元素如何显示在 app 屏幕上。布局向用户展示哪些是最重要的，拥有哪些选择，以及事情如何相互关联。
提升重要的内容和功能，从而使得用户易于聚焦主要任务。达成此目的有些好方法：把最重要的条目放在屏幕上半部分、靠近屏幕左侧（按照从左到右的习惯）：
Use visual weight and balance to show users the relative importance of onscreen elements. Large items catch the eye and tend to appear more important than smaller ones. Larger items are also easier for users to tap, which makes them especially useful in apps—such as Phone and Clock—that users often use in distracting surroundings.
使用可视化的重量和平衡来向用户展示屏幕元素的相对重要性。大条目引人注目，会比小条目看上去更重要。较大的条目也更易于用户点击，这使它们在 app 中尤其有用。例如它们在电话 app 和闹钟 app 中的应用就体现了它们的作用，因为用户经常在容易分心的环境中使用它们。
Use alignment to ease scanning and communicate groupings or hierarchy. Alignment tends to make an app look neat and organized and it gives users places to focus while they scroll through screenfuls of information. Indentation and alignment of different information groups indicate how the groups are related and make it easier for users to find specific items.
Make sure that users can understand primary content at its default size. For example, users shouldn’t have to scroll horizontally to read important text, or zoom to see primary images.
Be prepared for changes in text size. Users expect most apps to respond appropriately when they choose a different text size in Settings. To accommodate some text-size changes, you might need to adjust the layout; for more information about displaying text in your app, see Text Should Always Be Legible.
使用对齐以方便快速浏览，通过分组或分层进行交流。对齐有助于使 app 看上去整洁、有条理，在用户滚动浏览满屏的信息时也有位置可以聚焦。不同信息组的缩进和对齐展示了这些组是如何被关联的，也使用户易于找到特定条目。
确保用户在缺省大小时就能理解主要的内容。例如，用户不必水平滚动来阅读重要文本，或者缩放来看到主要的图像。
对文本大小变化有所准备。当用户在设置中选择了不同的文本大小时，他们希望大部分 app 能适当地响应。为了适应某些文本大小改变，可能需要调整布局。关于 app 中显示文本的更多信息参见 Text Should Always Be Legible。
As much as possible, avoid inconsistent appearances in your UI. In general, elements that have similar functions should also look similar. People often assume that there must be a reason for the inconsistencies they notice, and they’re apt to spend time trying to figure it out.
Make it easy for people to interact with content and controls by giving each interactive element ample spacing. Give tappable controls a hit target of about 44 x 44 points.
尽可能避免 UI 出现不一致。通常，具有相似功能的元素应该看上去也很相似。用户经常假设他们注意到的不一致之处必然有特别的原因，也容易花时间试图找出原因。
为每个可交互元素留出足够的空间，使得用户与内容和控件交互时更加容易。给每个可点击控件大约 44*44 像素的目标命中区域。
后一篇：iOS 8人机交互指南（4）
