Storyboard的使用以及使用多個Storyboard的方法


更多技術性文章請關注 合伙呀 

一, storyboard用起來很是方便。在開發中很有可能是多個人創建了多個storyboard。但最后,總是要把所有的storyboard“合並”在一起。總結一下自己的想法,不知道有沒有其他的方式“合並”。

       創建一個使用storyboard和ARC的single view application工程。然后common + N -> User Interface -> Storyboard,將這個storyboard命名為SecondStoryboard。那么現在工程內文件如下圖所示

           

MainStoryboard的布局如下所示:ViewController中有一個button,關聯方法btnPressed

SecondStoryboard中的布局如下所示:viewController的背景色是紅色,用以區別。


這里還需要做的一件事情是在secondstoryboard的viewcontroller中,將其identifier設置為firstVC.

接下來,完成btnPressed方法

 

- (IBAction)btnPressed:(id)sender {


    UIStoryboard *secondStoryboard = [UIStoryboard storyboardWithName:@"SecondStoryboard" bundle:nil];

    UIViewController *firstVC = [secondStoryboard instantiateViewControllerWithIdentifier:@"firstVC"];

 

    [self.navigationController pushViewController:firstVC animated:YES];

}

storyboard還有一個實例方法 - (id)instantiateInitialViewController;這個方法也可以初始化firstVC,之所以沒有用,是因為在 MainStoryboard中已經有一個NavigationController,不能在一個navigationcontroller里包含另外一 個navigationcontroller!!

這樣,運行之后,點擊按鈕就會push到紅色的view controller。

 

storyboard是在ios5中引入的新控件,能夠更加清晰、簡單的整合多個ViewController的關系

  1. 首先利用xcode4.2創建一個新項目,選擇空工程:

image

2.填寫項目名稱和勾選使用ARC

image

 

3、注釋掉AppDelegate中的以下代碼。

- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions 

//    self.window = [[UIWindow alloc] initWithFrame:[[UIScreen mainScreen] bounds]]; 
//    // Override point for customization after application launch. 
//    self.window.backgroundColor = [UIColor whiteColor]; 
//    [self.window makeKeyAndVisible]; 
    return YES; 
}

4、添加storyboard控件,起名叫MainStoryBoard

image

5、添加MainStoryBoard到工程中

image

6.在MainStoryBoard中添加viewController控件

image

7、編譯運行

image


 

下面以一個實際項目來,分上面三步來詳細介紹一下storyboard的使用

第一步:創建UITabBarViewController、UINavgationController、UIViewController共同使用

最后實現的storyboard的效果是:

image


介紹一下上面的結構,其中tabBarController是storyboard的開始視圖,見下圖:

image

由tabBarController分出三個子視圖,其中前兩個子視圖是navigationcontroller,一個是viecontroller。其中navigationcontroller中有相應的子viewcontroller。

下面開始實現上面的工程:

1)創建一個工程叫stroyboarddemo,選擇空工程

image

創建好之后的截圖:

image

2)添加一個storyboard

image

起名為:Storyboard,打開初創建的storyboard,可以看到什么也沒有。

image

3)添加一個tabBarController

image

image

image

4)把storyboard添加到工程中。在NationalLibraryConteollerAppDelegate中添加下面的代碼。

- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions 

    self.window = [[[UIWindow alloc] initWithFrame:[[UIScreen mainScreen] bounds]] autorelease]; 
    // Override point for customization after application launch. 
    self.window.backgroundColor = [UIColor whiteColor]; 
    [self.window makeKeyAndVisible]; 
    
    
    UIStoryboard *stryBoard=[UIStoryboard storyboardWithName:@"Storyboard" bundle:nil]; 
    self.window.rootViewController=[stryBoard instantiateInitialViewController]; 
    
    return YES; 
}

首先是獲取到storyboard的引用,然后是找到跟controller。

5)編譯運行代碼。

image

6)下面把tabBarController的子視圖換成navigationcontroller

打開soryboard,刪除tabBarController的孩子。

image

然后添加兩個navigationcontroller

image

navigationcontroller和tabBarController關聯起來。

按住control建拖動鼠標,選擇關聯即可。

image

image

下面修改兩個navigationcontroller跟controller的view的顏色。

image

7)在次編譯運行。

imageimage

8)在navigationcontroller中在添加孩子視圖

我先添加了三個viewcontroller

image

然后他們分別與控制器相連,相連之前先在相應的父視圖中添加一個下一頁的按鈕。

image

下面按鈕和新添加的viewcontroller相聯系

image

同樣在添加其他的按鈕。

image

9)運行

imageimage

imageimageimage

目前為止,我們還沒有添加一行代碼,即可實現一個相對比較復雜的控制器。雖然實現了一個比較復雜的控制器的框架,但是在實際項目中,每個視圖中的數據可能是動態加載的,這時候我們需要和代碼相關聯。接下來我將介紹一下storyboard怎么和相應的代碼相關聯。

10)、添加相應viewcontroller的實體類FirstViewController

image

11)、把FirstViewController和相應的視圖相關聯

image

12)在FirstViewController中添加按鈕的事件。

-(IBAction)onClickButton:(id)sender 

    NSLog(@"FirstViewController on click button"); 
}

並且和相應的按鈕相關聯。

13)運行,當點擊綠色視圖中的下一頁的時候,出現日志:

image

因為按鈕有兩個事件,一個是執行上述方法,還有一個作用是壓棧下一個視圖進入控制器。其先后順序是先執行方法在壓棧。

第二步、xib和storyboard共同使用

我們常需要實現以下需求,首先是一個登錄頁面或者是注冊頁面。登錄成功之后跳入到上面復雜的導航界面。下面詳細介紹一下怎么實現一個xib實現的登錄頁面,跳轉到storyboard的導航頁面。

1)先創建一個登錄頁面LoginViewController

image

2)修改NationalLibraryConteollerAppDelegate,先進入登錄頁面。

- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions 

    self.window = [[[UIWindow alloc] initWithFrame:[[UIScreen mainScreen] bounds]] autorelease]; 
    // Override point for customization after application launch. 
    self.window.backgroundColor = [UIColor whiteColor]; 
    [self.window makeKeyAndVisible]; 
    
    LoginViewController *loginViewController=[[LoginViewController alloc] initWithNibName:@"LoginViewController" bundle:nil]; 
//    UIStoryboard *stryBoard=[UIStoryboard storyboardWithName:@"Storyboard" bundle:nil]; 
    self.window.rootViewController=loginViewController;//[stryBoard instantiateInitialViewController]; 
    
    return YES; 
}

3)運行即可。

image

4)在xib中,添加登錄按鈕。

image

5)添加登錄按鈕相應的事件

-(IBAction)onClickButton:(id)sender 

    
}

6)xib和按鈕事件相關聯

image

7)按鈕事件和上面的復雜控制器相關聯

-(IBAction)onClickButton:(id)sender 

    UIStoryboard *stryBoard=[UIStoryboard storyboardWithName:@"Storyboard" bundle:nil]; 
    self.view.window.rootViewController=[stryBoard instantiateInitialViewController]; 
}

8)運行

imageimage

第三步是多個storyboard共同使用

多人合作或者項目有一定的復雜度,使用一個storyboard,肯定使storyboard復雜,我們可以根據需求把復雜的邏輯拆分成若干個storyboard。

1)我們在上面的基礎上在添加一個tabBarController的孩子

image

2)添加一個ManagerViewController

image

3)、新添加的ManagerViewController和相應的控制器相關聯

image

4)在視圖中添加按鈕

image

5)在ManagerViewController中添加按鈕事件

-(IBAction)onClickButton:(id)sender 
{

}

6)按鈕事件和視圖按鈕相關聯

image

7)添加一個新的storyboard,叫做second

image

8)添加導航器

image

9)在ManagerViewController的按鈕事件中導航進入second即可

-(IBAction)onClickButton:(id)sender 

    UIStoryboard *stryBoard=[UIStoryboard storyboardWithName:@"second" bundle:nil]; 
    [self presentModalViewController:[stryBoard instantiateInitialViewController] animated:YES]; 
}

10)運行

imageimageimageimageimage

 

上面就是使用storyboard實現一個相對比較復雜的項目。


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM