分類：UIKit學習

1. 簡介：

• 在單一column下以列(row)的方式來呈現資料 。
• 為ScrollView的子類別，但是只能縱向滑動。
• 上面的每一個儲存格稱為cell，用來呈現資料，為UITableViewCell類別。
• 可以分成好幾個Section，如下圖分成籃球、棒球兩個Section，籃球Section有2個row，棒球有4個。
  

表格 UITableView · Swift 起步走

• 利用index number來選到要的Section及row。
• TableView的樣式分成plain及grouped兩種。
• TableView需要物件來作為Data Source及委任，來設定TableView的樣式及要呈現的資料。
• 每個cell的結構如下圖，了解此結構有助於客製化TableView的建構。cell裡面有一個大框架為content view，content view內部再包涵一個UIImageView與一個UILabel

https://developer.apple.com/library/content/documentation/UserExperience/Conceptual/TableView_iPhone/TableViewCells/TableViewCells.html#//apple_ref/doc/uid/TP40007451-CH7

2. UITableView建立方法

利用UITableView來建立

1. 選擇UITableView並將其拉進StoryBoard並與程式碼進行連結，再將右邊的Prototype cells設為1(不設也沒關係，為了方便我們看到Cell的變化）。
   

2. 接著選到畫面左邊的cell，並將其右邊的identifier改成cell，此部驟相當於TableView中的register方法。
   

3. 在連結TableView的ViewController打上程式碼來遵守UITableViewDelegate與UITableViewDataSource協定，因此要實現此兩協定的方法。

• UITableViewDataSource管理的方法包含有多少表格區塊(Section)、需要多少列(Row)、列要顯示什麼、Section的標題要顯示什麼...等。
• UITableViewDelegate管理的則是處理外觀，包含Row Height、標題區塊的高...等。
  Ex:

//每個Section裡面會有幾列
func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
        程式碼區
    }

//設定cell要顯示的內容
func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
			一般來說會實現tableView中的dequeueReusableCell方法藉以重複使用cell
    }

4. 設定delegate：必須告訴UITableView委派物件為何，為遵守上述協定的ViewController。
   因此在該ViewController中的viewDidLoad方法中加入tableview名稱.delegate = self及tableview名稱.dataSource = self

3. 客製化Cell

上述我們選擇Prototype cell為1是為了方便我們進行客製化cell的視覺化呈現，如果選擇2以上，這樣我們就需要設定給每個的cell ID。

3-1. 客製化Cell方法：

1. 在prototype cell中的content View拉進需要的元件。下圖拉進名稱為My Cell Image View及 My cell Label的元件。

2. 創建一個新的UITableViewCell類別，上圖為創建一MycustomTableViewCell類別。
3. 把拉進的元件與剛剛產生的MycustomTableViewCell連結。
4. 在設定Cell的地方轉型成MycustomTableViewCell，並且調用在此Cell的方法。Ex:

 func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
        if let cell = tableView.dequeueReusableCell(withIdentifier: "cell", for: indexPath) as? MycustomTableViewCell{
            cell.myCellLabel.text = sceneFigureArray[indexPath.row]
            cell.myCellLabel.backgroundColor = UIColor(red: 0.66, green: 1.79, blue: 2.44, alpha: 0.7)
            cell.myCellImageView.image = UIImage(named: sceneFigureArray[indexPath.row])
            return cell
        }else {
            let cell = UITableViewCell()
            cell.textLabel?.text = sceneFigureArray[indexPath.row]
            cell.imageView?.image = UIImage(named: sceneFigureArray[indexPath.row])
            return cell
        }     
    }

4. TableView其他常使用的方法：

• heightForHeaderInSection：設定Section Header的高度。

func tableView(_ tableView: UITableView, heightForHeaderInSection section: Int) -> CGFloat {
         <#code#>
    }

• titleForFooterInSection：設定Footer的標題

func tableView(_ tableView: UITableView, titleForFooterInSection section: Int) -> String? {
        <#code#>
    }

• heightForFooterInSection：設定Section Footer的高度。

func tableView(_ tableView: UITableView, heightForFooterInSection section: Int) -> CGFloat {
         <#code#>
    }