Visually modifying a UIToolbar from xcode storyboard

Question

I'm using XCode 4 and storyboarding an application I'm creating, however I cannot visually modify the UIToolbar.

I'm attempting to modify a UIToolbar that is inside of a UITableViewController - however I have to place the UIToolbar out of the correct hierarchy in order to be able to modify it visually. I've tried placing it onto the view controller area but that does not make it show up.

At one point I was able to make it appear below, as it's own object however I was not able to recreate that.

Once I was able to get it to look like this

Servile

Answer 1

Your UITableViewController is inside a UINavigationController, which already has its own UIToolbar—you don't need to drag a new one into your view hierarchy. Interface Builder can simulate the toolbar for you under "Simulated Metrics" in the inspector panel.

Once the simulated toolbar is visible, simply drag UIBarButtonItems into it. Use a custom item with a custom view if you need anything more complicated than a button or spacer.

If you need your toolbar items need to be dynamic, you can maintain a reference via IBOutlets without necessarily having them in your view. Then set your UITableViewController's toolbarItems property or call -setToolbarItems:animated: at runtime to display the appropriate items.

See Apple's UINavigationController Class Reference: Displaying a Toolbar.

Bactria

Thanks that was the problem, I couldn't drag items onto the simulated toolbar previously, but it was due to me maintaining a running session of xcode after it detected a crash. Simply dragging the bar button items to the simulated toolbar gave the expected result. – Servile

Although at the same time, i would like to know how I was able to get that toolbar to show on the bottom as it's own entity twice. – Servile

How would you visually layout items for when the view is in edit mode? Do I have to create it in a separate nib or via code? I really want to use the Storyboard... – Rodney

UIToolbar has no inherent “editing” state, nor does IB provide convenient way of doing this visually. Instead I would use two separate IBOutletCollection properties to hold the items for each state and implement -[UIViewController setEditing:animated:] (make sure to call super) to display the appropriate toolbar items at runtime. In IB you can stash your editing items in the grey “scene” tray if you don’t want them to be part of the initial view. – Bactria

Answer 2

To answer your question, the visual editor simplifies the setup of most controls, view hierarchies, and delegation patterns, but it's still up to the developer to make sure they check out. The implementation of UITableViewController makes certain assumptions and assertions about its view hierarchy that Xcode does not enforce through the visual editor. Given that your desired view hierarchy is unsupported, I have to assume that the editor's behavior is either undefined or irrelevant. For a workaround, see Maxner's suggestion.

Stent

Answer 3

UITableViewControllers only allow one view object, which of course is UITableView. UITableViews are not cooperative for subviewing and they usually push everything into footers or headers. Something like this isn't possible:

-TableController
    -Table
        -Subview
        -Another subview

UITableViewControllers are reduced to this:

-TableViewController
    -Table

So you will need to use a UIViewController and declare a UITableView in there. Heres the Hierarchy you should use then:

- ViewController <Table's Delegate & Data Source>
    - View           
        -Table
        - Your UIToolbar

In your ViewController.h declare IBOutlet UITableView and connect Data Source and Delegate to the ViewController. Then simply add the UITableView implementations to your .m file and you're good to go.

Corymb

I don't have a problem at runtime, it's simply within the storyboard. I cannot visually modify the toolbar, however at runtime it shows up correctly. – Servile

It's an interesting idea, however I shouldn't have to do that. I was also able to get the toolbar to display on its own once by accident. So i'm sure there's a way. – Servile