iT邦幫忙

第 11 屆 iThome 鐵人賽

DAY 16
1

誠如昨日所說,我已經沒有庫存了...
現在只能寫一天算一天QQ壓力好大啊~~
我也不知道在這種情況下,為什麼還要選擇UITableView當作接續UIControl的第一個主題。
點開UITableView看到那不輸UITextField的小巧scroll bar跟滿滿的function和連結...真的讓人有一種掉入深淵的無力感。
不過竟然已經掉下去了,也只能抵抗向上力場往上爬了。
所以之後如果有篇幅比較少的情況,還請大家見諒啊~

那,新的篇章開始了。


UITableView是一個列狀呈現資訊的UIKit,可垂直捲動內容,是一個非常常見的版面配置樣式,像是通訊錄和設定頁面都是由UITableView配置。

(圖片來源:UITableView)

Table通常用來顯示有高度結構化或有明顯階層組織的資料,你可以建立一個格式化的list,並將陣列裡的資料指定給table,通常與navigation view controller搭配使用。UITableView會幫你呈現一個基本的表單,而你需要自己編輯cell來決定呈現的內容。標準的cell是包含一個image和一個label,但也可以客製內容whatever u want。也可以設定header或footer,以提供表格的額外資訊。

Creating Table View

建立tableView,一樣可以從storyboard的library裡拉出,或是用程式碼初始化。

通常tableView的cell都是dynamic protocell,可以依照使用者的操作對表單內容進行修改,例如新增通訊錄聯絡人。
如果你希望你的tableView是不可變動的僅單純顯示資料,你也可以將你的tableView設為static cell。

這時執行app會發現什麼都沒有,因為類別沒有實作UITableViewDataSource以及UITableViewDelegate,並沒有足夠的資訊及能力執行tableView。
實作UITableViewDataSource以及UITableViewDelegate後,Xcode會要求你定義DataSource裡的tableView(:numberOfRowsInSection:)和tableView(:cellForRowAt:)兩個協定,分別是每個section裡有的列數和對應的cell:

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

func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
    let cell = tableView.dequeueReusableCell(withIdentifier: "cell", for: indexPath)
    return cell
}

大概解釋一下第二個function。
identifier是你給每個自定義cell的驗證碼,而這個function使用identifier來決定你的cell要遵從哪個自定義cell的形式並回傳。

定義完之後,再讓tableview的dataSource和Delegate啟用view所繼承的:

newTableView.dataSource = self
newTableView.delegate = self

就可以看到畫面上顯示了空白tableView。

style

在初始化時,可以選擇tableView的type:

let newTableView = UITableView(frame: CGRect(x: 0, y: 0, width: UIScreen.main.bounds.width, height: UIScreen.main.bounds.height), style: .plain)

plain是一般表格列,而grouped則是有一個模板,顯示section分群過的表格列。style的預設是plain。

至於DataSource、Delegate還有剛剛用到的dequeueReusableCell(withIdentifier:for:)等,之後都會做更詳細的說明。

那今天就先讓我偷懶一下,只介紹tableView的概念。
明天將會進入長篇大論的UITableViewDataSource,大家好好養精蓄銳做好準備啊~


上一篇
Day 15:終於要打王了...納命來吧UIControl!!
下一篇
Day 17: 來自深淵-UITableView(II)
系列文
Hey! UIKit, 做個朋友吧~30
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言