Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

When to use Storyboard and when to use XIBs

People also ask

How are XIBS different from storyboards?

A storyboard is like a canvas where you put all your . xib files. You no longer have any . xibs, you just have View Controllers directly on your canvas.

Should I use Swift UI or Storyboard?

For most new developers coding on iOS 13 or higher, you should learn SwiftUI. If you need to maintain an older code base with Storyboards, you should learn Storyboards.

What is Storyboard and XIB in Swift?

In simple words Storyboard is one single file for all the views or screens that in yours apps. It transitions one screen to another screen. It minimizes (reduces) the number of files in your apps. Storyboard can put the XIB files. Storyboard is universal; that means your apps can run both iPhone and iPad.

Should I use storyboards?

Another benefit to using Storyboards (over creating views programmatically) is that you get to see what your view will look like at runtime without having to run your app. You can quickly make a change in Interface Builder and immediately see what it'll look like – without waiting for Xcode to compile and run.


Update 1/12/2016: It's 2016 and I still prefer laying out my UIs in code and not in Storyboards. That being said, Storyboards have come a long way. I have removed all the points from this post that simply do not apply anymore in 2016.

Update 4/24/2015: Interestingly Apple doesn't even use Storyboards in their recently open-sourced ResearchKit as Peter Steinberger has noticed (under the subheading "Interface Builder").

Update 6/10/2014: As expected, Apple keeps improving Storyboards and Xcode. Some of the points that applied to iOS 7 and below don't apply to iOS 8 anymore (and are now marked as such). So while Storyboards inherently still have flaws, I revise my advice from don't use to selectively use where it makes sense.

Even now that iOS 9 is out, I would advise against to use caution when deciding whether to use Storyboards. Here are my reasons:

  • Storyboards fail at runtime, not at compile time: You have a typo in a segue name or connected it wrong in your storyboard? It will blow up at runtime. You use a custom UIViewController subclass that doesn't exist anymore in your storyboard? It will blow up at runtime. If you do such things in code, you will catch them early on, during compile time. Update: My new tool StoryboardLint mostly solves this problem.

  • Storyboards get confusing fast: As your project grows, your storyboard gets increasingly more difficult to navigate. Also, if multiple view controllers have multiple segues to multiple other view controllers, your storyboard quickly starts to look like a bowl of spaghetti and you'll find yourself zooming in and out and scrolling all over the place to find the view controller you are looking for and to find out what segue points where. Update: This problem can mostly be solved by splitting your Storyboard up into multiple Storyboards, as described in this article by Pilky and this article by Robert Brown.

  • Storyboards make working in a team harder: Because you usually only have one huge storyboard file for your project, having multiple developers regularly making changes to that one file can be a headache: Changes need to be merged and conflicts resolved. When a conflict occurs, it is hard to tell how to resolve it: Xcode generates the storyboard XML file and it was not really designed with the goal in mind that a human would have to read, let alone edit it.

  • Storyboards make code reviews hard or nearly impossible: Peer code reviews are a great thing to do on your team. However, when you make changes to a storyboard, it is almost impossible to review these changes with a different developer. All you can pull up is a diff of a huge XML file. Deciphering what really changed and if those changes are correct or if they broke something is really hard.

  • Storyboards hinder code reuse: In my iOS projects, I usually create a class that contains all the colors and fonts and margins and insets that I use throughout the app to give it a consistent look and feel: It's a one line change if I have to adjust any of those values for the whole app. If you set such values in the storyboard, you duplicate them and will need to find every single occurrence when you want to change them. Chances are high that you miss one, because there's no search and replace in storyboards.

  • Storyboards require constant context switches: I find myself working and navigating much faster in code than in storyboards. When your app uses storyboards, you constantly switch your context: "Oh, I want a tap on this table view cell to load a different view controller. I now have to open up the storyboard, find the right view controller, create a new segue to the other view controller (that I also have to find), give the segue a name, remember that name (I can't use constants or variables in storyboards), switch back to code and hope I don't mistype the name of that segue for my prepareForSegue method. How I wish I could just type those 3 lines of code right here where I am!" No, it's not fun. Switching between code and storyboard (and between keyboard and mouse) gets old fast and slows you down.

  • Storyboards are hard to refactor: When you refactor your code, you have to make sure it still matches what your storyboard expects. When you move things around in your storyboard, you will only find out at runtime if it still works with your code. It feels to me as if I have to keep two worlds in sync. It feels brittle and discourages change in my humble opinion.

  • Storyboards are less flexible: In code, you can basically do anything you want! With storyboards you are limited to a subset of what you can do in code. Especially when you want to do some advanced things with animations and transitions you will find yourself "fighting the storyboard" to get it to work.

  • Storyboards don't let you change the type of special view controllers: You want to change a UITableViewController into a UICollectionViewController? Or into a plain UIViewController? Not possible in a Storyboard. You have to delete the old view controller and create a new one and re-connect all the segues. It's much easier to do such a change in code.

  • Storyboards add two extra liabilities to your project: (1) The Storyboard Editor tool that generates the storyboard XML and (2) the runtime component that parses the XML and creates UI and controller objects from it. Both parts can have bugs that you can't fix.

  • Storyboards don't allow you to add a subview to a UIImageView: Who knows why.

  • Storyboards don't allow you to enable Auto Layout for individual View(-Controller)s: By checking/unchecking the Auto Layout option in a Storyboard, the change is applied to ALL controllers in the Storyboard. (Thanks to Sava Mazăre for this point!)

  • Storyboards have a higher risk of breaking backwards compatibility: Xcode sometimes changes the Storyboard file format and doesn't guarantee in any way that you will be able to open Storyboard files that you create today a few years or even months from now. (Thanks to thoughtadvances for this point. See the original comment)

  • Storyboards can make your code more complex: When you create your view controllers in code, you can create custom init methods, for example initWithCustomer:. That way, you can make the customer inside of your view controller immutable and make sure that this view controller cannot be created without a customer object. This is not possible when using Storyboards. You will have to wait for the prepareForSegue:sender: method to be called and then you will have to set the customer property on your view controller, which means you have to make this property mutable and you will have to allow for the view controller to be created without a customer object. In my experience this can greatly complicate your code and makes it harder to reason about the flow of your app. Update 9/9/16: Chris Dzombak wrote a great article about this problem.

  • It's McDonald's: To say it in Steve Jobs' words about Microsoft: It's McDonald's (video)!

These are my reasons for why I really don't like working with storyboards. Some of these reasons also apply to XIBs. On the storyboard-based projects that I've worked on, they have cost me much more time than they have saved and they made things more complicated instead of easier.

When I create my UI and application flow in code, I am much more in control of what is going on, it is easier to debug, it is easier to spot mistakes early on, it is easier to explain my changes to other developers and it is easier to support iPhone and iPad.

However, I do agree that laying out all of your UI in code might not be a one-size-fits-all solution for every project. If your iPad UI differs greatly from your iPhone UI in certain places, it might make sense to create a XIB for just those areas.

A lot of the problems outlined above could be fixed by Apple and I hope that that's what they will do.

Just my two cents.

Update: In Xcode 5, Apple took away the option to create a project without a Storyboard. I've written a small script that ports Xcode 4's templates (with Storyboard-opt-out option) to Xcode 5: https://github.com/jfahrenkrug/Xcode4templates


I have used XIBs extensively and completed two projects using Storyboards. My learnings are:

  • Storyboards are nice for apps with a small to medium number of screens and relatively straightforward navigation between views.
  • If you have lots of views and lots of cross-navigation between them the Storyboard view gets confusing and too much work to keep clean.
  • For a large project with multiple developers I would not use Storyboards because you have a single file for your UI and cannot easily work in parallel.
  • It might be worth for large apps to split up into multiple storyboard files but I have not tried that. This answer shows how to do segues between storyboards.
  • You still need XIBs: In both of my Storyboard projects I had to use XIBs for custom table cells.

I think Storyboards are a step in the right direction for UI implementation and hope Apple will extend them in future iOS versions. They need to resolve the "single file" issue though, otherwise they won't be attractive for larger projects.

If I start a small size app and can afford iOS5 only compatibility, I would use Storyboards. For all other cases I stick to XIBs.


Storyboards were created to help developers visualize their application and the flow of the application. It is alot like having a bunch of xib but in a single file.

There is a question similar to this located What is the difference between a .xib file and a .storyboard?.

You can also create custom transitions via code that will change dynamically if needed, much like you can with .xibs.

PROS:

  • You can mock up flow of an application without writing much, if any code.
  • Much easier to see your transitions between screens and your application flow.
  • Can also use .xibs if needed with storyboards.

CONS:

  • Only works with iOS 5+. Does not work with iOS4.
  • Can get cluttered easily if you have a very view intensive application.

There really isn't a right / wrong when to use one or the other, it is just a matter of preference and what iOS versions you are wanting to use.


I will just state 4 simple reasons why you should use storyboards, especially in a productive environment where you have to work in a team of product owners, product managers, UX designers, etc.

  1. Apple has GREATLY improved working with Storyboards. And they encourage you to work with them. Which means they will not break your existing projects with updates, they will ensure that storyboards are future proof for newer XCode/iOS versions.
  2. More visible results in less time for the product owners and managers, even during the creation phase. You can even use the storyboard itself as a screenflow diagram and discuss it in meetings.
  3. Even after an app is done (and that's generally where its life-cycle begins) – in the future it will be faster and easier to apply small adjustments. And these could very well change multiple aspects of your layout at the same time, which you probably want to see in a WYSIWYG manner. The alternative would be hand-writing UI changes in code and switching back and forth between the IDE and the simulator to test it out, each time waiting for compile & build.
  4. Non-developers can be taught to set up layouts in storyboards and create the necessary hooks for the developers (IBOutlets and IBActions). That's a very big plus because it lets the devs focus on the logic and the UX designers apply their changes in a visual manner, without having to write any code at all.

I won't write up any CONS, since Johannes has already listed probably all the viable ones in his answer. And most of them are definitely not viable, especially not with XCode6's major improvements.