KH的程式世界: [iOS] UINavigationController & Segue

我是UINavigationController，我可以幫你以下一頁、下一頁的方式導覽頁面，當然也可以依序退回上一頁。

我是Segue，我負責頁面場景的轉換，讓您可以轉換至下一個頁面

UINavigationController說：「那我們合作吧，我來以導覽的方式導覽每個t，你Segue負責場景的轉換」

第1步：建立一個名為"UINavigationController_Segue"的"Single View Application"專案。

第2步：刪除Main.storyboard上預設的ViewController，同時刪除ViewController.h與ViewController.m檔

第3步：加入UINavigationController

於Main.storyboard中加入UINavigationController，因目前的Main.storyboard中無任何Controller，因此會自動被預設為啟動的Controller

刪除UINavigationController預設的UITableController，選取Root View Controller後按delete鍵刪除

第4步：建立台北車站、善導寺與忠孝新生等ViewController

加入3個ViewController至Main.storyboard中
在台北車站TaipeiViewController中加入UILabel，設定文字為"台北車站"，並加入下一站Button
在善導寺ShandaoViewController中加入UILabel，設定文字為"善導寺"，並加入下一站與上一站的Button
在忠孝新生ZhongxiaoViewController中加入UILabel，設定文字為"忠教新生"，並加入上一站的Button

並分別建立TaipeiViewController、ShandaoViewController與ZhangxiaoViewController類別，皆繼承自UIViewController

將TaipeiController類別與畫面上的ViewController對應起來

將ShandaoController類別與畫面上的ViewController對應起來

將ZhongxiaoController類別與畫面上的ViewController對應起來

第5步：設定台北車站ViewController為預設Controller

對UINavigationController按右鍵，托拉root view controller至此新的ViewController上，以成為預設的ViewController

第6步：加入Segue轉場

加入台北至善導寺的Segue轉場，對台北TapeiViewController按右鍵，在Trigered Segues處的manual圓圈處按住托拉至善導寺ShandaoViewController，以建立Segue，注意，此Segue是以push的方式配合UINavigationController導覽至下一頁
接著選取此Segue，將Identifier改為"go_shandao"

加入善導寺至忠孝新生的Segue轉場，對善導寺ShandaoViewController按右鍵，在Trigered Segues處的manual圓圈處按住托拉至忠孝新生ZhangxiaoViewController，以建立Segue，注意，此Segue是以push的方式配合UINavigationController導覽至下一頁

接著選取此Segue，將Identifier改為"go_zhangxiao"

第7步：觸發Segue至下一站

台北車站至下一站善導寺站時，這時可透過performSegueWithIdentifier:sender:訊息，搭配Identifier為go_shandao的segue，轉場至善導寺shandao場景

TaipeiViewController.m


- (IBAction)next:(id)sender {
    //透過performSegueWithIdentifier:sender:訊息，
    //透過Identifier為go_shandao的segue，
    //轉場至善導寺Shandao場景
    [self performSegueWithIdentifier:@"go_shandao" sender:self];
}

善導寺站至下一站忠孝新生站時，這時可透過performSegueWithIdentifier:sender:訊息，搭配Identifier為go_zhangxiao的segue，轉場至忠孝新生zhangxiao場景

ShandaoViewController.m


- (IBAction)next:(id)sender {
    //透過performSegueWithIdentifier:sender:訊息，
    //透過Identifier為go_zhangxiao的segue，
    //轉場至忠孝新生zhangxiao場景
    [self performSegueWithIdentifier:@"go_zhangxiao" sender:self];
}

第7步：回上一站

對善導寺ShandaoViewController加入回上一站的功能。於ShandaoViewController畫面中對"上一站"按鈕的Touch Inside Up綁定IBAction，加入pre:方法，於pre:方法中透過popViewControllerAnimated:訊息回至上一站

ShandaoViewController.m

對忠孝新生ZhangxiaoViewController加入回上一站的功能。於ZhangxiaoViewController畫面中對"上一站"按鈕的Touch Inside Up綁定IBAction，加入pre:方法，於pre:方法中透過
popViewControllerAnimated:訊息回至上一站

ZhongxiaoViewController.m

第8步：執行

透過UINavigationController與Segue的搭配，UINavigationController可以以導覽的方式至下一站的頁面，但轉換至下一站的方式已改成以Segue的方式進行行

檔案連結：UINavigationController_Segue.zip

透過Segue於場景間傳遞資料：

若要在每一頁場景間傳遞資料，可以透過改寫prepareForSegue:sender:方法，達到傳遞資料的目的，而每個Segue在轉場前，皆會呼叫此方法以達到轉場前轉到資料與傳遞資料的目的
比如台北車站轉場至善導寺，這時可在台北TaipeiViewController中加入下列程式，改寫prepareForSegue:sender:方法：


- (void)prepareForSegue:(UIStoryboardSegue *)segue sender:(id)sender
{
    //先判斷轉場的Segue是否為go_shandao
    if ([[segue identifier] isEqualToString:@"go_shandao"])
    {
        //透過destinationViewController訊息，
        //取得下一個場景的Controller，
        //即ShandaoViewController，
        ShandaoViewController *vc = [segue destinationViewController];

        //設定ShandaoViewController所需的資料，
        //在此ShandaoViewController假設有個setWho:訊息，
        //用以設定誰到了下一站
        [vc setWho:@"Jack"];
    }
}

KH的程式世界

fb_license

技術標籤

2014/04/08

[iOS] UINavigationController & Segue