Tab bar icon and title not showing with Storyboard References

Question

I have the following storyboard with a segue to a storyboard reference:

The problem is that when I run the app, it doesn't show the icon or the title:

These are the item settings:

What am I missing?

Somebody just posted an answer bellow. I'm not on this project anymore so please let me know if it works and I'll mark it as an answer. — MVZ, Jul 20 '16 at 17:19

score 19 · Accepted Answer · answered Jul 19 '16 at 20:15

Here's how to get the tab to show properly:

Put the first UIViewController that will be embedded in the tab in the same storyboard as the UITabViewController.
Ctrl + Drag from the tab bar controller to the content view controller to make the connection as per usual. This will automatically add the UITabBarItem to the bottom of the content view controller.
Select the content view controller.
Click the Editor menu and choose Refactor to Storyboard...

The UITabBarController tab will now point to the new storyboard reference... ... and the content view controller preserves the UITabBarItem from the tab bar relationship. It will appear normally in the app now.

Is there any way we can make the relationship by ourself? – MMujtabaRoohani Dec 02 '16 at 12:20 — MMujtabaRoohani, Dec 02 '16 at 12:20

score 18 · Answer 2 · edited Oct 02 '17 at 18:17

18

You can modify image/title of the tab bar item in the initial view controller of the storyboard you are referring to. You just need to add a 'tab bar item' to the initial view controller and change its properties (title/image) accordingly.

Outline view of the root view controller in the referred storyboard

document outline of referred to storyboard

The modified tab bar item in the view controller

initial view controller with modified tab bar item

Note: the change will not be reflected on the tab bar in the main storyboard; you only see it in the referred storyboard and at runtime.

edited Oct 02 '17 at 18:17

shim

9,289
12
69
108

answered Jan 23 '17 at 16:03

Dries

385
3
12

Why does the tab bar disappear in the storyboard? Is it an Xcode bug? – Cons Bulaquena Mar 03 '18 at 03:33
I think it has to do with the fact that it is a different file (Storyboard) and Xcode doesn't implement it (reading the entry view controller from a referenced story-board). So more a feature lacking than an actual bug I would think. – Dries Mar 03 '18 at 03:43
This solution is the quickest one. Thanks – carmine Mar 07 '18 at 09:59

score 16 · Answer 3 · answered May 22 '17 at 10:04

The problem is that in the target view controller, you don't have a UITabBarItem in the views hierarchy. The TabBarItem is related to the storyboard reference, but should be related to the View Controller.

Looks like a "bug" in Xcode...

To resolve this you can do the following:

Just create the segues from the UITabBarController to the Storyboard references.
You may configure the Tab Bar Items in the storyboard references, they don't do much more other than showing the tabs in the tab bar on the Storyboard, which is nice for development purposes.

If you now run the app, you will indeed notice that the tabs are missing. To get the tabs to display in the running app as well, do this:

Go to the viewcontroller the storyboard reference is referencing to
Add a Tab Bar Item into this View Controller by dragging it from the Object Library into the View Controller
You will now see a tab bar with one single tab in the view controller
Configure the tab bar item to show the correct title and icon

Now run the app and you will now see your tabs.

This solved my problem. Even though I did not need to add bar items to other ViewControllers that are also displayed in the same UITabBarController. I only needed to do this with one of the view controllers for it to display. Weird stuff — jcpennypincher, Jun 14 '18 at 18:15
You actually gave the same answer as @Driess https://stackoverflow.com/users/6216669/dries — AndaluZ, Jul 02 '19 at 14:37

score 6 · Answer 4 · answered Dec 21 '17 at 09:20

6

I tried adding another tab bar, then added tab bar item, selected and image for it BUT Non of above seemed to work with my case .. it was like this :

Then i compared it with VC that were working properly with TabBar icons..

later i found that my navigation items and tab bar items were not together :

Now its working :):)

answered Dec 21 '17 at 09:20

Parajuli Roman

551
1
6
15

This was what worked for me. Setting up these tab bar items is a little tedious because of the story board reference – jcpennypincher Aug 30 '18 at 22:50

score 4 · Answer 5 · answered Nov 08 '17 at 18:09

4

After struggling with this problem for a few days I found this solution. Double click the storyboard link, which will open the referenced storyboard. In the scene navigator, you can edit the bar item with a custom title and icon. Works in xCode 9.

Storyboard

Scene Navigator

answered Nov 08 '17 at 18:09

QuattroDog

41
3

Adding the bar item by directly opening the storyboard that is referenced/has the initial VC will not work. Follow steps above such as if you want to open the initial VC of the tab, open it by clicking the storyboard reference – naz Dec 17 '18 at 11:53

score 2 · Answer 6 · answered Feb 11 '18 at 20:55

2

I had this exact same issue and neither of the above answers worked in my case. I solved by setting my tab bar image in the image bar item section inside the storyboard's reference like shown in the attached image:

answered Feb 11 '18 at 20:55

Mauricio Chirino

1,182
17
19

score 1 · Answer 7 · answered Nov 23 '22 at 23:28

1

Just add a Tab Bar Item in the "child" view controller:

this works for me

answered Nov 23 '22 at 23:28

Carlos Minero

51
1
6

score 0 · Answer 8 · answered May 04 '16 at 12:09

I made following in the storyboard and made class for each UINavigationController and made following code in each UINavigationController class

override func viewDidLoad() {
        super.viewDidLoad()
        let someController = StoryboardManager.surveyStoryboard.instantiateViewControllerWithIdentifier("SomeController") as! SomeController
        viewControllers = [someController]
        // Do any additional setup after loading the view.
    }

score 0 · Answer 9 · answered Jun 29 '21 at 16:13

I did it in different way. My fourth tab was not showing. I just programmatically placed image on its place. You need to set its X,Y coordinates accordingly.

    let imageName = "video"
    let image = UIImage(named: imageName)
    let imageView = UIImageView(image: image!)
    imageView.frame = CGRect(x: view.frame.width - 80, y:  view.frame.height-70, width: 50, height: 50)
    view.addSubview(imageView)

Tab bar icon and title not showing with Storyboard References

9 Answers9