views:

14931

answers:

10

The UINavigationBar and UISearchBar both have a tintColor property that allows you to change the tint color (surprising, I know) of both of those items. I want to do the same thing to the UITabBar in my application, but have found now way to change it from the default black color. Any ideas?

+3  A: 

There is no simple way to do this, you basically need to subclass UITabBar and implement custom drawing to do what you want. It is quite a bit of work for the effect, but it may be worth it. I recommend filing a bug with Apple to get it added to a future iPhone SDK.

Louis Gerbarg
Sir, did you filled up a bug with apple?
sugar
A: 

Thanks. Bug filed in radar!

pixel
+17  A: 

I have been able to make it work by subclassing a UITabBarController and using private classes:

@interface UITabBarController (private)
- (UITabBar *)tabBar;
@end

@implementation CustomUITabBarController


- (void)viewDidLoad {
    [super viewDidLoad];

    CGRect frame = CGRectMake(0.0, 0.0, self.view.bounds.size.width, 48);
    UIView *v = [[UIView alloc] initWithFrame:frame];
    [v setBackgroundColor:kMainColor];
    [v setAlpha:0.5];
    [[self tabBar] addSubview:v];
    [v release];

}
@end
coneybeare
This is sort of an odd solution in that it just places semi transparent brown rectangle on top of the tabbar. The problem is that all the buttons are turned brown, not just the background. However this seems to be the best option anyone's presented so far.
Jonah
A: 

This is the great work, i was finding the solution and this topic is really helpful to me, but i still have issue that i want to change tabbaritem image to rgb and not gray scale color, is there any way to do so?

Hi, did you changed bg image of tabbar item programmatically?
Ayaz Alavi
+1  A: 

[v setBackgroundColor ColorwithRed: Green: Blue: ];

+7  A: 

when you just use addSubview your buttons will loose clickability, so instead of

[[self tabBar] addSubview:v];

use:

[[self tabBar] insertSubview:v atIndex:0];
Marcin Zbijowski
thanks it worked for me..
Biranchi
+11  A: 

I have an addendum to the final answer. While the essential scheme is correct, the trick of using a partially transparent color can be improved upon. I assume that it's only for letting the default gradient to show through. Oh, also, the height of the TabBar is 49 pixels rather than 48, at least in OS 3.

So, if you have a appropriate 1 x 49 image with a gradient, this is the version of viewDidLoad you should use:

- (void)viewDidLoad {

    [super viewDidLoad]; 

    CGRect frame = CGRectMake(0, 0, 480, 49);
    UIView *v = [[UIView alloc] initWithFrame:frame];
    UIImage *i = [UIImage imageNamed:@"GO-21-TabBarColorx49.png"];
    UIColor *c = [[UIColor alloc] initWithPatternImage:i];
    v.backgroundColor = c;
    [c release];
    [[self tabBar] addSubview:v];
    [v release];

}

Here's what the UITabBar looks like: http://www.lehigh.edu/sol0/TabBarGradient.jpg

pabugeater
if you want to make it pretty with a background picture, see this: http://duivesteyn.net/2010/01/16/iphone-custom-tabbar-background-image/
norskben
I think it needs to be: [[self tabBar] insertSubview:v atIndex:0];
Vibhor Goyal
A: 

other solution

sakrist
A: 

[[self tabBar] insertSubview:v atIndex:0]; works perfectly for me.

jimmy
A: 

These are great answers. If you're allowing autorotation, it's helpful to set the autoresizingMask of the subview to have flexible margins and size, or the new background won't resize with the tab bar.

pmjordan