iOS學習之Tab Bar的使用和視圖切換

在iOS的程式中，Tab Bar的使用率很高，幾個視圖需要切換的時候，就用到tabbar。

今天的程式實現的效果是這樣的，底部有幾個tab Item，對應的有幾個視圖，切換tab Item，切換到對應的視圖。

實現效果如下：

 

為了更好理解使用用tabbar和切換視圖，我們建立一個Empty Application。

1、開啟Xcode ，建立項目

2、建立View Controller 

在項目上按花鍵+N建立新檔案，建立 Objective-C class 檔案，按Next按鈕，subClass 選UIViewController 。勾選上  xib選項

以同樣方式建立另外三個ViewController ,RedViewController ,GreyViewController,YellowViewController。四個View準備好了。那麼Tabbar呢？

3、建立TabBarController.xib檔案，選擇建立Empty檔案

這時候你發現建立的xib檔案是空白的，不用慌，去右下角控制項欄中把TabBar Controller拖過來就Ok了。

4、關聯TabBarController.xib ,tabbarAppDelegate這兩個檔案

在中選擇File’s Owner，開啟Identity Inspector，在Class一欄選擇tabbarAppDelegate

 

這樣，我們就可以建立TabBarController.xib 檔案指向tabbarAppDelegate 檔案的Outlet映射了。

5、在Xcode中的工具列的View菜單找到 開啟Assistant Editor，使tabbarAppDelegate.h和TabBarController.xib 同時開啟。

在xib檔案上按住control鍵，往tabbarAppDelegate.h，建立Outlet.

快顯視窗輸入 rootController,點connect。

 6、添加代碼

開啟tabbarAppDelegate.m，在didFinishLaunchingWithOptions方法中添加代碼：

- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions{    self.window = [[UIWindow alloc] initWithFrame:[[UIScreen mainScreen] bounds]];    // Override point for customization after application launch.    [[NSBundle mainBundle] loadNibNamed:@"TabBarController" owner:self options:nil];    [self.window addSubview:self.rootController.view];    self.window.backgroundColor = [UIColor whiteColor];    [self.window makeKeyAndVisible];    return YES;}

7、  往TabBarController.xib上添加Tab Bar Item,

把控制項欄上的Tab Bar Item控制項往TabBarController.xib上拖拽即可，一個放4個。

8、關聯Tab Bar Item和***ViewController。

選擇其中一個Tab Bar Item，在右上方開啟Identity Inspector，在Class中選擇BlueViewController：

然後，開啟Attribute，在NIB Name選擇BlueViewController

其他3個tab item重複類似的操作，選中對應的ViewController,這樣在切換Tab標籤時，就可以切換到對應的頁面。  9、設定tab item的屬性選中其中一個tab item ,會在右上方的屬性欄裡看到如下資訊

Badge是紅色圈圈裡面有數字 ，表示有多少條資訊的屬性Identifier 是tab item的樣式，選custom是自訂，下面的是系統的樣式。我選了其中四種。bar ITem 的title image在custom的樣式下能設定。10、剩下的3個Tab Item也做類似的設定即可。現在基本完工，運行看看結果如何。好吧，其實和第一第二個圖是一樣的，這裡就不放了。11、在viewDidLoad方法加Log觀察切換View可以加寫日誌看看對應的View是什麼時候啟動並執行。第一個啟動並執行View是BlueViewController，點擊其他的tab項時，載入其他的view，載入一次之後下次點擊不再調用viewDidLoad。

- (void)viewDidLoad{    [super viewDidLoad];    NSLog(@"BlueViewController");    // Do any additional setup after loading the view from its nib.}

代碼擷取：https://github.com/schelling/YcDemo