iT邦幫忙

2021 iThome 鐵人賽

DAY 4
0
自我挑戰組

來寫看看app好了! Swift探索之旅系列 第 4

Day#04 TableView

前言

承接昨天的內容,今天來加上viewDidLoad中的邏輯內容{ @•̀ꈊ•́@ }

學習資源

這篇參考的資源與前篇相同,還新增了 :arrow_down:

表格 UITableView

TableView

UITableView有兩個必須實作的方法,第一個是每一組有幾個cell、第二個是每個 cell 要顯示的內容。

算是一個快捷鍵/小技巧,不需要按照func tableView...這樣一個字一個字慢慢打,直接打numberOfRowsInSection,甚至打num,XCode就會跳出提示,然後可直接選擇要實作的方法,可參考下圖32行

首先是第一個方法,這邊的data是指viewController的private TodoListItem陣列。我們直接回傳共有幾個item,代表有多少個相對應的cell。

func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
    return data.count
}

然後接下來是每個cell的內容,我們使用"cell"作為identifier,把data一個個的塞到cell文字內容中顯示。

func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
    let cell = tableView.dequeueReusableCell(withIdentifier: "cell", for: indexPath)
    cell.textLabel?.text = data[indexPath.row].item
    return cell
}

最後,因為前一天有提到,當我們點選某個item/cell的時候,要可以看他的細節與內容,因此加入一個選擇row時的方法。
這邊先加上取消選擇的狀態,其他查看細節的內容先不實作。

func tableView(_ tableView: UITableView, didSelectRowAt indexPath: IndexPath) {
    tableView.deselectRow(at: indexPath, animated: true)
}

UITableViewDelegate, UITableViewDataSource

UITableView必須設置委任模式的對象來完善這個表格的內容,而我們將tableView直接寫在viewController當中,因此指定他為委派對象。
UITableView委任的方法大多會有indexPath參數,這個參數有兩個屬性分別為section及row,是用來表示目前要設置的cell是屬於哪一組( section)的哪一列(row),型別都為Int且都是0-index。

class ViewController: UIViewController, UITableViewDelegate, UITableViewDataSource

viewDidLoad

把上述的tableview以及其中的cell identifier bind進來。

override func viewDidLoad() {
    super.viewDidLoad()

    table.register(UITableViewCell.self, forCellReuseIdentifier: "cell")
    table.delegate = self
    table.dataSource = self
}

結語

到這邊可以先build(cmd+B),試試看,應該要建置成功!

搭配viewController的是storyboard,storyboard將元件實際顯示出來,透過連結的方式去mapping viewController/storyboard的關係。下一篇會繼續實作!

若上述內容有誤或可以改進的部分,歡迎留言以及提出任何指教~
謝謝 ୧༼◕ ᴥ ◕༽୨


上一篇
Day#03 初始專案
下一篇
Day#05 Storyboard
系列文
來寫看看app好了! Swift探索之旅30

尚未有邦友留言

立即登入留言