Edit 2011-11-04
Since iOS 5.0, UIButton and UIBarButtonItem have a tintColor property.
You may have noticed that the tint property is not available for UIButton and UIBarButtonItem.
Two common techniques to change the color, you can find around are drawing button with CoreGraphic or using a stretchable UIImage.
Lately, I found a new technique based on UISegmentedControl which you can use the tint property to change the color of your button. This control can be tweaked to have only one segment with a UIButton style (UISegmentedControlStyleBar).
A standard UISegmentedControl
Tweaking the control
We will now create a UISegmentedControl with one segment and set its tint color:
UISegmentedControl *button = [[[UISegmentedControl alloc] initWithItems:[NSArray arrayWithObjects:@"Add", nil]] autorelease];
button.frame = CGRectMake(0, 0, 160, 33);
button.center = self.view.center;
button.momentary = YES;
button.segmentedControlStyle = UISegmentedControlStyleBar;
button.tintColor = UIColorFromRGB(0x0000DD);
[self.view addSubview:button];
Compile your code, your button will look like the following screenshot:
Refer to the UISegmentedControl class reference for a detailled explanation of its properties.
I used a macro in this code to define my tint color. Macro definition is:
#define UIColorFromRGB(rgbValue) [UIColor \
colorWithRed:((float)((rgbValue & 0xFF0000) >> 16))/255.0 \
green:((float)((rgbValue & 0xFF00) >> 8))/255.0 \
blue:((float)(rgbValue & 0xFF))/255.0 alpha:1.0]
You can read more about defining macro or function here and here.
In a toolbar
You can also use this technique to tint UIBarButtonItem used in UIToolBar.
UIToolbar *toolbar = [[[UIToolbar alloc] init] autorelease];
toolbar.barStyle = UIBarStyleDefault;
[toolbar sizeToFit];
toolbar.frame = CGRectMake(0, self.view.frame.size.height-44, self.view.frame.size.width, 44);
[self.view addSubview:toolbar];
/* Create our tinted buttons */
UISegmentedControl *button = [[[UISegmentedControl alloc] initWithItems:[NSArray arrayWithObjects:@"Add", nil]] autorelease];
button.momentary = YES;
button.segmentedControlStyle = UISegmentedControlStyleBar;
button.tintColor = UIColorFromRGB(0x0d9c23);
UIBarButtonItem *barButton = [[[UIBarButtonItem alloc] initWithCustomView:button] autorelease];
UISegmentedControl *button2 = [[[UISegmentedControl alloc] initWithItems:[NSArray arrayWithObjects:@"Delete", nil]] autorelease];
button2.momentary = YES;
button2.segmentedControlStyle = UISegmentedControlStyleBar;
button2.tintColor = UIColorFromRGB(0xC84131);
UIBarButtonItem *barButton2 = [[[UIBarButtonItem alloc] initWithCustomView:button2] autorelease];
[toolbar setItems:[NSArray arrayWithObjects: barButton, barButton2, nil]];
You now have a toolbar with 2 tinted buttons that look like that:



Awesome work around, thanks for the heads up!
You’re welcome!
Pingback: How to change the color of a UIBarButtonItem | farp.blog
This is really awesome. I’ve been looking for a solution to this and was unhappy with having to use an image.
I took your code a little bit further and put it into a UIBarButtonItem category. Check it out http://fredandrandall.com/blog/2011/03/31/how-to-change-the-color-of-a-uibarbuttonitem/
Now you can tint the UIBarButtonItems on a tool bar in the IB file. There is a Tint drop down in the attribute inspector window tab.
Für die deutsche Communtiy empfehle ich bezüglich des UIButtons dieses Tutorial:
http://bedifferently.wordpress.com/2012/01/04/uibutton-konfiguriere-die-prasentation-des-buttons/
I was wondering how you make the buttons work. I’ve tried setting the selector on the segment and the UIBarButton, and nothing seems to work. Anyone got that working?
Great article, still usefull if you need to support iOS 4.3.
If you want to display an image / icon you can just init the UISegmentControll with one empty NSString (@”") and then use [button setImage:[UIImage imageNamed:@"icon.png"] forState:UIControlStateNormal]; to set the image.
When setting the action for the button remember to use forControlEvents:UIControlEventValueChanged!