接著上一篇開始用Swift開發iOS 10 - 9 Table Row的刪除, UITableViewRowAction和UIActivityViewController的使用的代碼，繼續學習Navigation Controller和Segue。
創造Navigation Controller
- 選中Restaurant Table View Controller然后點擊菜單欄中的Editor > Embed in > Navigation Controller；生成了新的一Scene（Navigation Controller Scene）。
- 選中之前Scene中的Navigation bar，修改其
title為Food Pin。
添加 Detail View Controller
之前添加導航欄，現在添加另一個view controller，用來顯restaurant的詳細內容。
- 拖動一個新的View Controller。
- 拖動一個image View，調整合適大小，并添加相關約束。
Content Mode屬性修改為 Aspect Fill。 - 用segue連接prototype cell和detail scene。 Ctrl-drag從prototype cell到detail scene。如果不方便選擇prototype cell，可以在document outline中拖動。選擇Show連接風格。
-
iOS 10中有幾種sugue類型：
- Show：新的view controller將被添加view controller棧的頂部。跳轉的頁面有Navigation bar，并且有返回原來頁面的返回按鈕。這是非常常用的的類型。
- Show detail：在view controller棧中，新的view controller將被替代原來的view controller。跳轉的頁面沒有Navigation bar，也沒有返回原來頁面的返回按鈕。
-
Present modally：新頁面將以動畫形式從底部出現到覆蓋整個手機屏幕。這種形式最常見的列子是iOS自帶的日歷應用：
-
Present as popover：以帶有箭頭錨點的彈框顯示。通常使用的iPad應用中
不再需要action sheet，去除
tableView(_:didSelectRowAt:)方法創建新類文件
RestaurantDetailViewController，繼承至UIViewController。是新建scene與RestaurantDetailViewController的聯系。在
RestaurantDetailViewController中加入一個outlet和一個變量，outlet關聯Image View，restaurantImage用與接受table view傳來的圖像名稱數據。
@IBOutlet var restaurantImageView:UIImageView!
var restaurantImage = ""
override func viewDidLoad() {
super.viewDidLoad()
restaurantImageView.image = UIImage(named: restaurantImage)
}
通過segues傳遞數據
segue管理view controller之間的過渡。當segue觸發時，storyboard會通知源view controller（如RestaurantTableViewController）調用方法prepare(for:sender:)，可以通過此方法傳遞數據。
-
當storyboard中結構復雜時，segue可能會有很多，同一個view controller可能與各級view controller之間有segue，這種情況最好給segue一個唯一identifier。設置segue的identifier為 showRestaurantDetail。
在
RestaurantTableViewController中添加prepareForSegue:
override func prepare(for segue: UIStoryboardSegue, sender: Any?) {
if segue.identifier == "showRestaurantDetail" {
if let indexPath = tableView.indexPathForSelectedRow {
let destinationController = segue.destination as! RestaurantDetailViewController
destinationController.restaurantImage = restaurantImages[indexPath.row]
}
}
}
為詳情頁面添加三個標簽
- 添加三個標簽，Text分別為Name，Location，Type（注意：雖然Text會被替代，但不要開始留空，因為留空會使之后生成stack view時，大小不確定）；三個label生成一個stack view，調整字體和大小，添加適當的約束。
- 添加三個outlet，和三個與之對應的變量。
@IBOutlet var nameLabel: UILabel!
@IBOutlet var locationLabel: UILabel!
@IBOutlet var typeLabel: UILabel!
var nameText = ""
var locationText = ""
var typeText = ""
override func viewDidLoad() {
super.viewDidLoad()
restaurantImageView.image = UIImage(named: restaurantImage)
nameLabel.text = nameText
locationLabel.text = locationText
typeLabel.text = typeText
}
- 修改
RestaurantTableViewController中的prepareForSegue方法：
override func prepare(for segue: UIStoryboardSegue, sender: Any?) {
if segue.identifier == "showRestaurantDetail" {
if let indexPath = tableView.indexPathForSelectedRow {
let destinationController = segue.destination as! RestaurantDetailViewController
destinationController.restaurantImage = restaurantImages[indexPath.row]
destinationController.nameText = restaurantNames[indexPath.row]
destinationController.locationText = restaurantLocations[indexPath.row]
destinationController.typeText = restaurantTypes[indexPath.row]
}
}
}
代碼
Beginning-iOS-Programming-with-Swift
說明
此文是學習appcode網站出的一本書 《Beginning iOS 10 Programming with Swift》 的一篇記錄
系列文章目錄
- 開始用Swift開發iOS 10 - 1 前言
- 開始用Swift開發iOS 10 - 2 Hello World！第一個Swift APP
- 開始用Swift開發iOS 10 - 3 介紹Auto Layout
- 開始用Swift開發iOS 10 - 4 用Stack View設計UI
- [開始用Swift開發iOS 10 - 5 原型的介紹]
- 開始用Swift開發iOS 10 - 6 創建簡單的Table Based App
- 開始用Swift開發iOS 10 - 7 定制Table Views
- 開始用Swift開發iOS 10 - 8 Table View和UIAlertController的交互
- 開始用Swift開發iOS 10 - 9 Table Row的刪除, UITableViewRowAction和UIActivityViewController的使用
