Recently, in an effort to better understand layout code in iOS, I decided to ditch Storyboards in Xcode for a new project. Boy am I glad I did!
First, Credit to Storyboards
Before I throw them under the bus, Storyboards deserve some credit. They make putting together a simple layout and application flow very quick and easy. More importantly, they are exceptionally useful for beginners. They can let people get something up and running very quickly without having to write a layout code.
I absolutely will not be abandoning Storyboards in my teaching. They are still a completely logical starting point. This is especially true for students without any programming experience (which is basically all of my students).
Storyboards are fine, right up until you find yourself starting to fight with them. Then they rapidly defend into a colossal pain in the arse!
- They are slow! Once an app gets to a significant number of view controllers, even opening up the storyboard file takes an age. Not cool!
- Adding constraints in cumbersome. With anything other than simple layouts, adding constraints in storyboards feels like a riddle. I find myself reaching for the “remove all constrains” button and starting over far too often.
- Using them with reusable views sucks. With things like collection views and table views feels cumbersome. The need a new xib file, register xib and tie everything together, yuck!
- Source control is a nightmare. Maybe this is the one that tipped me over the edge. They just don’t play nice with version control when your working in a team.
Enter Auto Layout Code
So lets take a quick look at how we can build a view programatically. In this example, note we’re not passing a frame into init method of the UIView we’re creating. The size and position the view is now calculated from the anchors that we add. Nice!
let square = UIView()
square.translatesAutoresizingMaskIntoConstraints = false
self.square = square
Well…it’s not exactly lovely, but it’s not too bad either. The key thing to remember is that you need to set the translatesAutoresizingMaskIntoConstraints property of the view to false. By doing this you can set up your view with constraints. In other words, the frame is not needed.
By default, the property is set toApple Developer Documentation
truefor any view you programmatically create. If you add views in Interface Builder, the system automatically sets this property to
The biggest thing I’ve noticed through ditching storyboards in my projects is how much more efficiently I can work. I can get so much more done in a smaller amount of time, especially if the view I’m building is fairly intricate.
Try It Yourself
I highly recommend making the switch. Start by using them for just part of the layout if you are worried about completely ditching storyboard files. Use a storyboard for setting out your view controllers and application flow, however build the majority of your views (particularly the more intricate ones) programatically. I guarantee after a few sessions without relying on storyboards, you’ll likely decide to ditch them all together. Above all else, the way views as built will become more clear.