New StoryBoard in iOS9

Storyboards在iOS5就已經添加進來了，被開發者們指點了不少年了，現在他也添加了很多的新的功能。Apple如今是鼓勵開發者們使用Storyboards來進行頁面的開發的，雖然一直尚未徹底那些代碼寫界面的所接受，可是我覺的這將會是以趨勢。

原文連接

再開始以前我覺的你能夠先去看下這個視頻，這是WWDC2015上關於這部分的介紹。這個視屏字幕是翻譯成中文的。視頻連接

項目初始地址

Storyboard references

若是你已經看過了上邊的那個視頻，那麼你就會知道Storyboard references這個功能有多麼棒。

若是你曾經使用 interface builder 建立過一個複雜、界面很是多的應用，你就會明白最後那些Storyboards 文件變的有多大。他會迅速變的沒法管理，阻礙你的進度。自從引入 Storyboard 以來，實際上是能夠把你的應用的不一樣模塊切開到不一樣的 Storyboard 中的。在過去，這要手動建立多個 Storyboard 文件，而且要寫大量的代碼。

爲了解決這個問題，在 iOS 9 中蘋果介紹了 Storyboard References 這個概念。Storyboard References 容許你從 segue 中引用其餘 storyboard 中的 viewController。這意味中你能夠保持不一樣功能模塊化，同時 Storyboard 的體積變小並易與管理。不只容易理解了，和團隊一塊兒工做時，合併（工做成果）也變的簡單了。

Creating your first storyboard reference

打開咱們的項目來建立你的第一個storyboard reference，打開Main.storyboard，選擇除了tar bar controller以外的全部視圖控制器，而後選擇Editor\Refactor to storyboard And 輸入Checklists.storyboard 做爲這個新的故事版的名稱。而後點擊存儲。

你的新的故事版的樣子應該是下邊這個樣子：

而你的原來的故事版將會是這個樣子：

接下來咱們在Main.storyboard中選擇名字是ChecklistsNavigationController的references在屬性面板中刪除Referenced ID裏的值。

修改以後就回變成下邊的樣子

打開你的Checklists.storyboard 選擇Checklists Navigation Controller在屬性面板中選中Is Initial View Controller。

咱們也能夠從Object Library中拖進來一個Storyboard reference控件。

Views in the scene dock

在咱們項目中的ChecklistDetail.storyboard中選擇Checklist Detail View Controller，從Object Library拖出一個View放在secne dock

你會不會嚇一跳。但是你會想，額。咱們怎麼去使用它呢。咱們先來一個簡單的使用吧。

選中這個View在屬性欄中將背景顏色設置爲#FFFAE8

從ChecklistItemCell拖出Ctrl-drag到你的這個view中，選擇selectBackgroundView

而後你運行你的項目，點擊任何cell

Conditional views using the scene dock

咱們常常會想建立一個只須要在特定條件下才顯示的view。咱們可使用scene dock來方便的實現這一點。

咱們仍然在ChecklistDetail.storyboard中拖進來一個 View在scene dock中，將剛纔的那個設置過背景顏色的View的寬高設置爲321;128。

在這個新的View中拖進來一個label和text View。設置label的文字是notes，顏色設置爲#BB991E：

將 textView的屬性中editable和selectable不要勾選。就像下邊的這個樣子：

接下來咱們在代碼中將新添加進來的view和這個textView作一個關聯。

在ChecklistDetailViewController.swift中添加兩個方法，一個是用來顯示新添加進來的View另一個天然是移除了。

func addNotesViewToCell(cell:ChecklistItemTableViewCell){
        notesVIew.heightAnchor.constraintEqualToConstant(notesViewHeight).active = true
        notesVIew.clipsToBounds = true
        
        cell.stackView.addArrangedSubview(notesVIew)
    }
    
    func removeNotesView(){
        if let stackview = notesVIew.superview as? UIStackView{
            stackview.removeArrangedSubview(notesVIew)
            notesVIew.removeFromSuperview()
        }
    }

上邊的方法能夠確保自動佈局定義筆記的高度，而後將其添加到對應的單元格中，他還設置了clipsToBounds爲true，以防止文本視圖從cell中外溢。

接下來就是使用這兩個方法了。在ChecklistDetailViewController.swift中完成下邊的方法。

override func tableView(tableView: UITableView, didSelectRowAtIndexPath indexPath: NSIndexPath) {
        //1
        guard let cell = tableView.cellForRowAtIndexPath(indexPath) as? ChecklistItemTableViewCell else {return}
        //2調用這個方法來以動畫更改單元格的高度
        tableView.beginUpdates()
        //3 若是cell的stackView已經包含了它則刪除，若是沒有則添加
        if cell.stackView.arrangedSubviews.contains(notesVIew){
            removeNotesView()
        }else{
            addNotesViewToCell(cell)
            
            notesTextView.text = checklist.items[indexPath.row].notes
        }
        //5 最後來條用這個方法來提交更改。
        tableView.endUpdates()
        
    }

接下里運行你的程序就會看到下邊的效果。

Using multiple bar buttons

在故事版中給Checklist Detail View Controller拖進來兩個bar button item放在navigation bar 的右邊，給其中一個的圖片設置爲AddButtonicon

從addbutton拖拽出一天線到add item navigation controller從彈出來的菜單中選擇present modally。這樣的話咱們點擊add button則會彈出一個新的界面。

接下來咱們須要給咱們彈出的界面添加消失的功能。

在checklistDetail.storyboard中選擇add item view controller，從Cancel按鈕中拖出一條線到Exit，從彈出的菜單中選擇cancelToChecklistDetailViewController

一樣的方法給save按鈕添加saveToChecklistDetailViewController

運行一下程序來看下效果吧。

咱們在最後的最後來添加刪除cell的功能。

在ChecklistDetailViewController.swift中完成下邊的方法。

viewDidLoad中添加

navigationItem.rightBarButtonItems![1] = editButtonItem()

重寫下邊的方法

override func tableView(tableView: UITableView, commitEditingStyle editingStyle: UITableViewCellEditingStyle, forRowAtIndexPath indexPath: NSIndexPath) {
        if editingStyle == .Delete{
            removeNotesView()
            checklist.items.removeAtIndex(indexPath.row)
            tableView.deleteRowsAtIndexPaths([indexPath], withRowAnimation: .Fade)
        }
    }