UIView outside of a View Controller in a Storyboard

Question

I'm stuck with a question I can't find an answer to in the official documentation, on Stackoverflow or on Google.

I'm an experienced iOS developer but new to Storyboards. I'd like to instantiate a view on the current viewcontroller, a view that, in a NIB, I would draw outside the viewController and attach an outlet to to refer to it in code and call something like addSubview: or so. It's useful to draw an overlay or, in my current case, a callout view for use in a MapView delegate. But I can't figure out how I can do this in a Storyboard.

I can't seem to have a view outside of a viewcontroller, and views inside the viewcontroller either have to be subviews of the controller's view or don't be visible in Interface Builder at all (which is okay when you drag a view composed outside, in a traditional NIB, but quite a problem if you need to tweak even the least detail of it).

Any hint on what to do or where to look? Thanks.

Solution 1

It appears there is no way to do it. See Jason's comment and this question addressing the same problem, though in a different context.

However, I realised earlier when thinking about the implications of my problem — as I began to explain in my previous comment before deciding it would be worth a full answer — it makes sense to separate the design of a custom view from the design of an application flow. So the fact that it's not possible to design custom views in Storyboards may very well be... by design.

A custom view (which is a reusable component) is very different from a view controller (which represents a scene in your application storyboard). It's the same as a character and a scene, in a movie. You don't want to design your character in your scene, even if you happen to use that character in only one scene. It's fortuitous if you use it in only one scene, but not essential. So it has to be separate.

The fact that you want to use Interface Builder to design your custom view is only an implementation detail that should be encapsulated in your class. The application storyboard has no need of knowing, even less managing, how you deal with the particular implementation of your reusable view.

Hmm, I wish I had more of this brand of interrogation :)

Solution 2

You can use a Container View, is like a regular view(You can assign a IBOutlet UIView) but you can define it outside of your UIViewController.

Solution 3

I was wondering the same thing myself, and actually was able to get this to happen, though after messing around, its gone. I have a Nav Controller, a View Controller and two views. I had developed the views in a separate nib, and imported them to this project. While was was connecting buttons, the view I was working in suddenly appeared next to my View Controller. Unfortunately, while trying to get the other view to appear, I somehow lost it, and dont know how to get it back. It doesnt seem like you can drag a view to the storyboard, only into a view controller. However, if I was able to do it once, its got to be reproduceable.

Comments

[KPM]

Yes, you actually can put a UIView into a scene, alongside the UIViewController. But then you can't edit it or even view it unless you move it inside the UIViewController — which significantly reduces its attractiveness.

[KPM]

Interesting. I maintain that you don't want to do this every time, but this trick can be useful for some use cases like the one displayed in your illustration.

[Joel]

I was able to drop UIViews into this same location and hookup them up with an IBOutlet. No Container View needed.

[Josejulio]

Could you post a new answer? Maybe this one is outdated :)