This article covers how do you create a tab based application in an ISOS Application.
At first you Create a new Project and Click on Single View Application and name it accordingly.
After creation of the project, open the storyboard and you can see a single view controller which is connected to class ViewController.
Just drag a place a label inside that view controller and changes it’s text to say “Tab content”.
Create a new Tab2ViewController.h and Tab2ViewController.m files by copying ViewController.h and .m for now. You can have your own ViewController.
Now drag a new controller to the storyboard and set its Class in the attributes inspector to “Tab2ViewController”
[Make sure you set the class otherwise the app will not connect that NIB to the corresponding class].
The important thing.
You need to set the StoryBoardID for each NIB in the attributes inspector.
Take a look at the below Screenshot.
Now we have two view controllers
Your storyboard should look like this now.
we are going to create 5 tabs dynamically and keep each view controller alternately for now.
You can have 5 different view controllers and place it on each tab.
Go to App Delegate.h and create a varaible for TabbarController.
AppDelegate.h
#import <UIKit/UIKit.h>
@interface AppDelegate : UIResponder <UIApplicationDelegate>{
UITabBarController *tabBarController;
}
@property (strong, nonatomic) UIWindow *window;
@property (strong, nonatomic) UITabBarController *tabBarController;
@end
Now go to AppDelegate.m and write a function addTabs which is given below.
-(void) addTabs
{
NSMutableArray *listOfViewControllers = [[NSMutableArray alloc] init];
UIStoryboard* sb = [UIStoryboard storyboardWithName:@"Main" bundle:nil];
UIViewController* vc0 = [sb instantiateViewControllerWithIdentifier:@"ViewController"];
[listOfViewControllers addObject:vc0];
UIViewController *vc1 = [sb instantiateViewControllerWithIdentifier:@"Tab2ViewController"];
[listOfViewControllers addObject:vc1];
UIViewController *vc2 = [sb instantiateViewControllerWithIdentifier:@"ViewController"];
[listOfViewControllers addObject:vc2];
UIViewController *vc3 = [sb instantiateViewControllerWithIdentifier:@"Tab2ViewController"];
[listOfViewControllers addObject:vc3];
UIViewController *vc4 = [sb instantiateViewControllerWithIdentifier:@"ViewController"];
[listOfViewControllers addObject:vc4];
tabBarController = [[UITabBarController alloc] init];
[tabBarController setViewControllers:listOfViewControllers animated:YES];
UITabBar *tabBar = self.tabBarController.tabBar;
UITabBarItem *item0 = [tabBar.items objectAtIndex:0];
UITabBarItem *item1 = [tabBar.items objectAtIndex:1];
UITabBarItem *item2 = [tabBar.items objectAtIndex:2];
UITabBarItem *item3 = [tabBar.items objectAtIndex:3];
UITabBarItem *item4 = [tabBar.items objectAtIndex:4];
//UITabBarItem *item5 = [tabBar.items objectAtIndex:5];
NSArray *tabTitles = [NSArray arrayWithObjects:@"Tab 1", @"Tab 2", @"Tab 3", @"Tab 4", @"Tab 5", nil];
[item0 initWithTitle:tabTitles[0] image:[UIImage imageNamed:@"tab1_img.png"] selectedImage:[UIImage imageNamed:@"tab1_img.png"]];
[item1 initWithTitle:tabTitles[1] image:[UIImage imageNamed:@"tab1_img.png"] selectedImage:[UIImage imageNamed:@"tab1_img.png"]];
[item2 initWithTitle:tabTitles[2] image:[UIImage imageNamed:@"tab1_img.png"] selectedImage:[UIImage imageNamed:@"tab1_img.png"]];
[item3 initWithTitle:tabTitles[3] image:[UIImage imageNamed:@"tab1_img.png"] selectedImage:[UIImage imageNamed:@"tab1_img.png"]];
[item4 initWithTitle:tabTitles[4] image:[UIImage imageNamed:@"tab1_img.png"] selectedImage:[UIImage imageNamed:@"tab1_img.png"]];
[self.window addSubview:self.tabBarController.view];
tabBarController.view.autoresizingMask=(UIViewAutoresizingFlexibleHeight);
self.window.rootViewController = tabBarController;
}
make sure you have an image named “tab1_img.png” image in your project folder.
Now call the above function in
- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions {
[self addTabs];
return YES;
}
The whole AppDelegate.m looks like this.
#import "AppDelegate.h"
@interface AppDelegate ()
@end
@implementation AppDelegate
@synthesize tabBarController;
- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions {
// Override point for customization after application launch.
[self addTabs];
return YES;
}
-(void) addTabs
{
NSMutableArray *listOfViewControllers = [[NSMutableArray alloc] init];
UIStoryboard* sb = [UIStoryboard storyboardWithName:@"Main" bundle:nil];
UIViewController* vc0 = [sb instantiateViewControllerWithIdentifier:@"ViewController"];
[listOfViewControllers addObject:vc0];
UIViewController *vc1 = [sb instantiateViewControllerWithIdentifier:@"Tab2ViewController"];
[listOfViewControllers addObject:vc1];
UIViewController *vc2 = [sb instantiateViewControllerWithIdentifier:@"ViewController"];
[listOfViewControllers addObject:vc2];
UIViewController *vc3 = [sb instantiateViewControllerWithIdentifier:@"Tab2ViewController"];
[listOfViewControllers addObject:vc3];
UIViewController *vc4 = [sb instantiateViewControllerWithIdentifier:@"ViewController"];
[listOfViewControllers addObject:vc4];
tabBarController = [[UITabBarController alloc] init];
[tabBarController setViewControllers:listOfViewControllers animated:YES];
UITabBar *tabBar = self.tabBarController.tabBar;
UITabBarItem *item0 = [tabBar.items objectAtIndex:0];
UITabBarItem *item1 = [tabBar.items objectAtIndex:1];
UITabBarItem *item2 = [tabBar.items objectAtIndex:2];
UITabBarItem *item3 = [tabBar.items objectAtIndex:3];
UITabBarItem *item4 = [tabBar.items objectAtIndex:4];
//UITabBarItem *item5 = [tabBar.items objectAtIndex:5];
NSArray *tabTitles = [NSArray arrayWithObjects:@"Tab 1", @"Tab 2", @"Tab 3", @"Tab 4", @"Tab 5", nil];
[item0 initWithTitle:tabTitles[0] image:[UIImage imageNamed:@"tab1_img.png"] selectedImage:[UIImage imageNamed:@"tab1_img.png"]];
[item1 initWithTitle:tabTitles[1] image:[UIImage imageNamed:@"tab1_img.png"] selectedImage:[UIImage imageNamed:@"tab1_img.png"]];
[item2 initWithTitle:tabTitles[2] image:[UIImage imageNamed:@"tab1_img.png"] selectedImage:[UIImage imageNamed:@"tab1_img.png"]];
[item3 initWithTitle:tabTitles[3] image:[UIImage imageNamed:@"tab1_img.png"] selectedImage:[UIImage imageNamed:@"tab1_img.png"]];
[item4 initWithTitle:tabTitles[4] image:[UIImage imageNamed:@"tab1_img.png"] selectedImage:[UIImage imageNamed:@"tab1_img.png"]];
[self.window addSubview:self.tabBarController.view];
tabBarController.view.autoresizingMask=(UIViewAutoresizingFlexibleHeight);
self.window.rootViewController = tabBarController;
}
- (void)applicationWillResignActive:(UIApplication *)application {
// Sent when the application is about to move from active to inactive state. This can occur for certain types of temporary interruptions (such as an incoming phone call or SMS message) or when the user quits the application and it begins the transition to the background state.
// Use this method to pause ongoing tasks, disable timers, and throttle down OpenGL ES frame rates. Games should use this method to pause the game.
}
- (void)applicationDidEnterBackground:(UIApplication *)application {
// Use this method to release shared resources, save user data, invalidate timers, and store enough application state information to restore your application to its current state in case it is terminated later.
// If your application supports background execution, this method is called instead of applicationWillTerminate: when the user quits.
}
- (void)applicationWillEnterForeground:(UIApplication *)application {
// Called as part of the transition from the background to the inactive state; here you can undo many of the changes made on entering the background.
}
- (void)applicationDidBecomeActive:(UIApplication *)application {
// Restart any tasks that were paused (or not yet started) while the application was inactive. If the application was previously in the background, optionally refresh the user interface.
}
- (void)applicationWillTerminate:(UIApplication *)application {
// Called when the application is about to terminate. Save data if appropriate. See also applicationDidEnterBackground:.
}
@end
All done.
Just Go on and run the application.
You can download the complete source code from here.