Create UITabBarController programmatically in swift

Swift tutorial on how to create UITabBarController Programatically in swift

Introduction UITabBarController

UITabBarController is the  controller that has tabs or tabbar at the bottom of the screen and menu items displayed with either text, images plus text or only images. These menu items are known as UITabarItems in technical language. You can take the example of shopping apps or workouts app which contains the bottom tab. Those apps uses UITabBarController for the layout of their app. In this tutorial, we will learn how to create UITabBarController programmatically in swift language.

Below is step by step guide to create UITabBarController Programmatically in swift.

Steps to create UITabBarController programatically in swift

Step 1: Create a new project using “SingleView App” template. We are not going to use “Tabbed App” template for our tutorial, as we will create UITabBarController programmatically in swift. Name project as “UITabBarController-Tutorial“.

Selecting Sigle View app template in xcode

Step 2: After xcode generated us a project, open “ViewController.swift” file. Now we will, write down a function that will create TabBarController programmatically. We will name our function as “createTabBarController”. Inside our function we will create an instance of UITabBarController and add it to our view.

Step 3: Call the function created in step 2, inside our viewDidLoad function.

Step 4: Meanwhile if you run your code, then you will see something like this

UITabBarController programattically in swift showing TabBar with no tab bar items

It’s not showing any tabs, because we haven’t added any viewcontrollers to it yet, therefore an empty UITabBar is showing while our app is running on simulator.

Adding UITabBarItems to our UITabBar of UITabBarController

Step 5: Let us now add Tabs and ViewControllers to our UITabBarController. We will create two viewcontroller named as, “FirstVc” and “SecondVc”. Below is the code of updated “createTabBarController” function.

Step 6: If you, run your code now. You will see two tabs with title “First”  and “Second”. These are the titles we gave to our two viewcontrollers.

UITabBarController- programattically tutorial in swift

Step 7: Here we are done with creating UITabBarController programmatically in swift . But still we need to add images to our tabs, therefore we need to use UITabBarItem. Below is the updated code of “createTabBarController” function. Here we set tabbaritem to our ViewControllers and also added images to them.

Step 8: Run your app now and you will see, two tabs with images and title’s associated with UITabBarItem’s of UITabBarController.

UItabBarController programmatically in swift - tutorial

Adding navigation to each UITabBarItem

Step 9: In order to add navigation to your view-controllers we need to add UINavigationController too. For this we will change the line where we are assigning array of ViewControllers to UITabBarController with the below code.


Step 10: Now if you run your app, you will find your tab’s view background color are changed. But wait here is one issue as tabs are changing but same background color is appearing. For this error, and to resolve it please initialize  UITabBarController as global instance for the class. You can check it here in below code

Where to go from here:

In this post we learned, how to create UITabBarController programmatically in swift. Also we add images to our UITabBarController using UITabBarItem and used UINavigationController within each tab so that we can easily navigate to other screens within our tabs of UITabBarController. In short, we successfully learned how to create UITabBarController programmatically in swift.

Source code: UITabBarController-Tutorial.zip

%d bloggers like this: