Posts tagged interface builder
Get to the point – iPhone Development: Embed a Navigation controller to a Tab Bar Application
Jan 31st
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.
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
Get to the point – iPhone Development: Tab Bar Application
Jan 30th
Get to the point, iPhone development tutorials for those programmers who want concise step by step tutorials, but do not have the time to watch a 30 min video tutorial.
Get to the point – iPhone Development: Tab Bar Application (Adding new views)
1- Open Xcode and create a new “Tab Bar Application” (see Figure 1). Name it tabbartest (see Figure 2).
Figure 1
Figure 2
2- Xcode will create the necessary files for a basic Tab Bar Application (see Figure 3).
Figure 3
3- By double clicking the MainWindow.xib file Interface Builder will show up (see Figure 4). If the Inspector and Library windows don’t appear, open them (Tools->Library, Tools->Inspector).
Figure 4
4- Go back to Xcode and create a new file (File->New File). From the User Interface menu list select “View XIB” (see Figure 5). Name this view as ThirdView.xib (see Figure 6).
Figure 5
Figure 6
5- From Xcode double click the ThirdView.xib file. Interface Builder will show up again (see Figure 7).
Figure 7
6- Click on the File’s Owner icon. Go to the Inspector window and click on the “View Identity” icon. From the Class list select FirstViewController (see Figure 8).
Figure 8
7- Click on the “View Connection” menu option. Click on the view outlet, then drag & release it on the view canvas (see Figure 9). If you do this correctly the “View Connection” window should look like Figure 10.
Figure 9
Figure 10
8- Go back to Xcode and open the MainWindow.xib file. Add a new Tab Bar Item (see Figure 11) by selecting it from the Library. Drag the Tab Bar Item to the Tab Bar Controller (see Figure 12).
Figure 11
Figure 12
9- Click on the newly added Tab Bar Item and select the “View Controller Attributes” from the Inspector Window (see Figure 13). Set the NIB Name parameter to ThirdView (see Figure 14). Once the NIB Name is set, your MainWindow file should show the text “Loaded From ThirdView” (see Figure 15).
Figure 13
Figure 14
Figure 15
10- Save all your Xcode & Interface Builder files. Click “Build and Run” from Xcode. The Tab Bar Application will show up on the iPhone Simulator with a third Tab Bar Item (see Figure 16).
Figure 16