4thSpace
4thSpace

Reputation: 44312

UIBarButtonItem with color?

Is it possible to have a red UIBarButtonItem?

Upvotes: 50

Views: 68510

Answers (11)

Artheyn
Artheyn

Reputation: 1180

When you have UIBarButtonItem setup in a Storyboard, you have to set the tintColor in the viewWillAppear() or viewDidAppear() method (putting it in viewDidLoad() doesn't work for me...):

- (void)viewWillAppear {
    [super viewWillAppear];
    [[self editButtonItem] setTintColor:[UIColor redColor]];
}

Or in Swift:

override func viewWillAppear(animated: Bool) {
    super.viewWillAppear(animated)
    editButtonItem.tintColor = UIColor.redColor()
}

Note: tested on iOS 8/9.

Upvotes: 0

frinkr
frinkr

Reputation: 664

Why not just :

[[self editButtonItem] setTintColor:[UIColor redColor]];

(on sdk 4.* , ios 5 and up)

Upvotes: 36

IMFletcher
IMFletcher

Reputation: 676

I wanted to add something to the highlighted solution. If you do this subclassing, it will not execute storyboard-defied segues and selectors that are assigned to the UIBarButtonItem. Further, the 'target' and 'action' properties are not set in the UIBarButtonItem so you can't access them from the subclass and assign them to your UIButton.

I worked around this by adding 2 properties to my subclass (using ARC):

@property (nonatomic, weak) id targetViewController;
@property (nonatomic, strong) NSString *segueIdentifier;

Next, in the init of your subclass, add something like this to the accepted answer code:

[button addTarget:self action:@selector(performAction) forControlEvents:UIControlEventTouchUpInside];

and a function:

- (void)performAction {
    if (_targetViewController && _segueIdentifier) {
        [_targetViewController performSegueWithIdentifier:_segueIdentifier sender:self];
    } else {
        NSLog(@"Requires targetViewController and segueIdentifier to be set");
    }
}

finally, in your main view controller that is hosting all of this, in the 'viewDidLoad', add this:

_fancyBarButtonItem.segueIdentifier = @"NewTransaction";
_fancyBarButtonItem.targetViewController = self;

Hope this helps someone else save time when they start down this path with Storyboards/iOS5

Upvotes: 0

Randall
Randall

Reputation: 14839

You can set the tintColor property of a UIBarButtonItem in iOS 5. If you need to support iOS 4, check out this blog post. It details using a UISegmentedControl styled to look like a single button.

Upvotes: 7

Carlos P
Carlos P

Reputation: 3988

Okay, there is actually a much better solution to this, in my opinion, which involves less code and uses the native UI controls.

The trick is to use a UISegmentedControl, and remove all the segments except one. (Can't be done in IB, has to be done programmatically).

Once you've done that, you set the tint colour, then create a UIBarButtonItem passing it the UISegmentedControl as a custom view.

This guy's used the technique to create a category of UIBarButtonItem which works brilliantly:

http://fredandrandall.com/blog/2011/03/31/how-to-change-the-color-of-a-uibarbuttonitem/

Upvotes: 2

Johan Wikström
Johan Wikström

Reputation: 921

If its the UIBarButtonItem of a UIToolbar

set this before your implementation in the file you want this code

@class UIToolbarTextButton;

Then change the toolbar buttons doing this:

   for (UIView *view in self.navigationController.toolbar.subviews) {
        NSLog(@"%@", [[view class] description]);
        if ([[[view class] description] isEqualToString:@"UIToolbarTextButton"]) {
            [(UIToolbarTextButton *)view setTintColor:yourcolor];
        }
    }   

Upvotes: 1

Scott Montgomerie
Scott Montgomerie

Reputation: 1830

If anyone is looking for code to exactly duplicate a simple UIBarButtonItem:

UIButton *button = [UIButton buttonWithType:UIButtonTypeCustom];
[button setBackgroundImage:[UIImage imageNamed:@"delete.png"] forState:UIControlStateNormal];
[button setTitle:@"Delete" forState:UIControlStateNormal];
button.titleLabel.font = [UIFont fontWithName:@"Helvetica-Bold" size:12.0f];
[button.layer setCornerRadius:4.0f];
[button.layer setMasksToBounds:YES];
[button.layer setBorderWidth:1.0f];
[button.layer setBorderColor: [[UIColor grayColor] CGColor]];
button.frame=CGRectMake(0.0, 100.0, 60.0, 30.0);
[button addTarget:self action:@selector(batchDelete) forControlEvents:UIControlEventTouchUpInside];

UIBarButtonItem* deleteItem = [[UIBarButtonItem alloc] initWithCustomView:button];

And delete.png is:

delete.png

Upvotes: 63

apalopohapa
apalopohapa

Reputation: 5183

If using IB (Interface Builder), drag a UIView from the Library onto the UIToolBar, and it will generate a UIBarButtonItem with a custom view. You can then add any other controls you want to it, e.g. UIButton, UILabel, UIActivityIndicatorView.

Upvotes: 0

Marcus Foster
Marcus Foster

Reputation: 356

You can create custom UIButton with your desired look and initialize your UIBarButtonItem with it as a custom view.

UIButton *button = [UIButton buttonWithType:....];
...(customize your button)...

UIBarButtonItem *barButton = [[UIBarButtonItem alloc] initWithCustomView:button];

Upvotes: 27

leftspin
leftspin

Reputation: 2488

Using a custom image doesn't work as it just uses the alpha to render the button.

Upvotes: 3

lostInTransit
lostInTransit

Reputation: 70997

You can create a custom image for the button and use that. Else, if you have set the tintColor of your navbar or toolbar to red, the button items on these will also appear red.

Upvotes: 1

Related Questions