Adrian Collins
Adrian Collins

Reputation:

Tab Bar Application With Navigation Controller

I have a simple iPhone app that has a tab bar and 3 tabs. Each tab loads as a separate nib with a corresponding controller. Each nib contains a tableview with some other controls for searching/filtering etc.

What I would like (and cant seem to find an example of) is adding a navigation controller to the app so each nib (i.e. each tab) can drill down to further detail pages.

Should I be adding a navigation controller to the main window and creating an IBOutlet for it or should the NC be added to the nibs.

Upvotes: 45

Views: 69666

Answers (8)

Paresh Thakor
Paresh Thakor

Reputation: 1835

The question is too old but SDKs are upgraded and some readers might need new answer. So, now for storyboard users, the answer to use both Tabbar and Navigation controller is pretty simple.

  1. Drag Navigation Controller inside storyboard.
  2. Assign the startup arrow to the new Navigation Controller making the controller as a starting point.
  3. Drag Tabbar controller and set it up with tabs and required controller. You can set up tabbar controller with tabs later also when you wish to do.
  4. Select Navigation controller and bind its 'root viewcontroller' with Tabbar Controller.

This will load the application with both navigation and tabview controllers.

Upvotes: 0

Max B.
Max B.

Reputation: 871

This is how to add the NavigationController programmatically (e.g. in you AppDelegate)

  UIViewController  *viewController1, *viewController2;

    viewController1 = [[[UIViewController alloc] initWithNibName:@"FirstViewController_iPhone" bundle:nil] autorelease];
    UINavigationController *navigationcontroller = [[[UINavigationController alloc] initWithRootViewController:viewController1] autorelease];

    viewController2 = [[[UIViewController alloc] initWithNibName:@"SecondViewController_iPhone" bundle:nil] autorelease];

    self.tabBarController = [[[UITabBarController alloc] init] autorelease];
    self.tabBarController.viewControllers = [NSArray arrayWithObjects:navigationcontroller, viewController2, nil];

If you have a tableview in the Viewcontroller1 you can access the Navigationcontroller by using self.navigationController e.g. in the didSelectRowAtIndexPath to open a DetailView

eg.

- (void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath
{
    DetailViewController *detailViewController = [[DetailViewController alloc] initWithNibName:@"DetailViewController" bundle:nil];
    [self.navigationController pushViewController:detailViewController animated:YES];
    [detailViewController release];
}

In this example the detailViewController inits with a NIB file, which adds a navigation bar with a back button. But if you init the detailViewController programmatically aswell, you can add an action (GoBack) to a UIBarButtonItem to remove the detailViewController from its navigationcontroller.

-(void) GoBack
{    
    [self.navigationController popViewControllerAnimated:YES];
}

Upvotes: 27

john.k.doe
john.k.doe

Reputation: 7563

lots of answers, but none checked ...

of course, this is all now super easy with storyboards in Xcode interface builder:

create the Navigation Controller of interest, then choose menu Editor and item Embed In > and then Tab Bar Controller .

this even worked with the navigation controllers that Xcode presents you when you start with the master/detail split-view-controller template for a new project. in both cases, i now have a tab bar controller as my master; for iPhone, it ripples all the way through the end controllers, and on iPad, it keeps the tabs only in the master (i.e. the split on the right in landscape, and the popover in portrait).

Upvotes: 9

Once you have a tab bar in a XIB, the easiest way to approach this is to drag a UINavigationController object over from the Library window (looks like a left nav bar button on a gold background) into the Tree View for your tab bar (the text only view, not the GUI). Place the navigation controller inside the tab bar controller, then drag your existing view controller inside the navigation controller.

When you go to view that tab you should then see a navigation bar on the top of it... if you are loading the navigation controller from another xib, you'll modify the nav bar in the tab bar xib.

Upvotes: 63

dsaw
dsaw

Reputation: 577

Open the XIB file of your UITabBarController (from MainWindow.xib)

Go to 'Tab Bar Controller Attributes'. You ll see a 'View Controllers' section there, where the view controllers of each tab will be mentioned. Just change the type of controller to NavigationController for whichever tab you want.

Select the view of the controller you have changed, and check for the loadFromNib option in its attributes, and select the correct nib. ( as after changing the kind of controller, this connection would have been lost )

Upvotes: 1

dnstevenson
dnstevenson

Reputation: 697

I realized this is late, but this question is #1 on google results today and so I figured I'd add an answer. There is a great youtube video tutorial by O'Reilly that walks you through a tabbar + navigation controller app. Check it out here: http://www.youtube.com/watch?v=LBnPfAtswgw

Upvotes: 13

August
August

Reputation: 12177

The way to think about it is this:

You want each tab to have a navigation controller. Then, each nav controller needs to have a root view controller and a loaded Nib.

So, in IB, add nav controllers for each of your tabs. Then, configure each nav controller to have the appropriate root view controller and Nib.

Upvotes: 9

Related Questions