1. 程式人生 > >IOS學習之Tab Bar的使用和檢視切換

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.
}
複製程式碼