Summary of TabBar implementation without Story Board in Xcode5

Large 4772464134

photo credit: Enokson via photopin cc

Good evening, this is Bono.

As anyone who has used them will know, Xcode's Story Board and Interface Builder look nice but are actually quite difficult to use.

The most troublesome thing is that you cannot see the back side of how the view and viewController work.

So I implemented it without these tools to understand how it works.

Incidentally, there were rather many ways to implement this in Xcode4.X, but there was still very little information on Xcode5.X.
I hope this is helpful.

Note that we are testing with Xcode 5.0.2 (latest as of 1/2/2014).

Try to implement TabBar without Story Board

Start with Empty Application

Open Xcode and go to "New" >"Project" and open "Empty Application".

The Product Name is assumed here to be TabTest.

Screenshot 2014 01 03 0 36 31

Prepare the necessary materials

Here are two tabs for you to try out.

Create "FirstViewController" and "SecondViewController".

Screenshot 2014 01 03 0 45 08
Screenshot 2014 01 03 0 45 52

Slightly modified Delegate file

Make slight modifications as follows.

AppDelegate.h file #import <UIKit/UIKit.h>

@interface AppDelegate : UIResponder <UIApplicationDelegate>

@property (strong, nonatomic) UIWindow *window;
@property (strong, nonatomic) UITabBarController *tabBarController; //追加


AppDelegate.m file

#import "AppDelegate.h"
#import "FirstViewController.h" //追加
#import "SecondViewController.h" //追加

@implementation AppDelegate

@synthesize window; //追加
@synthesize tabBarController; //追加

- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions
    self.window = [[UIWindow alloc] initWithFrame:[[UIScreen mainScreen] bounds]];
    self.tabBarController = [[UITabBarController alloc]initWithNibName:nil bundle:nil]; //追加
    FirstViewController *firstViewController = [[FirstViewController alloc] initWithNibName:nil bundle:nil]; //追加
    SecondViewController *secondViewController = [[SecondViewController alloc] initWithNibName:nil bundle:nil]; //追加
    tabBarController.viewControllers = [NSArray arrayWithObjects:firstViewController, secondViewController, nil]; //追加
    firstViewController.tabBarItem = [[UITabBarItem alloc]initWithTitle:@"tab1" image:nil selectedImage:nil]; //追加
    secondViewController.tabBarItem = [[UITabBarItem alloc]initWithTitle:@"tab2" image:nil selectedImage:nil]; //追加

    //root viewを設定しないと警告が出る
    [self.window setRootViewController:tabBarController]; //追加

    self.window.backgroundColor = [UIColor whiteColor]; 

    [window makeKeyAndVisible];

    // Override point for customization after application launch.
    return YES;

View is prepared and completed.

After that, change the contents of "FirstViewController" and "SecondViewController" as you like, and you are done.

Screenshot 2014 01 03 1 23 10


I looked at many, but the following two sites were the easiest to understand.

iPhone App Study Group Application Development without Interface Builder

The most basic iPhone app development without Interface Builder -

After that, the following book is also recommended for those who want to create and understand other UIs using only code.
The only book I know of, and probably the only book that explains the implementation in code only.