Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Tab bar not showing icons?

I read a bunch of related questions, I tried what they said, nothing works really. Not sure why. So, I have 3 different UIStoryboards. First one is the Auth Storyboard that handles Login/Register and there's a storyboard reference to the second Storyboard - Tab bar storyboard. This storyboard contains 5 other storyboard references that would load it's separate view controllers.

My problem is that the icons are not showing once the user is logged in. I setup a custom color of the first view controller in the UITabViewController just to make sure it loads. It does.

I've tried to setting all images/icons to render them as "Original", didn't work. I set a system image, just to see if that's the issue, they are not shown. Also worth mentioning is that the icons are shown in the storyboard but when its being compiled, they're nowhere to be seen in the simulator.

What am I doing wrong?

enter image description here

PS: I've changed the tint color of the tab bar, just to test it, and it works. So, the problem is not with that...

like image 963
Dani Avatar asked Aug 12 '17 08:08

Dani


3 Answers

Problem With Storyboard References and Missing Tab Bar Icons

If you have Storyboard References attached to your Tab Bar Controller you will notice that the storyboard reference actually has a UITabBarItem on it:

fake UITabBarItem

Do not set the properties for this "fake" UITabBarItem!

Your settings will do nothing at all when you run the app. The values you provide ONLY affect what you see in Interface Builder, not your app when you run it.

Solution

What you need to do is go to the ACTUAL view controller that your storyboard reference is pointing to. That view controller will also have a UITabBarItem on it. This is the "real" UITabBarItem. Set your properties (icon, title, etc.) there and you will see them show when you run the app.

actual view controller

like image 168
Mark Moeykens Avatar answered Oct 20 '22 02:10

Mark Moeykens


I have attached image describing connections:

  1. Connect TabBar Controller to your five View Controllers

  2. For each View Controller, select any View Controller -> Go to Editor in Xcode options at top -> Embed In -> Navigation Controller

  3. Select bottom bar in Navigation Controller -> open Attribute Inspector in Utilities -> provide the your title and image as highlighted in image

enter image description here

Navigation from Login/Register to TabBar Screen: Provide the Storyboard ID to TabBarController eg. "TabBarController" and create the TabBarController instance using Storyboard ID of corresponding Storyboard.

Swift 3

func navigateToTabBar() {
    let storyBoard : UIStoryboard = UIStoryboard(name: "Main", bundle:nil)
    let nextViewController = storyBoard.instantiateViewController(withIdentifier: "TabBarController") as UIViewController
    self.present(nextViewController, animated:true, completion:nil)
}
like image 16
Rahul Kumar Avatar answered Oct 20 '22 01:10

Rahul Kumar


Don't forget to set Selected Image property and Image property inside tab bar item and bar item category respectively!

enter image description here

like image 6
Vivek Avatar answered Oct 20 '22 00:10

Vivek