2

I have an app that uses TabBar based navigation inside a storyboard to navigate to different views.

The app worked fine from iOS7 - iOS9. But with iOS10 the tab item disappears when it gets selected (icon and title).

The tab bar is completely configured in the story board, no custom user code. In XCode everything looks fine: enter image description here

But when the app is run on a iOS10 device/simulator the app looks like the following (the image shows different selections in the same tabbar, the behavior is the same for all 3 items) enter image description here

What could be the cause for this issue? Are there any work arounds?

paiden
  • 887
  • 7
  • 15
  • Please share if you found a solution! I am having trouble finding the source of this problem. – Maxime L Oct 01 '16 at 15:06
  • 1
    Unfortunately I never found a solution, and the app currently gets delivered in this state. Each workaround I tried caused various other problems. At the moment I assume its some bug in iOS10 and hope Apple will fix this... LOL as this would ever happen... – paiden Oct 03 '16 at 05:17
  • What XCode version do you use to compile? I am still using XCode 7.3 and maybe it is working when using 8. I will need to update my project to try... – Maxime L Oct 04 '16 at 17:47
  • I'm compiling with XCode 8.0 – paiden Oct 05 '16 at 10:36

4 Answers4

2

I finally found a solution to this issue. I am still not sure if this is due to a change or a bug in iOS 10.

Taken from this reply to an old question: https://stackoverflow.com/a/39884669/1567923

You need to create a custom TabBarViewController and use it in your storyboard. And in that view controller do something like that, to set the tintColor in code directly:

class UIMeeetTabBarController: UITabBarController, UITabBarControllerDelegate{

override func viewDidLoad() {
    super.viewDidLoad()        
    self.tabBar.tintColor = Style.colorRed
}

I hope this will work for you too.

Community
  • 1
  • 1
Maxime L
  • 178
  • 13
  • 1
    Setting the tint color from user code really did the trick, Thanks very much. – paiden Oct 10 '16 at 06:40
  • You can do this in Interface Builder by selecting the tab bar itself and then going to the "tab bar" (top) section of the Attributes inspector and setting the "Image tint" color. I presume that when you put a tab-bar item in the "selected" state, the control inverts the alpha channel of the graphic and lets the color of the underlying tab bar show through. If that color is clear or matches your tab-bar item's background exactly... you see nothing. – Oscar Mar 21 '19 at 01:56
1

Select your tabbar from tabbarController scene and set some tintColor under the view and then check if it works!

Ketan Parmar
  • 27,092
  • 9
  • 50
  • 75
  • Unfortunately this doesn't help. While the Icon gets the new tint color in XCode's designer, it is still invisible in running app. – paiden Sep 19 '16 at 05:01
1

You don't need to set up a custom tab-bar controller. The problem here is missing documentation (for which I filed a bug report with Apple and encourage you to do the same).

You can fix this in Interface Builder by selecting the tab bar itself and then going to the "Tab Bar" (top) section of the Attributes inspector and setting the "Image Tint" color. I presume that when a tab-bar item enters the "selected" state, the control inverts the alpha channel of the graphic and lets the color of the underlying tab bar show through. If that color is "clear" or matches your tab-bar item's background exactly... you see nothing. If you have a dark background, try setting this value to white.

The graphic for tab-bar items is displayed using only its alpha (non-transparent) pixels as a black-&-white image. These pixels will then allow the "tint" of the underlying tab bar to show through or not, depending on the unselected/selected state.

Oscar
  • 2,039
  • 2
  • 29
  • 39
0

I know this is an old one, but I faced the same issue in Xcode 9, and finally solved it without a single line of code. Go to the Attributes Inspector and make the Tab Bar Item Selected Image match the Bar Item Image...