a full stack enthusiast interested in Javascript / Typescript / Kotlin / Python / React / React Native / (Android & iOS) native / Cloud


How to add item for tab bar controller in storyboard of Xcode

Storyboard is good for decoupling the UI from your business logic, but sometimes it could be challenge if you are a newbie.

We will start from the very start.

Create a storyboard

  1. CMD+N to create a new file: User interface - storyboard
  2. Single click the newly created storyboard to open it as the interface builder mode.

Create a Tab Bar Controller

  1. Open Object library in the Utilities panel, the shortcut is CTRL+ALT+CMD+3
  2. Drag Tab Bar Controller into the storyboard. Now we have a tab bar controller along with 2 sub tab items.

Add a new Tab Bar Item

  1. Let’s add the 3rd tab bar item.
  2. Drag View controller into the storyboard.
  3. Drag Tab Bar Item into the newly created view controller, it will sit at the same level of the View.

Add the segue

  1. From the Tab Bar Controller Scene, hold CTRL and drag a line from it to the new view controller.
  2. From the pop-up, select Relationship Segue - view controllers


Enjoy :)

Thanks for reading!

Follow me (albertgao) on twitter, if you want to hear more about my interesting ideas.