讀書筆記【2】 初探Storyboard

SuperDanny發表於2017-12-13

以前一直使用xib,後來來到新公司就使用純程式碼。從來沒有用過Storyboard(中文稱故事板),今天趁有幾分興致,在學習繪圖的同時練練故事板。這裡做一下筆記,方便以後檢視。如果大家有什麼Storyboard使用技巧可以留言分享喲!

建立一個基於Navigation Controller的根檢視

  1. 首先,我們選中預設生成的View Controller,在Editor -> Embed In 中有Navigation ControllerTab Bar Controller兩個選項(圖一),我們選擇嵌入Navigation Controller

    圖一

  2. 另外拖一個Table View Controller到故事板中,選中Table View Controller的Table View。開啟Attrbutes inspector,將Content設定為Static Cells,layout area中的Table View上出現了3個Cell。

  3. 我們依次給每一個Cell設定不同的背景顏色,並依次選中3個Table View Cell,然後在Attributes inspector中將他們的Style改成Basic並給每一個Cell設定標題(圖二)。

    圖二


繫結跳轉事件

  1. 腦補時刻,先講解一下一些關鍵的跳轉事件
  • Selection Segue:當使用者點選table view cell的任何部分,都會產生反應。
  • Accessory Action:只有當使用者點選table view cell右邊的圓圈箭頭按鈕時,才會產生的反應。
  • Show:在master或detail區域展現內容(典型的如iPad的設定介面,左側是master,右側是detail),究竟是在哪個區要取決於螢幕上的內容,如果不分master/detail,就單純的把新的內容push到當前view controller stack的頂部
  • Show Detail:大致同Show,在detail區域展現內容,如果不分master/detail,新的內容取代當前view controller stack的頂部
  • Present Modally:模態展示內容
  • Present as Popover:在當前的view上出現一個小視窗來展示內容,無處不在的“選中文字後出現 複製/翻譯 按鈕就是這個
  • Custom:自定義的
  1. 我們選中第一個Cell,按住Control鍵拖拉到要跳轉的檢視,在彈出的選項窗中選擇show,這樣就完成了頁面跳轉操作。接下來2個Cell也是同樣的操作。

修改Navigation Bar標題

  1. 在Table View Controller上中選中Navigation Item(圖三)。

    圖三

  2. Attributes inspectorTitle設定為“繪圖技術”,將Back Button設值為“繪圖”(圖四)。

    圖四

注意,這裡的Back Button並不是顯示在當前的Navigator Bar上的,而是顯示在下一個sub view controller的navigator bar上的返回按鈕的文字

ViewController

ViewController之間的資料傳遞

當你從當前scene中觸發一個segue的時候,系統會自動呼叫prepareForSegue:sender:這個方法。如果你想從一個介面切換到裡另一個介面的時候傳遞資料,你應該override這個方法。 比如: 檢視A -> 檢視B

- (void)prepareForSegue:(nonnull UIStoryboardSegue *)segue sender:(nullable id)sender {
    ThreeViewController *b_vc = segue.destinationViewController;
    //我們傳遞了一個字串到檢視B
    b_vc.str = @"dataStr";
}
複製程式碼

ViewController之間的跳轉

在上文中我提及到通過繫結事件進行ViewController之間的跳轉。這裡羅列一下有三種情況可進行跳轉:

  1. 如果在Storyboard中當前的ViewController和要跳轉的ViewController之間的segue存在,則可以執行performSegueWithIdentifier:sender:這個方法實現跳轉。

  2. 如果目標ViewController存在Storyboard中,但是沒有segue。你可以通過UIStoryboardinstantiateViewControllerWithIdentifier:這個方法獲取到它,然後再用你想要的方式實現跳轉,如:壓棧。

  3. 如果目標ViewController不存在,則需要我們建立好ViewController才能進行接下來的操作。


學習感悟

在學習Storyboard過程中,慢慢有所感悟,在這裡記錄一下。可能我說的不一定是最好的,但是會再學習的過程中慢慢提升。

  1. 當Storyboard中如果VC的數量越來越多的時候,可能會出現一種情況就是,使用者要定位到某一個VC比較困難。所以我在每一個VC的Title屬性都設定成該VC的類名(圖五),方便以後可直接在Document Outline介面定位(圖六)

圖五
圖六

今天暫時就講這些,後面會將文章補全。

再一次感謝您花費時間閱讀這篇文章!

微博: @Danny_呂昌輝
部落格: SuperDanny

2015 年 08月 18日

相關文章