本节书摘来自异步社区《ios 9 开发指南》一书中的第6章，第6.8节实战演练——将设计界面连接到代码，作者 管蕾，更多章节内容可以访问云栖社区“异步社区”公众号查看
6.8 实战演练——将设计界面连接到代码
ios 9 开发指南
经过本章前面内容的学习，已经掌握了创建界面的基本知识。但是如何才能使设计的界面起作用呢？在本节的内容中，将详细讲解将界面连接到代码并让应用程序运行的方法。
6.8.1 打开项目
首先，我们将使用本章projects文件夹中的项目“lianjie”。打开该文件夹，并双击文件“lianjie.xcworkspace”，这将在xcode中打开该项目，如图6-26所示。
加载该项目后，展开项目代码编组（disconnected），并单击文件mainstoryboard.storyboard，此故事板文件包含该应用程序将把它显示为界面的场景和视图，并且会在interface builder编辑器中显示场景，如图6-27所示。
由图6-27所示的效果可知，该界面包含了如下4个交互式元素。
一个按钮栏（分段控件）。
一个按钮。
一个输出标签。
一个web视图（一个集成的web浏览器组件）。
但是到目前为止，还没有将界面连接到应用程序代码，因此执行后只是显示一张漂亮的图片。为了让应用程序能够正常运行，需要将创建到应用程序代码中定义的输出口和操作的连接。
6.8.2 输出口和操作
输出口（outlet）是一个通过它可引用对象的变量，假如interface builder中创建了一个用于收集用户姓名的文本框，可能想在代码中为它创建一个名为username的输出口。这样便可以使用该输出口和相应的属性获取或修改该文本框的内容。
操作（action）是代码中的一个方法，在相应的事件发生时调用它。有些对象（如按钮和开关）可在用户与之交互（如触摸屏幕）时通过事件触发操作。通过在代码中定义操作，interface builder可使其能够被屏幕对象触发。
我们可以将interface builder中的界面元素与输出口或操作相连，这样就可以创建一个连接。为了让应用程序disconnected能够成功运行，需要创建到如下所示的输出口和操作的连接。
colorchoice：一个对应于按钮栏的输出口，用于访问用户选择的颜色。
getflower：这是一个操作，它从网上获取一幅花朵图像并显示它，然后将标签更新为选择的颜色。
choosedcolor：对应于标签的输出口，将被getflower更新以显示选定颜色的名称。
flowerview：对应于web视图的输出口，将被getflower更新以显示获取的花朵图像。
6.8.3 创建到输出口的连接
要想建立从界面元素到输出口的连接，可以先按住control键，并同时从场景的view controller图标（它出现在文档大纲区域和视图下方的图标栏中）拖曳到视图中对象的可视化表示或文档大纲区域中的相应图标。读者可以尝试对按钮栏（分段控件）进行这样的操作。在按住control键的同时，再单击文档大纲区域中的view controller图标，并将其拖曳到屏幕上的按钮栏。拖曳时将出现一条线，这样让我们能够轻松地指向要连接的对象。
当松开鼠标时会出现一个下拉列表，在其中列出了可供选择的输出口，如图6-29所示。再次选择“选择颜色”。
因为interface builder知道什么类型的对象可以连接到给定的输出口，所以只显示适合当前要创建的连接的输出口。对文本“你的颜色”的标签和web视图重复上述过程，将它们分别连接到输出口chosencolor和flowerview。
在我们这个演示工程中，其核心功能是通过文件viewcontroller.m实现的，其主要代码如下所示：
6.8.4 创建到操作的连接
选择将调用操作的对象，并单击utility区域顶部的箭头图标以打开connections inspector（连接检查器）。另外，也可以选择菜单view→utilities→show connections inspector（option+ command+6）。
connections inspector显示了当前对象（这里是按钮）支持的事件列表，如图6-30所示。每个事件旁边都有一个空心圆圈，要将事件连接到代码中的操作，可单击相应的圆圈并将其拖曳到文档大纲区域中的view controller图标。
假如要将按钮“送给我花”连接到方法getflower，可选择该按钮并打开connections inspector（option+command+6）。然后将touch up inside事件旁边的圆圈拖曳到场景的view controller图标，再松开鼠标。当系统询问时选择操作getflower，如图6-31所示。
在建立连接后检查器会自动更新，以显示事件及其调用的操作。如果单击了其他对象，connections inspector将显示该对象到输出口和操作的连接。到此为止，已经将界面连接到了支持它的代码。单击xcode工具栏中的run按钮，在ios模拟器或ios设备中便可以生成并运行该应用程序，执行效果如图6-32所示。