用户需要以最简单的方式与应用界面进行交互。应该从用户的角度出发设计页面，使得界面更高效、简捷和直接。
storyboard以图形化的方式帮助你设计和实现界面。在设计和实现界面的过程中，你可以准确的看到你实现的界面是什么样的，界面上哪些东西合适，哪些东西不合适，以及你对界面随时的调整，都是一目了然的。
当你使用storyboard构建界面时，正如你在上一节教程中学习的那样，你一直都在与视图（View）打交道，视图（View）用于把内容显示给用户。视图（View）是用于构建用户界面，用于有效地、优雅地、清晰地展示内容的基本单元。如果你正在开发更为复杂的应用，那你可以使用多个场景和多个View。
视图层次结构
屏幕上，视图不会显示自己，也不会响应用户的输入，它们只能提供一个用于放置其它视图的窗口。于是，应用里的视图是由被称为视图层次结构的东东所管理的。视图层次结构定义了相对于其它视图的视图布局。在一个层次结构中，被包含在其它视图里的视图被叫做子视图，包含其它视图的视图被叫做父视图。即使一个视图里有多个子视图，它也只有且仅有一个父视图。
视图层次结构的顶层对象是window对象。它是UIWindow类的实例，它是屏幕上用于添加视图对象的基本容器。为了显示内容，你需要给window添加内容视图对象（内容视图对象作为window的子视图）。
内容视图和它的子视图对于用户来说，是可见的，内容视图也必须被插入到window的视图层次结构中。在你使用storyboard时，放置内容视图的位置已经为你自动配置好了。在应用被启动时，应用对象会加载storyboard，会创建有关的视图控制器类的实例，解压每个视图控制器里的视图层次，然后把作为开始的视图控制里的视图内容添加到window中。在下面的章节中，你会学习到如何管理视图控制器。现在，你需要把焦点聚集到如何在storyboard的单视图控制器中创建一个层次结构。
视图的类型
在你设计应用时，了解哪种意图下使用哪种视图是非常重要的。例如，如果你想收集用户的信息（比如是一段文本），你可以使用text field，如果你要显示一段静态的文字，你应该使用label。应用绘制时，使用UIKit框架的视图是比较容易创建的，这是因为你可以使用它们快速的装配出基本的界面来。一个UIKit框架的视图对象是UIView类或子类的实例。UIKit框架提供了不同类型的视图用于帮助你表现和组织数据。
尽管每个视图都有它自己特定的功能，但是总的来说，UIKit视图可以被归为这么几种类型：
| 视图类型 | 意图 | 举例 |
|
Content |
显示特定类型的内容，例如图片或文本 | Image view，label |
|
Collections |
显示集合或一组视图 | Collection view，table view |
|
Controls |
执行动作或显示信息 | Button，slider，switch |
|
Bars |
导航或执行动作 | Toolbar，navigation bar，tab bar |
|
input |
接收用户的文本输入 | search bar，text view |
|
Containers |
为其它视图提供容器 | View，scroll view |
| Modal | 中断应用正常的流程来让用户执行动作 | Action sheet，alert view |
你可以在Interface Builder中，用可视化的方式来装配视图。Interface Builder中提供了标准的view、control等库，这些东东在你构建界面时用得到。从这个库中拖出对象，把它们放置于画布中，然后用你自己的方式去安排它们。在保存之前，使用inspector来配置这些对象。你会马上看到结果，不需要写任何一行代码，你就可以运行程序了。
UIKit框架提供了标准的视图来显示各种类型的内容，你还可以继承UIView（或它的子类）来创建自己的视图。自定义的视图一定是UIView的子类，在自定义视图中，你需要自己处理所有的绘制事件，处理所有的事件句柄。在该教程中，你不会使用自定义视图，如果你有兴趣，你可以在Defining a Custom View一文中学习到如何实现自定义视图的更多知识。
使用storyboard放置视图
在可视化环境中，使用storyboard来放置自己的视图层次。storyboard提供了一个直接地、可视化地方式来让你操作视图，构建界面。
正如你在上一节教程中看到的那样，storyboard由场景组成，每个场景都关联着一个视图层次结构。从对象库中拖出一个视图并把它摆放在场景上，storyboard就会自动把它加入到当前场景的视图层次结构中。在视图层次结构中，视图的位置是由你决定的，你把视图放到哪里，它就在哪里显示。在你给场景添加完一个视图后，你可以在画布上对视图进行重设大小、配置、移动位置等操作。
画布上也可以显示界面上对象的视图大纲，它在画布的左边显示，你从大纲上就可以清楚的看到画布中对象的层次结构。
storyboard场景中创建的视图层次结构实际上是一系列被压缩的Objective-C对象。在运行时，这些对象被解压。解压的结果就是，你使用utility区域的inspector为相关类的实例设置的属性值的层次结构被展现出来。
正如你在上一节教程中学到的那样，在storyboard中，你工作的默认界面配置被应用为界面的各个版本。当你需要为特定的设备尺寸和方向调整你的界面时，你应该把这种变化指定给特定的尺寸类。尺寸类是在显示环境下，描述水平或垂直空间的高级方式，例如竖向的iPhone或横向的iPad。有两种类型的尺寸类：普通地、紧凑地。展示环境的特点是一对尺寸类，一个描述了水平空间，一个描述了垂直空间。在画布上，你可以使用尺寸类控制器，为普通尺寸和紧凑尺寸的结合来预览和编辑界面。
在本教程中，你没有在特定的尺寸下工作，但是，如果你对尺寸类很好奇，请阅读Size Classes Design Help章节。
使用Inspector来配置视图
utility区域，对象库上方的inspector面板中显示的内容如下：
每个inspector的元素都为界面上的元素提供了重要的配置选项。当你选择了一个对象（例如一个视图），inspector会根据你选择的对象，更新面板里的属性，你就可以对属性进行设置了。
1. File：指定storyboard的一般通用信息。
2. Quick Help：获取该对象相关的有用信息。
3. Identity：为该对象指定自定义的类，定义它可访问的属性。
4. Attributes：自定义对象的可视化属性。
5. Size：指定对象的尺寸和Auto Layout属性。
6. Connections：在界面和源码之间创建连接。
在前一节教程中，你使用了Attributes inspector。在教程剩下的部分中，你会继续使用其它的inspector来配置视图和对象。尤其是，使用Attributes inspector来配置视图，使用Identity inspector来创建视图控制器，使用Connections inspector在视图和视图控制器之间创建连接。
使用Auto Layout定位视图
当你在storyboard中开始定位视图时，你需要考虑各种各样的情况。IOS应用运行在数量众多的不同设备上，这些设备的屏幕尺寸不同，方向不同，语言不同等等。你需要动态的界面，当设备的屏幕尺寸、方向、本地化、度量等发生变化时，界面应该可以无缝的响应。
如果你已经学习了上一节教程，你会看到，Xcode提供了名为Auto Layout的工具来帮助你创建通用的、适配性强的界面。Auto Layout是解释视图之间关系的系统。在单个视图上或多个视图之间，它会让你定义一系列的约定。
点击画布右下方的Auto Layout图标，来给画布上的视图添加不同类型的约定，解决布局问题，检查用于约束行为的约定。
1.
Align：创建行或列的约束。例如把一个视图放置于容器的中间，或者把一个视图放于某两个视图的左边。
2.
Pin：创建空间约束。例如定义视图的高度，或者指定它离另外一个视图的水平距离。
3.
Resolve Auto Layout Issues：基于建议，通过添加或重设约束来解决布局问题。
4.
Resizing Behavior：指定大小重新设定后如何影响约束。
此时，对于在ToDoList应用中你创建的简单页面来说，你不需要学习Auto Layout中进一步的知识。因为，应用的界面很复杂，你就需要添加不同的约束来精确的指定，在不同的设备和方向下，界面应该如果摆放视图。在教程的最后，会有一个指向Auto Layout教程的链接，这个教程会帮助你使用约束来定义更为复杂的自适应的界面。