在本章中，您將要編寫一個名為 Quiz 的 iOS應(yīng)用程序。 此應(yīng)用程序?qū)@示一個問題疲陕，然后在用戶點擊按鈕時顯示答案盟迟。 點擊另一個按鈕將向用戶顯示一個新問題（圖1.1）。

圖1.1您的第一個應(yīng)用程序：Quiz

當(dāng)您編寫iOS應(yīng)用程序時，您必須想到兩個基本問題：

1. 如何正確創(chuàng)建和配置對象？ （例如：“我想要一個 Next Question 按鈕”。）
2. 如何使我的應(yīng)用程序響應(yīng)用戶交互鼠哥？ （例如：當(dāng)用戶點擊按鈕時，我希望這段代碼被執(zhí)行看政∑涌遥“）

這本書大部分都是為了回答這些問題。

創(chuàng)建一個Xcode項目

打開 Xcode允蚣，然后從 File 菜單中選擇 New→ Project....（如果 Xcode 自動打開到歡迎界面于颖，請直接選擇 Create a new Xcode project。

將出現(xiàn)一個新的工作區(qū)窗口嚷兔，工作表將從工具欄向下滑動森渐。 在頂部，找到 iOS 部分冒晰，然后找到 Application 區(qū)域（圖1.2）同衣。 被有好幾個應(yīng)用模板供您選擇。 選擇 Single View Application壶运。

圖1.2創(chuàng)建項目

這本書是為 Xcode 8.1 創(chuàng)建的耐齐。 這些模板的名稱可能隨著新的 Xcode 版本而改變。 如果您沒有看到 Single View Application 模板蒋情，請使用看起來最簡單的模板埠况。

單擊 Next，然后在下一個工作表 Product Name 中輸入 Quiz（圖1.3）棵癣。接著是組織名稱和標(biāo)識符辕翰。 您可以使用 Big Nerd Ranch 或任何您想要的組織名稱。 對于組織標(biāo)識符狈谊，您可以使用 com.bignerdranch* 或 *com.yourcompanynamehere喜命。

從 Language 彈出菜單中沟沙，選擇 Swift，然后從 Devices 彈出菜單中選擇 Universal壁榕。 確保未選中 Use Core Data 復(fù)選框矛紫。

圖1.3配置新項目

單擊 Next，在最后的工作表中护桦，將項目保存到你計劃好的存儲本書中例子的目錄中含衔。 單擊 Create 以創(chuàng)建 Quiz 項目煎娇。

您的新項目將在Xcode工作區(qū)窗口中打開（圖1.4）二庵。

圖1.4 Xcode工作區(qū)窗口

工作區(qū)窗口的左側(cè)是 導(dǎo)航區(qū)域(navigator area) 。 該區(qū)域顯示不同的導(dǎo)航器 - 顯示項目不同部分的工具缓呛。 您可以通過選擇導(dǎo)航器選擇器中的一個圖標(biāo)來打開導(dǎo)航器催享，導(dǎo)航器選擇器是導(dǎo)航器區(qū)域上方的欄。

當(dāng)前打開的導(dǎo)航器是項目導(dǎo)航器哟绊。 項目導(dǎo)航器顯示構(gòu)成項目的文件（圖1.5）因妙。 您可以選擇其中一個文件，以在導(dǎo)航區(qū)域右側(cè)的編輯器區(qū)域中打開它們票髓。

項目導(dǎo)航器中的文件可以分組到文件夾中攀涵，以幫助您組織項目。 模板為您創(chuàng)建了幾個組洽沟。如果需要以故，您可以重命名它們，或者添加新組裆操。 這些組只是用于組織文件怒详，并且不以任何方式與文件系統(tǒng)相關(guān)。

圖1.5項目導(dǎo)航器中的Quiz應(yīng)用程序文件

模型 - 視圖 - 控制器

在開始應(yīng)用程序之前踪区，讓我們來討論應(yīng)用程序架構(gòu)中的一個關(guān)鍵概念： Model-View-Controller 或 MVC昆烁。 MVC 是iOS開發(fā)中使用的一種設(shè)計模式。 在 MVC 中缎岗，每個實例都屬于模型層静尼，視圖層或控制器層。 （這里的層簡單地指一個或多個符合相同規(guī)則的對象传泊。）

• 模型層(model layer) 保存數(shù)據(jù)茅郎，不了解用戶界面或 UI。 在 Quiz 中或渤，模型將由兩個有序的字符串列表組成：一個用于提問系冗，另一個用于解答。通常薪鹦，模型層中的實例代表用戶世界中的真實事物掌敬。 例如惯豆，當(dāng)您為保險公司編寫應(yīng)用程序時，您的模型幾乎肯定會包含一個名為 InsurancePolicy 的自定義類型奔害。
• 視圖層(view layer) 包含對用戶可見的對象楷兽。按鈕，文本字段和滑塊就是視圖對象或視圖的示例华临。 ?視圖對象(view objects) 組成應(yīng)用程序的UI芯杀。 在 Quiz 中，顯示問題和答案的標(biāo)簽及其下的按鈕都是視圖對象雅潭。
• 控制器層(controller layer) 是應(yīng)用程序管理的地方揭厚。 控制器對象或控制器是應(yīng)用程序的管理器。 控制器配置用戶看到的視圖扶供，并確保視圖和模型對象保持同步筛圆。 一般來說，控制器通常處理“然后呢椿浓？”問題太援。 例如，當(dāng)用戶從列表中選擇一個項目時扳碍，控制器確定用戶接下來看到什么提岔。

圖1.6顯示了響應(yīng)于用戶輸入的應(yīng)用程序中的控制流程，例如用戶點擊按鈕笋敞。

圖1.6 MVC模式

請注意碱蒙，模型和視圖不直接相互交流; 控制器正好位于它們的中間，接收消息和調(diào)度指令液样。

設(shè)計Quiz程序

您將使用MVC模式編寫 Quiz 應(yīng)用程序振亮。 以下是您將要創(chuàng)建和使用的實例的清單：

• 模型層將由 [String] 的兩個實例組成。
• 視圖層將由 UILabel 的兩個實例和 UIButton 的兩個實例組成鞭莽。
• 控制器層將由 ViewController 的一個實例組成坊秸。

圖1.7Quiz對象圖

圖1.7是 Quiz 應(yīng)用程序如何工作的大圖。 例如澎怒，當(dāng)點擊 Next Question 按鈕時褒搔，它將觸發(fā) ViewController 中的一個方法。 一個方法就是一個函數(shù)——要執(zhí)行的指令列表喷面。 該方法將從問題陣列中檢索一個新問題星瘾，并要求頂部標(biāo)簽顯示該問題。

這圖表在這章結(jié)整前看起來沒多大意義惧辈，這并不影響后面的學(xué)習(xí)琳状。 在構(gòu)建應(yīng)用程序的時候，請返回這參考這張圖來查看應(yīng)用程序的流程盒齿。

您將逐步構(gòu)建 Quiz 程序念逞，先從應(yīng)用程序的可視化界面開始困食。

界面生成器

您正在使用 Single View Application 模板，因為它是 Xcode 提供的最簡單的模板翎承。 不過硕盹，這個模板有很大的魔力，因為已經(jīng)為您設(shè)置了一些關(guān)鍵組件叨咖。 現(xiàn)在瘩例，您只需使用這些組件，而不用深入了解它們的工作原理甸各。 本書的其余部分將會關(guān)注這些細節(jié)垛贤。

在項目導(dǎo)航器中，單擊一次 Main.storyboard 文件痴晦。 Xcode 將打開其稱為 Interface Builder 的圖形樣式編輯器南吮。

Interface Builder 將編輯器區(qū)域分為兩部分：左側(cè)的 文檔概覽(document outline) 和右側(cè)的 畫布(canvas)琳彩。

如圖1.8所示誊酌。 如果您在編輯區(qū)域看到的內(nèi)容與圖形不符，可能需要單擊 Show Document Outline 按鈕露乏。 （如果您有其他區(qū)域顯示碧浊，請不用擔(dān)心。）您還可能需要單擊文檔輪廓中的倒三角以顯示內(nèi)容瘟仿。

圖1.8顯示Main.storyboard的Interface Builder

您在 Interface Builder 畫布中看到的矩形稱為 scene箱锐，并表示目前唯一的“屏幕”或視圖（請注意，創(chuàng)建此項目時你使用的是 Single View Application 模板）劳较。

在下一節(jié)中驹止，您將了解如何使用 Interface Builder 為應(yīng)用程序創(chuàng)建UI。Interface Builder 允許您將庫中的對象拖動到畫布上以創(chuàng)建實例观蜗，還可以在這些對象和代碼之間建立連接臊恋。 這些連接可以轉(zhuǎn)換成代碼被用戶交互調(diào)用。

Interface Builder 的一個關(guān)鍵特性是它在其它文件上并沒有生成代碼墓捻。 Interface Builder 是一個對象編輯器抖仅，可以創(chuàng)建對象的實例并操縱其屬性。 完成編輯界面后砖第，它不會生成與您所做的工作相對應(yīng)的代碼撤卢。 在必要時 .storyboard 文件會加載到內(nèi)存中的對象實例的歸檔。

構(gòu)建界面

讓我們開始你的界面梧兼。 您已經(jīng)選擇 Main.storyboard 在畫布中顯示的單個 scene（圖1.9）放吩。

圖1.9 Main.storyboard中的場景

要開始，請確保您的場景的尺寸適用于 iPhone 7羽杰。在畫布底部渡紫，找到 View as 按鈕瞭稼。 它可能會像這樣：View as: iPhone 7 (wC hR)。 （wC hR現(xiàn)在來說沒有意義腻惠，我們將在第17章中解釋环肘。）如果iPhone 7 已經(jīng)顯示，那么表明已經(jīng)設(shè)置好了集灌。 如果沒有悔雹，請單擊 View as 按鈕，然后從左側(cè)選擇第四個對應(yīng)于 iPhone 7 的設(shè)備（圖1.10）欣喧。

圖1.10查看 iPhone 7 的 scene

現(xiàn)在是將視圖對象添加到該空白畫板的時候了腌零。

創(chuàng)建視圖對象

確保 Xcode 窗口中的實用程序區(qū)域可見。 您可能需要單擊窗口右上角

在實用程序區(qū)域的每個部分的頂部是各種檢查器和庫的選擇器（圖1.11）扭弧。

圖1.11 Xcode實用程序區(qū)

選項卡來查看對象庫鸽捻，如圖1.11所示。

對象庫包含可以添加到故事板文件中以組成界面的對象泽腮。 通過向下滾動列表或使用庫底部的搜索欄來查找 Label 對象御蒲。 在庫中選擇此對象并將其拖動到畫布上的視圖對象上。 將標(biāo)簽拖到畫布上并注意當(dāng)標(biāo)簽靠近畫布中心時出現(xiàn)的虛藍色線條（圖1.12）诊赊。 這些輔助線將幫助您部署您的界面厚满。

圖1.12將標(biāo)簽(label)添加到畫布

根據(jù)輔助線的指引，將標(biāo)簽放置在視圖的水平中心豪筝，靠近頂部痰滋，如圖1.12所示。 最終续崖，此標(biāo)簽將向用戶顯示問題敲街。 將第二個標(biāo)簽拖到視圖上并將其放置在水平中心，靠近中間严望。 此標(biāo)簽將顯示答案多艇。

接下來，在對象庫中找到 Button 并將兩個按鈕拖到視圖上像吻。 在每個標(biāo)簽下方放置一個峻黍。

您現(xiàn)在已將四個視圖對象添加到 ViewController 的UI中复隆。 請注意，它們也出現(xiàn)在文檔大綱中姆涩。 您的界面應(yīng)如圖1.13所示挽拂。

圖1.13構(gòu)建Quiz界面

配置視圖對象

現(xiàn)在您已經(jīng)創(chuàng)建了視圖對象，可以配置其屬性了骨饿。 視圖的某些屬性（如大小亏栈，位置和文本）可以直接在畫布上更改。 例如宏赘，您可以通過在畫布或文檔輪廓中選擇對象绒北，然后在畫布中拖動其角落和邊緣來調(diào)整對象的大小。

首先重命名標(biāo)簽和按鈕察署。 雙擊每個標(biāo)簽并用 ??? 替換文本闷游。 然后雙擊上方的按鈕并將其名稱更改為 Next Question。 重命名下面的按鈕為 Show Answer贴汪。 結(jié)果如圖1.14所示脐往。

圖1.14重命名標(biāo)簽和按鈕

您可能已經(jīng)注意到，因為您更改了標(biāo)簽和按鈕中的文本嘶是，因此它們的寬度已經(jīng)不再整齊地居中在 scene 中钙勃。 點擊并拖動它們以使它們再次居中蛛碌，如圖1.15所示聂喇。

圖1.15定位標(biāo)簽和按鈕

在模擬器上運行

要測試您的UI豺谈，您將要在 Xcode 的 iOS模擬器 上運行 Quiz备绽。

要準(zhǔn)備在模擬器上運行 Quiz，請在 Xcode 工具欄上找到當(dāng)前的方案彈出菜單（圖1.16）琅锻。

圖1.16選擇了iPhone 7方案

如果它顯示了 iPhone 7 一樣的東西酝蜒，那么這個項目就被設(shè)置為在模擬器上運行誊辉。 如果它顯示 Christian's iPhone，那就要點擊并從彈出菜單中選擇 iPhone 7亡脑。 在本書中堕澄，iPhone 7 方案將是您的模擬器默認設(shè)置。

單擊工具欄中的三角形播放按鈕霉咨。 這將構(gòu)建（編譯）然后運行應(yīng)用程序蛙紫。 你會經(jīng)常做這個，鍵盤快捷方式為 Command-R途戒。

模擬器啟動后坑傅，您將看到界面具有您添加的所有視圖，與你在 Interface Builder 中看到的一樣喷斋。

現(xiàn)在回到當(dāng)前的方案彈出菜單唁毒，選擇 iPhone 7 Plus 作為您的模擬器蒜茴。 再次運行應(yīng)用程序，您會注意到浆西，您添加的視圖仍然存在粉私，但它們不像在 iPhone 7 一樣居中。這是因為標(biāo)簽和按鈕目前在屏幕上具有固定位置近零，并且不會在主視圖保持居中毡鉴。 要糾正此問題，您將使用一種稱為 自動布局(Auto Layout) 的技術(shù)秒赤。

自動布局簡介

到目前為止猪瞬，您的界面在 Interface Builder 畫布中看起來不錯。 但是入篮，iOS設(shè)備的屏幕尺寸越來越大陈瘦，而我們希望應(yīng)用程序能支持所有屏幕尺寸和方向，甚至支持多種設(shè)備類型潮售。 無論運行應(yīng)用程序的設(shè)備的屏幕尺寸或方向如何痊项，都需要保證視圖對象的布局正確。 解決方法就是使用自動布局酥诽。

自動布局通過為 scene 中的每個視圖對象指定位置和大小約束來工作鞍泉。 這些約束可以相對應(yīng)于鄰近視圖或容器視圖。 容器視圖只是一個視圖對象肮帐，顧名思義咖驮，它包含另一個視圖。 例如训枢，查看 Main.storyboard 的文檔大綱（圖1.17）托修。

圖1.17帶容器視圖的文檔布局

您可以在文檔大綱中看到，您添加的標(biāo)簽和按鈕對于一個 View 對象是縮進的恒界。 此視圖對象是標(biāo)簽和按鈕的容器睦刃，并且對象可以相對于此視圖進行定位和縮放。

要開始指定自動布局約束十酣，請通過在畫布上或文檔大綱中單擊頂部標(biāo)簽來選擇頂部標(biāo)簽涩拙。 在畫布底部，注意如圖1.18所示的自動布局菜單耸采，兴泥。

圖1.18自動布局菜單

圖標(biāo)顯示如圖1.19所示的 對齊菜單(Align menu)洋幻。

圖1.19將容器中的頂部標(biāo)簽居中

在 Align 菜單中郁轻，選中 Horizontally in Container 復(fù)選框，以將標(biāo)簽居中。 然后單擊 Add 1 Constraint 按鈕好唯。 該約束能保證在任何尺寸的屏幕上竭沫，以任何方向，標(biāo)簽將水平居中骑篙。

現(xiàn)在蜕提，您需要添加更多的約束來使下面的標(biāo)簽和按鈕相對于頂部標(biāo)簽居中，并鎖定它們之間的間距靶端。 通過按住 Command 鍵單擊選中這四個視圖對象谎势，然后單擊圖標(biāo)

圖1.20 添加約束以居中并修復(fù)視圖之間的間距

點擊菜單頂部附近的紅色垂直虛線段脏榆。 當(dāng)您點擊該段時，它將變?yōu)閷嵭募t色（如圖1.20所示）台谍，表示每個視圖的距離固定在最近的頂層鄰居處须喂。 另外，檢查 Align 框趁蕊，然后從彈出菜單中選擇 Horizontal Centers坞生。 對于 Update Frames，請確保已選擇 Items of New Constraints掷伙。 最后點擊菜單底部的 Add 7 Constraints 按鈕是己。

如果您在添加約束時發(fā)生任何錯誤，您可能會在畫布上看到紅色或橙色的約束和邊框任柜，而不是正確的藍線卒废。 如果是這種情況，您將需要清除現(xiàn)有的約束乘盼，然后再次執(zhí)行上述步驟升熊。 要清除約束，首先選擇背景（容器）視圖绸栅。 然后單擊該圖標(biāo)

圖1.21清除約束

自動布局可能是一個難以掌握的工具辰企，這就是為什么您在本書第一章開始使用它风纠。 越早開始接觸使用它，你將有更多的機會使用它牢贸，并習(xí)慣它竹观。 另外，在應(yīng)用程序變得復(fù)雜之前處理自動布局將有助于你更容易地去調(diào)試布局問題。

要確認您的界面正確展示臭增，請在 iPhone 7 Plus 模擬器上構(gòu)建并運行應(yīng)用程序懂酱。 確認界面看起來正確后，在iPhone 7 模擬器上構(gòu)建并運行應(yīng)用程序誊抛。 標(biāo)簽和按鈕在兩者皆居中列牺。

創(chuàng)建連接

連接(connection) 允許一個對象知道另一個對象在內(nèi)存中的位置，以便兩個對象可以進行通信拗窃。 您可以在 Interface Builder 中進行兩種連接：outlet 和 action瞎领。 outlet 是對象的引用。action 是一種方法随夸，由用戶通過按鈕或滑塊或選擇器觸發(fā)九默。

我們先來創(chuàng)建引用 UILabel 實例的 outlet。 是時候離開 Interface Builder 去編寫一些代碼了宾毒。

聲明 outlet

在項目導(dǎo)航器中荤西，找到并選中名為 ViewController.swift 的文件。 編輯器區(qū)域?qū)?Interface Builder 更改為 Xcode 的代碼編輯器伍俘。

在 ViewController.swift 中邪锌，首先刪除模板在 class ViewController ：UIViewController { 和 } 之間自動生成的代碼，使該文件如下所示：

   import UIKit

   class ViewController: UIViewController {
   
   }

（為了簡方使起見癌瘾，我們不會再顯示該文件的 import UIKit 這一行 觅丰。）

接下來，添加聲明兩個屬性的代碼妨退。 （在本書中妇萄，您將添加的新代碼將以粗體顯示，您將刪除的代碼將被刪除線顯示咬荷。）不用擔(dān)心現(xiàn)在就要了解代碼或?qū)傩? 這才剛剛開始

class ViewController: UIViewController {

??@IBOutlet var questionLabel: UILabel!
??@IBOutlet var answerLabel: UILabel!

}

此代碼為 ViewController 的每個實例提供一個名為 questionLabel 的 outlet 和一個名為 answerLabel 的 outlet冠句。 視圖控制器可以使用每個 outlet 來引用特定的 UILabel 對象（即您視圖中的一個標(biāo)簽）。 @IBOutlet 關(guān)鍵字告訴 Xcode幸乒，您將使用 Interface Builder 將這些 outlet 連接到標(biāo)簽對象懦底。

設(shè)置 outlet

在項目導(dǎo)航器中，選擇 Main.storyboard 重新打開 Interface Builder罕扎。

你想讓 questionLabel outlet 指向 UI 頂部的 UILabel 實例聚唐。

在文檔大綱中，找到其中的 View Controller Scene 部分和 View Controller 對象腔召。 在當(dāng)前的情況下杆查，View Controller 代表 ViewController 的一個實例，它是負責(zé)管理 Main.storyboard 中定義的界面的對象臀蛛。

右鍵 從文檔輪廓中的 View Controller 拖動到場景中的頂部標(biāo)簽亲桦。 當(dāng)標(biāo)簽突出顯示時崖蜜，松開鼠標(biāo)和鍵盤; 將出現(xiàn)黑色面板。 選擇 questionLabel 來設(shè)置 outlet客峭，如圖1.22所示豫领。

圖1.22設(shè)置questionLabel

（如果在連接面板中沒有看到 questionLabel，請仔細檢查您的 ViewController.swift 文件以進行修改）桃笙。

現(xiàn)在氏堤，當(dāng)加載了故事板文件時，ViewController 的 questionLabel outlet 將自動引用屏幕頂部的 UILabel 實例搏明，這將允許 ViewController 告訴標(biāo)簽顯示什么問題鼠锈。

以相同的方式設(shè)置 answerLabel outlet： 右鍵從 ViewController 拖動到底部的 UILabel 并選擇 answerLabel（圖1.23）。

圖1.23設(shè)置answerLabel

請注意星著，是從要設(shè)置的 outlet 的對象拖動到要將該 outlet 指向的對象购笆。

您的 outlet 全部設(shè)置好后，您需要的下一個連接涉及到兩個按鈕虚循。

定義動作方法

當(dāng) UIButton 被點擊時同欠，它會調(diào)用另一個對象的方法。 該對象稱為 目標(biāo)(target)横缔。 觸發(fā)的方法稱為動作(action)铺遂。 該動作是該方法的名稱，該方法包含要在按鈕被點擊時執(zhí)行的代碼茎刚。

在您的應(yīng)用程序中襟锐，這兩個按鈕的目標(biāo)將是 ViewController 的實例。 每個按鈕都有自己的動作膛锭。 我們首先定義兩個動作方法：showNextQuestion（_ :) 和 showAnswer（_ :)粮坞。

重新打開 ViewController.swift，并在 outlet 后添加兩種動作方法初狰。

class ViewController: UIViewController {

@IBOutlet var questionLabel: UILabel!
??@IBOutlet var answerLabel: UILabel!

@IBAction func showNextQuestion(_ sender: UIButton) {

}

@IBAction func showAnswer(_ sender: UIButton) {

}
}

在進行目標(biāo)和動作連接后莫杈，您將會使用這些方法。@IBAction 關(guān)鍵字告訴 Xcode 您將在 Interface Builder 中進行這些連接奢入。

設(shè)定目標(biāo)和動作

切換回 Main.storyboard筝闹。 我們先從 Next Question 按鈕開始。 您希望將其目標(biāo)設(shè)為 ViewController俊马，其動作為 showNextQuestion（_ :)丁存。

要設(shè)置一個對象的目標(biāo)，請右鍵從該對象拖動到它的目標(biāo)柴我。 當(dāng)您釋放鼠標(biāo)時，目標(biāo)將被設(shè)置扩然，并出現(xiàn)一個彈出菜單艘儒，讓您選擇一個動作。

在畫布中選擇 Next Question 按鈕，然后拖動到在文檔大綱的 View Controller界睁。 當(dāng) View Controller 突出顯示時觉增，釋放鼠標(biāo)按鈕并在彈出菜單中的 Sent Events 下選擇 showNextQuestion：如圖1.24所示。

圖1.24設(shè)置 Next Question 目標(biāo)/動作

現(xiàn)在輪到 Show Answer 按鈕翻斟。 選擇按鈕逾礁，然后從按鈕控制拖動到 View Controller。 從彈出菜單中選擇 showAnswer：

連接摘要

ViewController 和視圖對象之間現(xiàn)在有五個連接访惜。 您已設(shè)置屬性 answerLabel 和 questionLabel 來引用標(biāo)簽對象——這是其中兩個嘹履。 ViewController 是兩個按鈕的目標(biāo)——這是另外兩個。 項目的模板創(chuàng)建了一個附加連接： ViewController 的 view 屬性連接到表示應(yīng)用程序背景的 View 對象债热。 這就是所有的五個連接砾嫉。

您可以在連接檢查器中檢查這些連接。 在文檔大綱中選擇 View Controller窒篱。 然后焕刮，在公用程序區(qū)域中，單擊選項卡

圖1.25檢查連接檢查器中的連接

您的故事板文件已完成配并。 視圖對象已創(chuàng)建和配置，并已對控制器對象進行了所有必要的連接高镐。 我們繼續(xù)創(chuàng)建和連接你的模型對象溉旋。

創(chuàng)建模型層

視圖對象組成UI，因此開發(fā)人員通常使用 Interface Builder 創(chuàng)建避消，配置和連接視圖對象低滩。 另一方面，模型層的部分通常以代碼形式設(shè)置岩喷。

在項目導(dǎo)航器中恕沫，選擇 ViewController.swift。 添加以下代碼纱意，聲明兩個字符串?dāng)?shù)組和一個整數(shù)婶溯。

class ViewController: UIViewController {
??@IBOutlet var questionLabel: UILabel!
??@IBOutlet var answerLabel: UILabel!

let questions: [String] = [
????"What is 7+7?",
????"What is the capital of Vermont?",
????"What is cognac made from?"
??]
??let answers: [String] = [
????"14",
????"Montpelier",
????"Grapes"
??]
??var currentQuestionIndex: Int = 0
...
}

數(shù)組是包含問題和答案的有序列表。 整數(shù)用于跟蹤用戶當(dāng)前的問題偷霉。

請注意迄委，使用 let 關(guān)鍵字聲明數(shù)組，而使用 var 關(guān)鍵字聲明整數(shù)类少。 常數(shù)用 let 關(guān)鍵字表示; 其值不能改變叙身。 問題和答案數(shù)組是常數(shù)。 本程序中的問題和答案不會改變硫狞，實際上只是不能從初始值改變信轿。

另一方面晃痴，變量由 var 關(guān)鍵字表示; 它的值被允許改變。 你將 currentQuestionIndex 屬性變成一個變量财忽，因為它的值必須能夠隨著用戶循環(huán)的問題和答案而改變倘核。

實現(xiàn)動作方法

現(xiàn)在你有問題和答案，你可以來實現(xiàn)它們的動作方法即彪。 在 ViewController.swift 中紧唱，更新 showNextQuestion（_ :) 和 showAnswer（_ :)。

...
@IBAction func showNextQuestion(_ sender: UIButton) {
??currentQuestionIndex += 1
??if currentQuestionIndex == questions.count {
????currentQuestionIndex = 0
??}
??let question: String = questions[currentQuestionIndex]
??questionLabel.text = question
??answerLabel.text = "???"
}

@IBAction func showAnswer(_ sender: UIButton) {
??let answer: String = answers[currentQuestionIndex]
??answerLabel.text = answer
}.
..

加載第一個問題

應(yīng)用程序啟動后隶校，您將要從數(shù)組中加載第一個問題漏益，并使用它來替換 ??? 問題標(biāo)簽中的占位符。 一個很好的方法是重寫 ViewController 的 viewDidLoad（） 方法惠况。 （“覆蓋”表示您正在為方法提供自定義實現(xiàn)遭庶。）將方法添加到 ViewController.swift。

class ViewController: UIViewController {
??...
??override func viewDidLoad() {
??super.viewDidLoad()
????questionLabel.text = questions[currentQuestionIndex]
??}
}

您的應(yīng)用程序的所有代碼現(xiàn)在已經(jīng)完成稠屠！

構(gòu)建應(yīng)用程序

如前所述峦睡，在 iPhone 7 模擬器上構(gòu)建并運行應(yīng)用程序。

榨了，在問題導(dǎo)航器中查看它們（圖1.26）。

圖1.26帶有示例錯誤和警告的問題導(dǎo)航器

單擊問題導(dǎo)航器中的任何錯誤或警告將被帶到文件和發(fā)生問題的代碼行攘蔽。 通過將代碼與本章中的代碼進行比較龙屉，找出并解決任何問題（即代碼拼寫錯誤！）满俗。 然后再次嘗試運行應(yīng)用程序转捕。 重復(fù)此過程直到您的應(yīng)用程序編譯成功。

在您的應(yīng)用程序編譯完成后唆垃，它將在iOS模擬器中啟動五芝。 測試 Quiz 應(yīng)用程序。 您應(yīng)該能夠點擊 Next Question 按鈕辕万，并在頂部標(biāo)簽中看到一個新問題; 點擊 Show Answer* 應(yīng)該顯示正確的答案枢步。 如果您的應(yīng)用程序無法正常工作，請檢查 Main.storyboard 中的連接。

你已經(jīng)建立了一個可運行的iOS應(yīng)用程序，花點時間享受你的成果衷戈。

好的,享受夠了。你的應(yīng)用程序可以運行余舶，但它需要一些美化和改進。

應(yīng)用圖標(biāo)

運行 Quiz 時，從模擬器菜單中選擇 Hardware → Home。 你會看到 Quiz 圖標(biāo)是一個無聊的默認磁貼嵌屎。 讓我們給 Quiz 一個更好的圖標(biāo)推正。

應(yīng)用程序圖標(biāo)是表示iOS主屏幕上的應(yīng)用程序的簡單圖像恍涂。 不同的設(shè)備需要不同大小的圖標(biāo)宝惰，其中一些顯示在表1.1中。

表1.1不同設(shè)備的應(yīng)用程序圖標(biāo)

我們已經(jīng)為 Quiz 應(yīng)用準(zhǔn)備了一個圖標(biāo)圖像文件（大小為120x120）再沧。 您可以從 www.bignerdranch.com/solutions/iOSProgramming6ed.zip 下載此圖標(biāo)（以及其他章節(jié)的資源）尼夺。 解壓縮iOSProgramming6ed.zip并在解壓縮的文件夾的 0- Resources/Project App Icons 目錄中找到 Quiz-120.png 文件。

您將將此圖標(biāo)作為資源添加到應(yīng)用程序包中炒瘸。 一般來說淤堵，應(yīng)用程序中有兩種文件：代碼和資源。 代碼（如 ViewController.swift）用于創(chuàng)建應(yīng)用程序本身顷扩。 資源是應(yīng)用程序在運行時使用的圖像和聲音拐邪。

在項目導(dǎo)航器中，找到 Assets.xcassets隘截。 選擇此文件打開它扎阶，然后從左側(cè)的資源列表中選擇 AppIcon（圖1.27）。

圖1.27顯示Asset目錄

此面板是 Asset 目錄婶芭，您可以在其中管理應(yīng)用程序所需的所有圖像东臀。

將 Quiz-120.png 文件從 Finder 拖到 iPhone App 部分的 2x 插槽上（圖1.28）。 這將將文件復(fù)制到文件系統(tǒng)中的項目目錄中犀农，并在 Asset 目錄中添加對該文件的引用惰赋。 （您可以按住 Control 鍵并單擊 Asset 目錄中的文件，然后選擇在 Show in Finder 以確認此選項呵哨。）

圖1.28將應(yīng)用圖標(biāo)添加到 Asset 目錄中

再次構(gòu)建并運行應(yīng)用程序赁濒。 通過單擊 Hardware → Home，像之前一樣孟害，或使用鍵盤快捷鍵 Command-Shift-H 切換到模擬器的主屏幕(在虛擬機中 Command 鍵即 Win 鍵)拒炎。 你應(yīng)該看到新的圖標(biāo)。

(如果沒有看到圖標(biāo)纹坐，請關(guān)閉應(yīng)用程序枝冀，然后重新構(gòu)建并重新運行）。為此耘子，最簡單的選項是通過單擊 Simulator → Reset Content and Settings... 這將刪除所有應(yīng)用程序并將模擬器重置為默認設(shè)置果漾，您應(yīng)該在下次運行應(yīng)用程序時看到應(yīng)用程序圖標(biāo)。）

啟動屏幕

現(xiàn)在該為項目設(shè)置 啟動圖片(launch image) 了谷誓，它在應(yīng)用程序加載時顯示绒障。 launch image 在iOS中具有特定的作用：它表示應(yīng)用程序正在啟動，并描述了用戶在應(yīng)用程序加載后將進行交互的UI捍歪。 因此户辱，良好的 launch image 是應(yīng)用程序的無內(nèi)容屏幕截圖鸵钝。 例如，Clock 應(yīng)用程序的 launch image 顯示底部的四個選項卡庐镐，全部處于未選擇的狀態(tài)恩商。 一旦應(yīng)用程序加載，將選擇正確的選項卡必逆，內(nèi)容變得可見怠堪。 （請注意，啟動圖片在應(yīng)用程序啟動后被替換;它不會成為應(yīng)用程序的背景圖像名眉。）

完成此操作的一個簡單方法是允許 Xcode 使用 launch screen file 為您生成可能的 啟動屏幕圖像粟矿。

通過單擊項目導(dǎo)航器中的最頂部的 Quiz 來打開項目設(shè)置。 在 App Icons and Launch Images 下损拢，從 Launch Screen File 下拉列表中選擇 Main.storyboard（圖1.29）陌粹。 現(xiàn)在將從 Main.storyboard 生成啟動圖片。

圖1.29設(shè)置啟動屏幕文件

很難看到這種更改的結(jié)果福压，因為 啟動圖片 通常只在很短的時間內(nèi)顯示掏秩。然而，盡管它的角色是如此的短暫隧膏，但它仍然是一個良好的實踐哗讥。

恭喜！ 你已經(jīng)寫了你的第一個應(yīng)用程序胞枕，甚至添加了一些細節(jié)來改進它杆煞。 您將在本書后再次用到該 Quiz 應(yīng)用程序。 下一章將為你介紹一些 Swift 編程的基礎(chǔ)知識腐泻。