UITabBarItem icon not colored correctly for iOS 13 when a bar tint color is specified in Interface Builder in Xcode 11, beta 2

Jordan Wood picture Jordan Wood · Jul 1, 2019 · Viewed 8.4k times · Source

I have a problem with the color of my UITabBarItems when I run on iOS 13 simulators, using Xcode 11, beta 2. I have made a sample project from scratch, and everything works correctly when I do not specify a bar tint color. However, when I do specify a custom bar tint color via Interface Builder, I get this:

Both selected an unselected item icons have highlight color

All items icons in the tab bar have the selected color if I set the "Bar Tint" property in Interface Builder to anything but clear. When it is set to clear, the icons are colored properly. The icons are also colored properly if I compile and run in an iOS 12 simulator.

This seems like a bug in Xcode 11, but maybe I'm missing something?

Answer

Samuël picture Samuël · Sep 24, 2019

There is a new appearance API in iOS 13. To color tabbar item's icon and text correctly using Xcode 11.0 you can use it like this:

    if #available(iOS 13, *) {
        let appearance = UITabBarAppearance()

        appearance.backgroundColor = .white
        appearance.shadowImage = UIImage()
        appearance.shadowColor = .white

        appearance.stackedLayoutAppearance.normal.iconColor = .black
        appearance.stackedLayoutAppearance.normal.titleTextAttributes = [NSAttributedString.Key.foregroundColor: UIColor.black]
        appearance.stackedLayoutAppearance.normal.badgeBackgroundColor = .blue

        appearance.stackedLayoutAppearance.selected.iconColor = .red
        appearance.stackedLayoutAppearance.selected.titleTextAttributes = [NSAttributedString.Key.foregroundColor: UIColor.red]

        self.tabBar.standardAppearance = appearance

    }