Swift官方入门教程系列--三--解说Swift的视图控制器【翻译版，源代码】

源码见github：03_使用视图控制器

本例子是在FoodTracker应用的场景。学习使用图像选择器向场景中添加照片。完成后，您的应用程序将如下所示：

学习目标

在课程结束时，您将能够：

• 理解视图控制器生命周期及其回调（例如viewDidLoad，  viewWillAppear 和  viewDidAppear） 

• 在视图控制器间传递数据

• 关闭视图控制器

• 使用手势识别器生成事件

• 预期基于对象行为  UIView/ UIControl 类层次结构

• 使用资产目录将图像资产添加到项目

• 源码 
  

了解View Controller生命周期

到目前为止，FoodTracker应用具有单个场景，其用户接口是由一个单一管理视图控制器。为您打造更复杂的应用程序，你会创造更多的场景，将需要管理装卸的意见，因为它们可以打开和关闭屏幕上移动。

该的对象UIViewController类（及其子类）配备了一套管理其视图层次结构的方法。当视图控制器在状态之间转换时，iOS会在适当的时间自动调用这些方法。当你创建一个视图控制器子类（如ViewController您一直使用类），它继承中定义的方法UIViewController，让你添加自己的自定义行为每种方法。重要的是要了解系统何时调用这些方法，因此您可以设置或删除您在该过程中的适当步骤显示的视图 - 这是您以后在课程中需要做的。

的iOS调用UIViewController方法如下：

• viewDidLoad()在视图控制器的内容视图（其视图层次结构的顶部）创建并从故事板加载时调用。视图控制器的插座在调用此方法时保证具有有效值。使用此方法执行视图控制器所需的任何其他设置。

  通常情况下，iOS的要求viewDidLoad()只有一次，第一次创建它的内容视图时; 然而，当控制器第一次被实例化时，内容视图不一定被创建。相反，它懒洋洋地创建了第一次系统或任何代码访问控制器的view属性。

• viewWillAppear()刚刚在视图控制器的内容视图添加到应用程序的视图层次结构之前。使用此方法触发在内容视图显示在屏幕上之前需要发生的任何操作。尽管名称，只是因为系统调用此方法，它不保证内容视图将可见。视图可能被其他视图隐藏或隐藏。此方法简单地指示内容视图即将添加到应用程序的视图层次结构中。

• viewDidAppear()刚刚在视图控制器的内容视图添加到应用程序的视图层次结构之后。使用此方法触发任何需要在屏幕上显示视图时发生的操作，例如获取数据或显示动画。尽管名称，只是因为系统调用此方法，它不保证内容视图是可见的。视图可能被其他视图隐藏或隐藏。此方法仅表示内容视图已添加到应用程序的视图层次结构中。

存在一组互补的拆卸方法，如上面的状态转换图所示。

您将在FoodTracker应用程序中使用这些方法中的一些来加载和显示您的数据。事实上，如果你还记得，你已经写在代码的一些viewDidLoad()方法ViewController：

1. overridefuncviewDidLoad() {
2. super.viewDidLoad()
4. // Handle the text field’s user input through delegate callbacks.
5. nameTextField.delegate = self
6. }

应用程式设计的这种风格在这里视图控制器作为您的观点和数据模型之间的通信管道被称为MVC（模型-视图-控制器）。在这种模式下，模型跟踪您的应用程序的数据，视图显示您的用户界面和组成应用程序的内容，控制器管理您的意见。通过响应用户操作和填充与内容的看法数据模型，控制器作为模型和视图之间进行通信的网关。MVC是任何iOS应用程序的一个好设计的核心，到目前为止，FoodTracker应用程序是按照MVC原则构建的。

当你保持MVC模式记住的应用程序的设计的其余部分，是时候把你的基本用户界面到一个新的水平，并添加一个图像到膳食的场景。

添加膳食照片

完成膳食场景的下一步骤是添加显示特定膳食的照片的方式。为此，你需要使用的成像图（UIImageView），显示画面的用户界面元素。

向场景添加图像视图

1. 打开你的故事板，Main.storyboard。

2. 打开对象库中的实用面积。（或者，选择“视图”>“实用程序”>“显示对象库”。）

   

3. 在对象库中，类型image view在过滤器字段来快速寻找图像视图对象。

4. 将图像视图对象从对象库拖动到场景中，以使其位于按钮下方的堆栈视图中。

   

5. 随着图像视图中选择，打开大小检查在公用事业领域。

   回想一下，尺寸检查，当你从检查选择栏左侧选择第五个按钮出现。它允许您编辑故事板中对象的大小和位置。

   

6. 在“内部大小”字段中，选择占位符。（此字段位于“大小”检查器的底部，因此您需要向下滚动到该字段。）

7. 键入320在宽度和高度字段。按返回。

   视图的内在含量的大小是根据其内容视图的首选大小。空图像视图没有固有的内容大小。一旦向视图中添加图像，其内在内容大小就会设置为图像的大小。提供占位符大小使图像具有临时内在内容大小，您可以在设计用户界面时使用。此值仅在Interface Builder中设计接口时使用; 在运行时，布局引擎使用视图的实际内在内容大小。

   

8. 在画布的右下角，打开固定菜单。

   

9. 选中纵横比旁边的复选框。

   Pin菜单应该看起来像这样：

   

10. 在“固定”菜单中，单击“添加1约束”按钮。

    您的图片视图现在的宽高比为1：1，因此它始终是正方形。

11. 选择的图像视图中，打开属性检查器。

    回想一下，在属性检查器中，当你从检查选择栏中选择左边的第四个按钮会出现。它允许您编辑故事板中对象的属性。