Get to the point – iPhone Development: Embed a Navigation controller to a Tab Bar Application

This tutorial is a continuation of the previous Tab Bar Application tutorial.

1- Open the tabbartest Xcode project. Create a new UIViewController subclass (File->New File) and name it TabBarNavigationController (see Figure 1). Make sure the “With XIB for user interface” option is marked. Three new files will be added to your Xcode project: TabBarNavigationController.h, TabBarNavigationController.m and TabBarNavigationController.xib.


Figure 1

2- Open the TabBarNavigationController.h file and replace the text UIViewController with UINavigationController.

3- We need to add a view controller to display contents. Create a new UIViewController subclass named NavigationContentsViewController (File->New File->UIViewController subclass).

4- Create a new view to add to the newly created UIViewController (File->New file->View XIB). This is not a Cocoa Touch Class file, be sure to select User Interface. Name the view FirstNavigationView. Open the file FirstNavigationView.xib and select File’s Owner. In the Identity tab of the Inspector, change the class to NavigationContentsViewController. Go to the “View Connection” tab, click on the view outlet, then drag & release it on the view canvas.

5- Open the MainWindow.xib file and add a new Tab Bar Item. Be sure the new Tab Bar Item is selected. Open the Inspector window (Tools->Inspector if it’s not already opened). On the Identity tab change the selected Class to TabBarNavigationController (see Figure 2).


Figure 2

6- Select the Tab Bar Controller (see Figure 3). Select the attributes tab from the Inspector Window. Select the second item in the View Controllers list. Choose the Navigation Controller class (see Figure 4).


Figure 3


Figure 4

7- Expand the “Tab Bar Controller” and expand the “Selected Navigation Controller (Item)”. Select the “View Controller (Item)” and change the class to NavigationContentsViewController (see Figure 5). You’ll see the name has changed to “Navigation Contents View Controller (Item)”. Click on the Attributes tab and set the NIB Name to FirstNavigationView in the Inspector window.


Figure 5

8- Save all files, click on the “Build and Run” button from Xcode, your app will be executed (see Figure 6).


Figure 6

TabBarEmbeddedNavigation source code