昨天我們實際操作了 tableView 的實作，今天要加入換頁

意思就是假設我點了名為 “99” 的 cell，點擊後會跳轉到另外一頁，同樣顯示 “99”

所以除了跳頁外，還要加入值的傳遞

首先打開昨天的專案，我們要繼續下去

回到 storyboard 中，昨天我們加入了 dataSource，今天要加入 delegate:

回到程式碼中 ViewController.swift

在 class 的宣告再加上 UITableViewDataSource

class ViewController: UIViewController, UITableViewDataSource, UITableViewDelegate {

再來就要設計換頁的流程了

回到 storyboard

拉一個新的 ViewController 到空白處

接著點擊左邊的 TableViewCell, 按住 ctrl + 拖曳，拉到剛剛建立的 ViewController 上

選擇 show detail

就會長這樣:

再來新增一個 ViewController

接著讓新的 storyboard viewcontroller 連接到剛剛新增的 DetailViewController 程式碼

記得先點選 ViewController

在 storyboard 的 DetailViewController 中拉一個 label

並且將該 label 連接到 DetailViewController 的程式碼中

因此 DetailViewController 就會變這樣:

class DetailViewController: UIViewController {
    @IBOutlet var label: UILabel!

接著再來把 DetailViewController 加入兩行 code:

class DetailViewController: UIViewController {
    @IBOutlet var label: UILabel!
    
    var index: Int = 0
    
    override func viewDidLoad() {
        super.viewDidLoad()

        // Do any additional setup after loading the view.
        
        label.text = "\(index)"
    }

新增一個 index 變數，再來就是在 viewDidLoad 時，將該 label 的文字改成 index

這個 index 的值會在 TableView 中傳遞給 DetailViewController

接下來就要改變 index 的值了，回到 ViewController.swift 中

加入以下程式碼:

func tableView(tableView: UITableView!, didSelectRowAtIndexPath indexPath: NSIndexPath!) {
      
	let cell = tableView.cellForRowAtIndexPath(indexPath)
	self.performSegueWithIdentifier("showDetail", sender: cell)
    
}
    
override func prepareForSegue(segue: UIStoryboardSegue, sender: AnyObject?) {
    if segue.identifier == "showDetail" {
		let indexPath = self.tableSample.indexPathForSelectedRow()?.row
	((segue.destinationViewController) as DetailViewController).index=indexPath!
	}
}

大家可能會覺得好奇裡頭有個 identifier 叫做 ‘showDetail’，這個東西是自己自定的，一定要定，不然在傳遞時會不知道要抓哪個 segue

再來確認一下是否 dataSource 與 delegate 是否都有 reference 到

執行，就可以發現可以點進去了!

不過因為我們還沒有和 NavigationView 做結合，因此要自己做按鈕點回去 XD

在這邊就先不做了，因為明天就可以兩個結合起來了!

Back to posts