ChatGPT解决这个技术问题 Extra ChatGPT

Change tab bar item selected color in a storyboard

I want to change my tab bar items to be pink when selected instead of the default blue.

How can i accomplish this using the storyboard editor in Xcode 6?

Here are my current setting which are not working, the blue background works but the pink doesnt work:

https://i.stack.imgur.com/9XeMZ.png

Possible duplicate of tab-bar-item-tint-color!
Check this answer it will help you for the solution: stackoverflow.com/a/58727092/7804300

M
Mehul Thakkar

Add Runtime Color attribute named "tintColor" from StoryBoard. This is working(for Xcode 8 and above).

if you want unselected color.. you can add unselectedItemTintColor too.

https://i.stack.imgur.com/pXUay.png


it worked for me when I added this property to UITabBarItem and not UITabBar.
But how do you set the tab bar item UNselected color in storyboard?
Works perfect for my case - I need my five tabBar items to be unique colours when selected. I was able to set this Runtime Attribute on the UITabBarItem, on the UINavigationController connected to my tabBar and it works flawlessly. All without writing any code too which is great, as I am reusing a VC class three times. Thanks!
conversely - this is the only approach that works on iOS 10 (tint from attributes panel seems to not work, and runtime attribute "tintColor" of uitabbaritem doesn't work too.
StackOverflow 1 : Apple 0
M
Marcelo Gracietti

This elegant solution works great on SWIFT 3.0, SWIFT 4.2 and SWIFT 5.1:

On the Storyboard:

Select your Tab Bar Set a Runtime Attibute called tintColor for the desired color of the Selected Icon on the tab bar Set a Runtime Attibute called unselectedItemTintColor for the desired color of the Unselected Icon on the tab bar

https://i.stack.imgur.com/2YBT2.png

Edit: Working with Xcode 8/10, for iOS 10/12 and above.


Thanks a lot. unselectedItemTintColor finds very rare
'unselectedItemTintColor' perfect solution for me thanks.
Will this work if deployment target is 8.0 or 9.0? I have used swift 3.0 and Xcode 8.0 for development
Important to select the Tab bar, indeed worked in Swift 4 for me.
Excellent! Still working on xCode 10 :) does not refresh the visual editor but works once compiled :)
J
Jarrod

In Swift, using xcode 7 (and later), you can add the following to your AppDelegate.swift file:

UITabBar.appearance().tintColor = UIColor(red: 255/255.0, green: 255/255.0, blue: 255/255.0, alpha: 1.0)

This is the what the complete method looks like:

func application(application: UIApplication, didFinishLaunchingWithOptions launchOptions: [NSObject: AnyObject]?) -> Bool {

    // I added this line
    UITabBar.appearance().tintColor = UIColor(red: 255/255.0, green: 255/255.0, blue: 255/255.0, alpha: 1.0)

    return true
}

In the example above my item will be white. The "/255.0" is needed because it expects a value from 0 to 1. For white, I could have just used 1. But for other color you'll probably be using RGB values.


It seems none of the other method works (any more.) This works!
@Jarrod I was fooling around with this for almost 1 hr, this answer should have more votes. Thanks!
F
Francisco Romero

On Xcode8 I have changed the ImageTint from the storyboard and it works well.

https://i.stack.imgur.com/LJ9bb.png

The result:

https://i.stack.imgur.com/Q3ILk.png


When using custom images THIS IS the one that worked for me
This should be the accepted answer. It doesn't require a runtime attribute which means this works in Launch screens!
D
Derek Soike

Swift 3 | Xcode 10

If you want to make all tab bar items the same color (selected & unselected)...

Step 1

Make sure your image assets are setup to Render As = Template Image. This allows them to inherit color.

https://i.stack.imgur.com/jJt6J.png

Step 2

Use the storyboard editor to change your tab bar settings as follows:

Set Tab Bar: Image Tint to the color you want the selected icon to inherit.

Set Tab Bar: Bar Tint to the color you want the tab bar to be.

Set View: Tint to the color you want to see in the storyboard editor, this doesn't affect the icon color when your app is run.

https://i.stack.imgur.com/mkwX3.png

Step 3

Steps 1 & 2 will change the color for the selected icon. If you still want to change the color of the unselected items, you need to do it in code. I haven't found a way to do it via the storyboard editor.

Create a custom tab bar controller class...

//  TabBarController.swift

class TabBarController: UITabBarController {

    override func viewDidLoad() {
        super.viewDidLoad()

        // make unselected icons white
        self.tabBar.unselectedItemTintColor = UIColor.white
    }
}

... and assign the custom class to your tab bar scene controller.

https://i.stack.imgur.com/QrfpL.png

If you figure out how to change the unselected icon color via the storyboard editor please let me know. Thanks!


self.tabBar.unselectedItemTintColor = UIColor.white self.tabBar.tintColor = #colorLiteral(red: 0.2, green: 0.7333333333, blue: 0.3450980392, alpha: 1) Work for me
A
Andy Weinstein

This best way is to change Image Tint in storyboard

https://i.stack.imgur.com/3zmRH.png


N
Nick

put this code in the viewDidLoad of the view controller that you want to change the color of

[[UITabBar appearance] setSelectedImageTintColor:[UIColor whiteColor]];

Is there no way to change for all of the tabs?
Just put the code with the same color in the view did load of all of your tabs
you can use this code right after you make your UITabController , it will set the colour you mentioned for all tab items on selection.
There's no such method setSelectedImageTintColor
A
Arvind Kumar

You can also set selected image bar tint color by key path:

https://i.stack.imgur.com/WubCq.png

Hope this will help you!! Thanks


in iOS 9 it doesn't change the unselected color
How would that help in changing color of UITabBar icon ?
L
Lajos Arpad

XCode 8.2, iOS 10, Swift 3: now there's an unselectedItemTintColor attribute for tabBar:

self.tabBar.unselectedItemTintColor = UIColor(red: 0/255.0, green: 200/255.0, blue: 0/255.0, alpha: 1.0)

G
Genevios

You can change colors UITabBarItem by storyboard but if you want to change colors by code it's very easy:

// Use this for change color of selected bar

   [[UITabBar appearance] setTintColor:[UIColor blueColor]];

// This for change unselected bar (iOS 10)

   [[UITabBar appearance] setUnselectedItemTintColor:[UIColor yellowColor]];

// And this line for change color of all tabbar

   [[UITabBar appearance] setBarTintColor:[UIColor whiteColor]];

setUnselectedItemTintColor is for only iOS 10
s
skypirate

Somehow we are not able to change the Tab Bar selected item Tint color using storyboard alone, hence I added below code in my ViewDidLoad, hope this helps.

[[UITabBar appearance] setTintColor:[UIColor whiteColor]]; 

S
SHINTO JOSEPH

Add this code in your app delegate -did_finish_launching_with_options function

UITabBar.appearance().tintColor = UIColor( red: CGFloat(255/255.0), green: CGFloat(99/255.0), blue: CGFloat(95/255.0), alpha: CGFloat(1.0) )

put the RGB of the required color


K
Krutika Sonawala

Image Tint from storyboard worked for me.

https://i.stack.imgur.com/CC5Aa.png


a
arauter

This is the solution in Swift 3 that works in iOS 10:

Firstly, you create your own tab bar controller subclass and add it to your tab controller in your storyboard. In the viewDidLoad() method you can then customize the tab bar. It should be stated here that the tintColor attribute of the tabBar represents the color of the selected item not the color of the unselected ones! In order to change the color of the unselected items, I recommend looping through each item and use the original colors of your images, so they are not rendered as grey automatically.

class CustomTabBarVC: UITabBarController
{
    override func viewDidLoad()
    {
        super.viewDidLoad()

        self.tabBar.tintColor = AppColor.normalRed
        self.tabBar.barTintColor = .white
        self.tabBar.isTranslucent = true

        if let items = self.tabBar.items
        {
            for item in items
            {
                if let image = item.image
                {
                    item.image = image.withRenderingMode( .alwaysOriginal )
                }
            }
        }
    }
}

The only downside with this approach is that your item images must already have the desired color you aim for.


Complicated. Jarrod's answer works well with all icons.
c
chancyWu

You can subclass the UITabBarController, and replace the one with it in the storyboard. In your viewDidLoad implementation of subclass call this:

[self.tabBar setTintColor:[UIColor greenColor]];

getting: 'UITabBar' does not have a member named 'setSelectedImageTintColor'
Also i am using swift so I put: self.tabBar.setSelectedImageTintColor = UIColor.greenColor not sure if that is correct or not
@Deekor it's tintColor not selectedImageTintColor, btw selectedImageTintColor is deprecated in iOS 8.