快速架構單向數據流的 Realm 應用

現在我們用 Interface Builder 把所有的組件聯系起來。打開 Main.storyboard ，按如下步驟操作：

• 刪除當前的 View Controller 界面
• 從 Object Library 拖拽出 Navigation Controller。這會創建一個 UITableViewController 視圖作為根導航。
• 在 Navigation Controller 中選中 Is Initial View Controller
• 選擇根視圖控制器然后把 Identity Inspector 上的定制類改為 ViewController
• 選擇 Table View 單元，然后把 Identity Inspector 上的定制類改為 ProjectCell 。并且在 Attributes Inspector 上重用標示為 ProjectCell 。
• 在 cell prototype 上放置兩個 UILabel 和一個 UIButton ，然后設置為 autolayout。在 ProjectCell 上把它們和 nameLabel ， elapsedTimeLabel 和 activityButton 的 outlets 連接起來。當你做完這些，請把 Activity 的按鈕的 TouchUpInside 和 activityButtonTapped 操作連接起來。
• 選擇導航組件，然后把它的標題改成比 Root View Controller 更合適的名字。

這樣，所有視圖控制器的代碼都完成了 - 無論何時狀態改變，列表都會自動更新了。你現在可以編譯和運行你的應用了，雖然沒有那么激動人心，因為現在沒有任何項目（而且沒有辦法添加任何項目）！

所以讓我們來增加些操作來看看狀態更新是如何工作的 - 我們開始增加一個新的項目。因為項目只需要一個名字，最容易的方法就是把 ‘add project’ 放到列表的表頭上。

在 storyboard 里, 按照如下步驟創建 ‘add project’ 元素：

• 在 Object Library 中拖拽出一個 Bar Button 到 navigation bar 的右邊。Xcode 這里會有點不好用 - 我發現有時候在 Document Outline 里面拖拽到導航欄里會容易些（左手 Interface Builder pane）。
• 在 Attributes Inspector 里，把 bar button 的 system item 設為 ‘Add’
• 在 Table View 上再添加一個 View，然后增加一個 Text Field 和一個 button，然后配置成為 autolayout。
• 把 button 的 title 改成 ‘Add’。
• 打開 Assistant Editor 然后確保它顯示的是文件 ‘ViewController.swift’。
• Control-drag text field 到 ViewController.swift 源代碼然后創建一個叫做 newProjectTextField 的 outlet
• 在列表表頭 Control-drag ‘Add’ 按鈕到 ViewController.swift 然后創建一個新的 action 叫做 addButtonTapped 。不要忘記把 drop-down 改為 ‘action’！
• Control-drag ‘+’ bar 按鈕到 ViewController.swift 然后創建一個新的 action 叫做 showNewProjectView 。再強調一次，如果 Xcode 不好使用的話，使用 Document Outline。

隱藏 Assistant View 然后轉到 ‘ViewController.swift’。 增加顯示和隱藏表頭的代碼，在 addButtonTapped 方法里面調用存儲的 addProject 方法。你也需要增加一個 hideNewProjectView() 方法來調用 stateDidUpdate 。

func updateView() {
    tableView.reloadData()
    hideNewProjectView()
}

@IBAction func showNewProjectView(sender: AnyObject) {
    tableView.tableHeaderView?.frame = CGRect(origin: CGPointZero, size: CGSize(width: view.frame.size.width, height: 44))
    tableView.tableHeaderView?.hidden = false
    tableView.tableHeaderView = tableView.tableHeaderView // tableHeaderView needs to be reassigned to recognize new height
    newProjectTextField.becomeFirstResponder()
}

func hideNewProjectView() {
    tableView.tableHeaderView?.frame = CGRect(origin: CGPointZero, size: CGSize(width: view.frame.size.width, height: 0))
    tableView.tableHeaderView?.hidden = true
    tableView.tableHeaderView = tableView.tableHeaderView
    newProjectTextField.endEditing(true)
    newProjectTextField.text = nil
}

@IBAction func addButtonTapped() {
    guard let name = newProjectTextField.text else { return }
    store.addProject(name)
}

@IBAction func activityButtonTapped() {
    guard let project = project else { return }
    if project.currentActivity == nil {
        store.startActivity(project, startDate: NSDate())
    } else {
        store.endActivity(project, endDate: NSDate())
    }
}

override func tableView(tableView: UITableView, canEditRowAtIndexPath indexPath: NSIndexPath) -> Bool {
    return true
}

override func tableView(tableView: UITableView, commitEditingStyle editingStyle: UITableViewCellEditingStyle, forRowAtIndexPath indexPath: NSIndexPath) {
    store.deleteProject(projects[indexPath.row])
}