Creating a Free Form View Controller

Sometimes, it’s convenient to have a long or wide view controller in Storyboard when you’re designing long or wide views. If that’s the case, configure the view controller to be freeform.

Step 1: Set the view controller to be freeform

In the Storyboard, make sure the view controller is selected, then open the Size inspector (the Ruler icon), set Simulated Size to Freeform, and choose your dimensions.

Step 2: Add constraints so the layout adapts at runtime

The freeform size is a design-time convenience only — at runtime the view controller’s root view is resized to the actual device screen. Storyboards use Auto Layout by default, so how your subviews respond to that resize is determined by their constraints. Sometimes you want a subview to shrink with the root view, and sometimes you want it to stay the same size.

For example, if the scene contains a scroll view, you probably want it to shrink down: pin its edges to the root view so it resizes with it. For a fixed-size UIImageView, give it width and height constraints (or rely on its intrinsic content size) so it keeps its dimensions when the root view shrinks.

If a storyboard has Auto Layout turned off (an unusual, legacy configuration set in the File inspector), the Size inspector shows autoresizing arrows instead of constraints; flexible width/height arrows make a subview shrink with its superview, while unselecting them keeps it a fixed size.