UITabBar not showing selected item images in ios 7

Question

The icons show fine in ios 6 but not in ios 7. I'm setting the selected state in the viewController viewDidLoad method. When the user selects a tab bar item the image disappears. Here is my code:

UITabBar *tabBar = self.tabBarController.tabBar;
if ([UITabBar instancesRespondToSelector:@selector(setSelectedImageTintColor:)]) {
    [self.tabBarController.tabBar setSelectedImageTintColor:[UIColor whiteColor]];
}
UITabBarItem *item0 = [tabBar.items objectAtIndex:0];
UITabBarItem *item1 = [tabBar.items objectAtIndex:1];
UITabBarItem *item2 = [tabBar.items objectAtIndex:2];
UITabBarItem *item3 = [tabBar.items objectAtIndex:3];
[item0 setTitle:@"Home"];
[item1 setTitle:@"Calendar"];
[item2 setTitle:@"News"];
[item3 setTitle:@"My Events"];
[item0 setFinishedSelectedImage:[UIImage imageNamed:@"homeIconSelected.png"] withFinishedUnselectedImage:[UIImage imageNamed:@"home2.png"]];
[item1 setFinishedSelectedImage:[UIImage imageNamed:@"Calendar"] withFinishedUnselectedImage:[UIImage imageNamed:@"CalendarIconSelected"]];
[item2 setFinishedSelectedImage:[UIImage imageNamed:@"NewsIconSelected"] withFinishedUnselectedImage:[UIImage imageNamed:@"News"]];
[item3 setFinishedSelectedImage:[UIImage imageNamed:@"EventsIconSelected"] withFinishedUnselectedImage:[UIImage imageNamed:@"Events"]];
[item1 imageInsets];
[item2 imageInsets];
[item3 imageInsets];

Answer 1

Swift version of showing selected and unselected images and title with UIAppearance API In your Appdelegate.m copy following code if you have tab base app.following code assume you have 4 tab bar.

let tabBarController: UITabBarController = (self.window!.rootViewController as! UITabBarController)

    let tabBar:UITabBar = tabBarController.tabBar

    let tabBarItem1:UITabBarItem = tabBar.items![0]
    let tabBarItem2:UITabBarItem = tabBar.items![1]
    let tabBarItem3:UITabBarItem = tabBar.items![2]
    let tabBarItem4:UITabBarItem = tabBar.items![3]

    tabBarItem1.title = "Home";
    tabBarItem2.title = "Maps";
    tabBarItem3.title = "My Plan";
    tabBarItem4.title = "Settings";

    tabBarItem1.selectedImage = UIImage(named: "home_selected.png")!
    tabBarItem2.selectedImage = UIImage(named: "maps_selected.png")!
    tabBarItem3.selectedImage = UIImage(named: "myplan_selected.png")!
    tabBarItem4.selectedImage = UIImage(named: "settings_selected.png")!

     tabBarItem1.image =  UIImage(named: "home.png")!
     tabBarItem2.image =  UIImage(named: "maps.png")!
     tabBarItem3.image =  UIImage(named: "myplan.png")!
     tabBarItem4.image =  UIImage(named: "settings.png")!


    let tabBarBackground: UIImage = UIImage(named: "tabbar.png")!
    UITabBar.appearance().backgroundImage = tabBarBackground
    UITabBar.appearance().selectionIndicatorImage = UIImage(named: "tabbar_selected.png")!


    UITabBarItem.appearance().setTitleTextAttributes([
        NSForegroundColorAttributeName : UIColor.whiteColor()
        ]
        , forState: .Normal)
    let titleHighlightedColor: UIColor = UIColor(red: 153 / 255.0, green: 192 / 255.0, blue: 48 / 255.0, alpha: 1.0)
    UITabBarItem.appearance().setTitleTextAttributes([
        NSForegroundColorAttributeName : titleHighlightedColor
        ]
        , forState: .Highlighted)

Answer 2

I had a similar problem. I created the tab bar in storyboard and added all the images through the interface builder menus, none in code.

My fix was actually simple: under the attributes inspector window in IB, the Tab Bar Item field for "Selected Image" should be blank, and the Bar Item field for "Image" should be filled with the image you want.

I am running Xcode 6.0.1 and testing with iOS 8.0.2 devices.

Answer 3

Use the code below to fix the image issue in iOS7:

[[UITabBarItem alloc] initWithTitle:@"title" image:[[UIImage imageNamed:@"YOUR_IMAGE.png"] imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal] selectedImage:[[UIImage imageNamed:@"YOUR_SEL_IMAGE.png"] imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal]];

Answer 4

Here is a Swift solution for Swift-Guys :)

class CustomTabBar: UITabBar {

    required init?(coder aDecoder: NSCoder) {
        super.init(coder: aDecoder)

        let btnNames = ["Title1", "Title2", "Title3", "Title4"]

        for (item, name) in zip(items!, btnNames) {
            item.image = UIImage(named: "bar\(name)Btn")?.imageWithRenderingMode(.AlwaysOriginal)
            item.selectedImage = UIImage(named: "bar\(name)SelectedBtn")?.imageWithRenderingMode(.AlwaysOriginal)
            item.title = name
            item.setTitleTextAttributes([NSForegroundColorAttributeName: UIColor.blackColor()], forState: .Normal)
            item.setTitleTextAttributes([NSForegroundColorAttributeName: UIColor.redColor()], forState: .Selected)
        }
    }

}

What is exactly going on here:

• Make array of btn titles and consider image file names to match them
• Make For loop over tab bar items and just created btn titles array
• Set barButtonItem's image and its selectedImage from the array
• Set title text from the array
• Set title text color for states .Normal and .Selected

Setting text colors part is important if you don't want to keep the item's title color gray for .Normal and blue for .Selected, as it is by default. This is often actual when you consider custom images for tab bar items.

Answer 5

Add these lines of codes in

- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions
{
UITabBarController *tabBarController = (UITabBarController *)self.window.rootViewController;
UITabBar *tabBar = tabBarController.tabBar;
UITabBarItem *tabBarItem1 = [tabBar.items objectAtIndex:0];
UITabBarItem *tabBarItem2 = [tabBar.items objectAtIndex:1];
UITabBarItem *tabBarItem3 = [tabBar.items objectAtIndex:2];
UITabBarItem *tabBarItem4 = [tabBar.items objectAtIndex:3];

tabBarItem1.selectedImage = [[UIImage imageNamed:@"selectimg"] imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal ];
tabBarItem1.image = [[UIImage imageNamed:@"deselectimg"] imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal ];
tabBarItem1.title = @"xxxx";

tabBarItem2.selectedImage = [[UIImage imageNamed:@"selectimg"]imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal ];
tabBarItem2.image = [[UIImage imageNamed:@"deselectimg"]imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal ];
tabBarItem2.title = @"xxxx";

tabBarItem3.selectedImage = [[UIImage imageNamed:@"selectimg"]imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal ];
tabBarItem3.image = [[UIImage imageNamed:@"deselectimg"]imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal ];
tabBarItem3.title = @"xxxx";

tabBarItem4.selectedImage = [[UIImage imageNamed:@"selectimg"]imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal ];
tabBarItem4.image = [[UIImage imageNamed:@"deselectimg"]imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal ];
tabBarItem4.title = @"xxxx";

return YES;
}

this works for me... and hope for the best...

Answer 6

You should write to the function:

UIImage* tab_image = [UIImage imageNamed:@"tab_image.png"];
UIImage* tab_image_selected = [UIImage imageNamed:@"tab_image_selected.png"];

tab_image = [tab_image imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal];
tab_image_selected = [tab_image_selected imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal];

self.tabBarItem.image = tab_image;
self.tabBarItem.selectedImage = tab_image_selected;

I hope this helps