0

I have an iPad app (Xcode 5, iOS 7, ARC and Storyboards). I have a UITabBarController, and each scene has a UITabBarItem.

When I tap a tab bar item, it goes to the correct scene, but the "current" tab bar item image is overlaid by a "blue box".

How can I replace that "blue box" with a different image? (I don't want to change the color; I want to replace it with a different image).

Tamás Sengel
  • 55,884
  • 29
  • 169
  • 223
SpokaneDude
  • 4,856
  • 13
  • 64
  • 120

3 Answers3

3

The images you use for a tab bar item have to have their renderingMode be, UIImageRenderingModeAlwaysOriginal or they will appear as blue squares (templates). The document called "Tab Bars", says this,

Tab Bar Item Icons

Each item in a tab bar can have a custom selected image and unselected image. You can specify these images when you initialize a tab bar item using the initWithTitle:image:selectedImage: method. Note that a tab bar item image will be automatically rendered as a template image within a tab bar, unless you explicitly set its rendering mode to UIImageRenderingModeAlwaysOriginal. For more information, see Template Images.

I don't think you can set them up in the storyboard, so you should do it in the controller's init method,

-(id)initWithCoder:(NSCoder *)aDecoder {
    if (self = [super initWithCoder:aDecoder]) {
        UIImage *img = [UIImage imageNamed:@"pic.jpg"];
        img  = [img imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal];
        [self.tabBarItem setSelectedImage:img];
    }
    return self;
}
rdelmar
  • 103,982
  • 12
  • 207
  • 218
  • @spokane-dude, If the unselected image is working for you, you really only need to do the setSelectedImage: part of the code I provided (I updated to take the other part out). Did you try that? I'm still not sure how you got the unselected image to work from IB -- if I set the image there, I just get a gray square the same size as my image. – rdelmar Aug 10 '14 at 16:16
  • It is possible to do it in storyboard only, you just need to have them on transparent background, then they will not become blue squares. – georgij Dec 22 '15 at 04:37
0

This is a Xcode error that will be fixed in 8.2 release. This is the Apple official note about this problem.Look in the link for Interface Builder > Resolved Issues > UITabBarController https://developer.apple.com/library/prerelease/content/releasenotes/DeveloperTools/RN-Xcode/Introduction.html

0

Swift 3+ version of rdelmar's code:

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

        let img = UIImage(imageLiteralResourceName: "pic").withRenderingMode(.alwaysOriginal)
        tabBarItem.selectedImage = img
    }
}
Tamás Sengel
  • 55,884
  • 29
  • 169
  • 223