[ACCEPTED]-How do I add a Navigation Bar to a UITableViewController in Interface Builder?-uinavigationbar

Accepted answer
Score: 59

From the outline view, make sure your Table View Controller is 5 selected.

Then go to the Editor menu, and click 4 on the Embed In submenu, and choose Navigation Controller and voila. You 3 have your navigation controller pointing 2 to your tableview controller with a relationship 1 built in.

Score: 19

For a table view with an edit button at 15 the top, use a UINavigationController, with 14 a UITableView as the rootView. That means 13 you're going to make a custom UITableView 12 subclass for your table view, and use that 11 as the rootView of your UINavigationController 10 instance. (Programatically, it's set with 9 UINavigationController's -(id)initWithRootViewController. It's also settable 8 through IB.)

Then, in your UITableView subclass, uncomment 7 the following line:

- (void)viewDidLoad {
    [super viewDidLoad];
    // Uncomment the following line to display an Edit button in the navigation bar for this view controller.
    self.navigationItem.rightBarButtonItem = self.editButtonItem;

and voilà, your UINavigationController's 6 view shows up as a table view with an edit 5 button on the right side of the navigation 4 bar.

Since the controller is at the top of 3 the stack, there's no "back" button on the 2 left, so you can use self.navigationItem.leftBarButtonItem for whatever UIBarButtonItem 1 you create.

Score: 12

I agree that it's difficult to figure out 30 how to do things like this in Interface 29 Builder, but luckily it is possible to add 28 a Navigation Bar and Bar Button Item to 27 a Table View this way. Here's how to do 26 it:

  1. Drag a blank View (an instance of UIView) from the Library to the area near the top of the Table View. As you drag near the target area, Interface Builder will highlight it in blue to show you where to drop the View. Let go, and the View will be added as a subview of the Table View's header view.
  2. Drag a Navigation Bar from the Library and drop it on the blank View you just added.
  3. Drag a Bar Button Item from the Library and drop it onto the Navigation Bar.


The problem with the above approach is 25 that, as Bogatyr points out, the Navigation 24 Bar will then scroll along with the Table 23 View. Apple recommends using a custom subclass 22 of UIViewController that owns both the Navigation Bar and 21 an instance of UITableView resized to fit. Unfortunately, that 20 means you would have to implement the UITableViewController behavior 19 needed by your UIViewController subclass yourself.

Another 18 approach that seems to work well is to create 17 a custom subclass of UIViewController that owns a blank 16 background view containing the Navigation 15 Bar as well as a blank content view (an 14 instance of UIView) that fits under the Navigation 13 Bar. Your custom subclass would have an 12 outlet pointing to an instance of UITableViewController in the 11 same nib file.

This has the advantage of 10 allowing all the view components to be created 9 and configured in Interface Builder, and 8 doesn't require implementing UITableViewController methods from 7 scratch. The only detail you'd need to take 6 care of in the Table View Controller's parent 5 would be to add Table View as a subview 4 of the parent's content view in viewDidLoad.

The parent 3 could implement the action methods for the 2 Navigation Bar's button items, and implement 1 the delegate pattern if necessary.

Score: 9

From iOS6 onwards, you can use container 9 view. So what you have to do is take View 8 controller, add the navigation bar to it, then 7 add a Container View to same view controller. It 6 will automatically, add the new view controller 5 link to your container view. Now simply 4 delete that, and your table view controller 3 in the story board. Now embed the table 2 view controller to container view by control 1 drag. Hope it helps.

Score: 4

First add a navigation controller and put 4 the table view controller (as root view 3 controller) onto the navigation controller. This 2 is how it is done in Code because I don't 1 use IB.

Score: 3

Why in the world you can't drag a navigationItem 23 into a .xib file with File's Owner set 22 to a subclass of UIViewController and hook 21 the navigationItem up to the UIViewController's 20 navigationItem outlet is beyond me. It 19 seems like a real hole in IB / XCode integration. Because 18 you can certainly drag an instance of ViewController 17 to a xib file, and drag a navigationItem 16 into the ViewController, and then set the 15 title and barbuttonitems that way.

So if 14 you want to define your UITableViewController 13 subclass object's navigation bar in IB, you 12 have to create your TableVC object in a 11 xib file (not the one .xib file that contains 10 the tableview for your UITableViewController, though!). You 9 then either hook the TableVC object up to 8 be an outlet of another object (like your 7 application delegate), which works if you 6 need just one instance of your TVC throughout 5 the lifetime of your app, or if you want 4 to dynamically create instances of your 3 TableVC in code you load this extra .xib 2 file manually via loadNibNamed:owner:options 1 method of the NSBundle class.

Score: 1

These steps worked for me in iOS 9:

  1. Add a View Controller to the Storyboard. Make UITableViewController as base Class.
  2. Add a Navigation Bar object onto view controller at the top.
  3. Add a Table View below Navigation bar.
  4. Add a Table View Cell into Table View.
  5. Add constraints.


More Related questions