使用故事板更改 UItabbar 项目的图像

Question

I have the following story board:

As you can see there is a tab bar application with 5 tabs, on the storyboard I've assign the logo for each tab. Now when the user clicks a cell in a particular view I want to change the image of one of the tabs. How can I do this? I don't have an instance of the tab bar view controller or items since storyboards pretty much does all this for me. So my question is what methods do I have to implement to change the image? If I need the tab bar controller how can I get its instance and in which class should I point it to?

Thank you very much,

Answer 1

In any UIViewController class that is part of the Tab Bar hierarchy, all you have to do to get in instance of the tab bar controller is:

//In UIViewController
UITabBarController *tabBarController = self.tabBarController;

You can then change the image as so

//Suppose you want to change the 1st (0th) tab bar image
UITabBarItem * tabItem = [tabBarController.tabBar.items objectAtIndex: 0];
tabItem.image = //whatever image you want to change to

Answer 2

Each UIViewController has a property called tabBarItem which is a UITabBarItem that the tab bar controller uses to set the image representing that controller. You can manipulate that to change the image of the controller in question.

Answer 3

I found that -- at least in Xcode 6.1.1 using Swift -- the direct manipulation of the tabBarItem did not work for me.

However, @borrrden's answer put me on the right track. Apple's documentation for UITabBarController states pretty clearly:

You should never access the tab bar view of a tab bar controller directly. To configure the tabs of a tab bar controller, you assign the view controllers that provide the root view for each tab to the viewControllers property.

...

Tab bar items are configured through their corresponding view controller. To associate a tab bar item with a view controller, create a new instance of the UITabBarItem class, configure it appropriately for the view controller, and assign it to the view controller's tabBarItem property.

Therefore, in accordance with that, below is what I came up with that did work for me.

It's written in Swift, and I hope that future readers can translate it accordingly if they need to (I also changed the image names to be super-generic).

I also used UIImage's imageWithRenderingMode method so I could use custom images instead of the shadowy silhouette default images that iOS creates (I would like to credit @NSHeffalump's answer here for that...).

    if let viewControllers = tabBarController.viewControllers as? Array<UIViewController> {
        var tabBarItemImageNames = ["TabBarItemImage0","TabBarItemImage1","TabBarItemImage2","TabBarItemImage3","TabBarItemImage4"]
        var vcIndex = 0
        for vc:UIViewController in viewControllers {
            let selectedImage = UIImage(named: tabBarItemImageNames[vcIndex])?.imageWithRenderingMode(UIImageRenderingMode.AlwaysOriginal)
            let image = UIImage(named: tabBarItemImageNames[vcIndex])?.imageWithRenderingMode(UIImageRenderingMode.AlwaysOriginal)
            var tabBarItem = UITabBarItem(title: "", image: image, selectedImage: selectedImage)
            vc.tabBarItem = tabBarItem
            vcIndex++
        }
    }