CODEWITHSUNDEEP
iphoneiosobjective-cipad
ij_
ij_

Reputation: 239

UITabBarItem image color is grey while original image is white

I use the following code to create image for my UITabBarItem

self.tabBarItem.image = [UIImage imageNamed:@"tab_img.png"];

This tab_img.png consists of black, white and clear color. But in app all part of image that is black and white turns to grey. How I can change this grey to white ?

this is image that I use

enter image description here

Upvotes: 14

Views: 21526

Answers (7)

DariusV
DariusV

Reputation: 2773

For me the best way is changing the image color.

 func imageWithColor(_ color: UIColor) -> UIImage? {
        UIGraphicsBeginImageContextWithOptions(size, false, scale)
        let context = UIGraphicsGetCurrentContext()!
        context.translateBy(x: 0, y: size.height)
        context.scaleBy(x: 1.0, y: -1.0)
        context.setBlendMode(.normal)

        let rect = CGRect(x: 0, y: 0, width: size.width, height: size.height)
        context.clip(to: rect, mask: cgImage!)

        color.setFill()
        context.fill(rect)

        let newImage = UIGraphicsGetImageFromCurrentImageContext()!
        UIGraphicsEndImageContext()
        newImage.accessibilityIdentifier = accessibilityIdentifier
        return newImage
    }

then, you can update the tabBarItem's properties such as image and selectedImage:

 func setupColorAttributes(to item: UITabBarItem) {
        item.image = item.image?.imageWithColor(.white)?.withRenderingMode(.alwaysOriginal)
        item.selectedImage = item.image?.imageWithColor(.highLight)?.withRenderingMode(.alwaysOriginal)
    }

Upvotes: 0

luca.giorgetti.spot
luca.giorgetti.spot

Reputation: 161

If you are using image assets, just set the field "Render As" of your images (selected and unselected images) to "Original Image" (example)

Then in your xib set "Image" and "Selected Image" fields on your Tab Bar Item (example)

Upvotes: 16

Cornel Damian
Cornel Damian

Reputation: 733

In iOS7, if you use IB you can subclass UITabBarController then add this:

+ (void)initialize
{
    //the color for the text for unselected tabs
    [UITabBarItem.appearance setTitleTextAttributes:@{NSForegroundColorAttributeName : [UIColor redColor]} forState:UIControlStateNormal];

    //the color for selected icon
    [[UITabBar appearance] setSelectedImageTintColor:[UIColor whiteColor]];    
}

- (void)viewDidLoad
{
    [super viewDidLoad];

    if ([[[UIDevice currentDevice] systemVersion] floatValue] >= 7) {
        for (UITabBarItem *tbi in self.tabBar.items) {
            tbi.image = [tbi.image imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal];
        }
    }
}

if you create the items manualy you must set the UIImageRenderingModeAlwaysOriginal on each icon and add the code from initialize.

Upvotes: 33

Husrat Mehmood
Husrat Mehmood

Reputation: 2310

Only Way is to go to IB(interface builder) and select the UITabBarItem in your View Controller and go to "file inspector" scroll down and you will see Global Tint her you can set it to no color or any color that you want it will take effect for the selected image.

as per the following code is concern 

setFinishedSelectedImage: withFinishedUnselectedImage:;

this is no longer available in iOS 7 rather we can use

[yourCustomTabBarItem setSelectedImage:---];

but this will also take effect of this Global tint color.

Upvotes: 0

blub
blub

Reputation: 1014

images for UITabBarItems should be alpha channel only ! the opaque part will appear grey (blue if selected) only, though!

take a look at: http://devinsheaven.com/creating-uitabbar-uitoolbar-icons-in-adobe-illustrator/

Upvotes: 3

fibnochi
fibnochi

Reputation: 1113

Set selected and unselected image.

[self.tabBarItem setFinishedSelectedImage:[UIImage imageNamed:@"mehr_icon"] withFinishedUnselectedImage:[UIImage imageNamed:@"mehr_icon"]];

Upvotes: 10

pmk
pmk

Reputation: 1897

I had the same problem once, I use images with white and alpha only like this image

I set it with self.tabBarItem.image = [UIImage imageNamed:@"Liste"];

Upvotes: 0

Related Questions