How to connect Xcode Storyboard's “Simulated M

Question

I'm hitting issues when attempting to design a UIToolbar Accessory View via an Xcode Storyboard.

When I drag a UIToolbar object to the top margin of my View Controller, the item is added to the left pane and I am able to connect it to my class's IBOutlets. It appears correctly when I run the app.

However, the toolbar is not visible anywhere on the storyboard. I thus lose the visual editing benefits of using Interface Builder in the first place. The bar button items are only visible in the left sidebar.

I have seemingly gotten around being unable to see the views in the IB canvas by using the View Controller's "Simulated Metrics". Now I can see a Toolbar in the Storyboard.

• Attributes Inspector > Simulated Metrics
• Set "Bottom Bar" to value "Opaque Toolbar"
• Drag Bar Button Items into this Simulated Toolbar

However, when I run the app, this "Simulated Toolbar" is not visible.

I am unable to link the simulated toolbar to an IBOutlet via the Connections Inspector

I have not found a way to link the "toolbar object" (first image) to the "simulated toolbar" (second image).

My main goal here is to see a visual representation of the Toolbar in the Storyboard. Is this possible?

Answer 1

Simulated metrics are just that -- simulated. They help you to visualize your design, but the artifacts won't necessarily show up at runtime short of some other mechanism. The toolbar that you created in the storyboard is there at runtime but not added to your view. That's why it's up in the header of the scene.

The standard use of UIToolbar is to allow a UINavigationController to manage it. So there is a toggle in InterfaceBuilder's Attributes Inspector pane when a UINavigationController is selected.

From there you can add UIBarButtonItems as needed, and hook them up to IBOutlets in your code. No need to hook up the toolbar to an IBOutlet; you can get it from your UINavigationController's toolbar property at runtime.

See the Apple docs.