前言

昨天我們已經完成使用Delegate回傳值到首頁的部分了，那今天就要來完成最後一個步驟：

如何讓回傳回來的資料顯示在畫面中

馬上開始吧！

實作

1. 鬧鐘首頁顯示的鬧鐘可以有多個，因此我們這邊先宣告一個型態為「AddAlarmInfo」陣列

var alarmDatas: [AddAlarmInfo] = []

2. 接下來在剛剛接收回傳值的地方，將這些回傳值給加入「alarmDatas」陣列內

extension AlarmViewController: UpdateAlarmListDelegate {
    
    func updateAlarmList(alarmData: AddAlarmInfo) {
        
        // 將回傳回來的鬧鐘資訊加入該陣列內
        self.alarmDatas.append(alarmData)
    }
}

3. 修改TableView Delegate中的「numberOfRowsInSection」、「cellForRowAt」

numberOfRowsInSection：

func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
        switch section {
        case 0:
            // 第一個Section下顯示一個Cell即可
            return 1
        case 1:
            // 第二個Section顯示的Cell數量為：alarmDatas陣列的成員個數
            return alarmDatas.count
        default:
            // 其餘不顯示任何Cell
            return 0
        }
    }

cellForRowAt：

case 1:
            // 將實作的AlarmOtherTableViewCell實體化，並顯示於第二個Section的畫面上
            guard let cell = tableView.dequeueReusableCell(withIdentifier: AlarmOtherTableViewCell.identifier, for: indexPath) as? AlarmOtherTableViewCell else { return UITableViewCell() }
            
            // 每個cell的alarmTimeLabel的文字內容 放入 相對應「alarmDatas」的time
            cell.alarmTimeLabel.text = alarmDatas[indexPath.row].time
            // 每個cell的alarmNoteLabel的文字內容 放入 相對應「alarmDatas」的annotation
            cell.alarmNoteLabel.text = alarmDatas[indexPath.row].annotation
            
            return cell

4. 這時候會發現有Error:
   

OH~ 原來是「alarmDatas」陣列內的time是屬於Date型別，Date型別無法放入Label的文字內，
因此我們必須要做一個Date轉換為String的動作。

5. 新增一個將Date轉換為String的Function

// 實作Function:「dateToString」，一共有兩個參數
// 第一個date  是: 要轉換的時間
// 第二個format是: 要轉換爲何種時間格式
func dateToString(date: Date, format: String) -> String {
      
    // 宣告dateFormatter
    let dateFormatter = DateFormatter()
        
    // 設定要轉換的時間格式為： 帶入的參數「format」
    dateFormatter.dateFormat = format
        
    // 將時間轉換為字串後回傳
    return dateFormatter.string(from: date)
        
}

6. 將它使用在TableView Delegate中的「cellForRowAt」內

case 1:
            // 將實作的AlarmOtherTableViewCell實體化，並顯示於第二個Section的畫面上
            guard let cell = tableView.dequeueReusableCell(withIdentifier: AlarmOtherTableViewCell.identifier, for: indexPath) as? AlarmOtherTableViewCell else { return UITableViewCell() }
            
            // 每個cell的alarmTimeLabel的文字內容放入
            // 相對應「alarmDatas」的time
            cell.alarmTimeLabel.text = dateToString(date: alarmDatas[indexPath.row].time, format: "HH:mm")
            
            // 每個cell的alarmNoteLabel的文字內容放入
            // 相對應「alarmDatas」的annotation
            cell.alarmNoteLabel.text = alarmDatas[indexPath.row].annotation
            
            return cell

執行看看吧！

怎麼失敗了呢？

原因是當你更改「alarmDatas」陣列的值後，並沒有人通知TableView已經更改值了，要更新畫面了
因此加入以下程式碼，通知TableView該刷新畫面囉！

    var alarmDatas: [AddAlarmInfo] = [] {
        // didSet的意思是：當這個變數被變更時，執行以下動作
        didSet {
            
            // TableView的畫面更新
            alarmTableView.reloadData()
        }
    }

再執行看看吧！

成功啦！！！

這次鐵人賽也告一個段落了
雖然這段日子有快樂也有不快樂，但這些日子也是我人生中不會忘記的一段時間
很感謝這些日子的陪伴，希望大家接下來都能快快樂樂的:)

若對於任何一篇文章有疑問的，也很歡迎大家留言告訴我，
感謝大家的觀看！我們有緣就下次鐵人賽見囉！