How to programmatically replace UIToolBar items bu

Question

I have a toolbar with various image buttons, created in Interface Builder.

I'd like to be able to programmatically replace one of the buttons with an activity indicator when pressed, and then put back the original button but change its color from white to yellow when the activity completes.

Is this possible with an IB built toolbar or must I look at building the whole toolbar programmatically and custom views?

Answer 1

Here is an example of what I did in a similar situation. I wanted to build the toolbar using Interface Builder but toggle one of the BarButtonItems based on whether or not it was "checked". In this example, there are a few key things to note. The following 2 member variables are defined for the class in the header file:

NSMutableArray *toolbarItems;
IBOutlet UIToolbar *toolbar;
NSUInteger checkUncheckIndex;

When I want to update the checked status, I call this function... Please note that there is a selector defined called checkUncheckClicked that is called when the particular button in the UIToolbar is clicked. And the UIToolbar is set up as an IBOutlet to toolbar. Alternately, you could hook up the UIBarButtonItem as an outlet itself and use that as your logic to identify the index of the button, or for that matter, you could hard-code the index of the button if things won't change over time. Finally, there is a checked.png and unchecked.png to alternate between that is included in the project.

- (void)updateBarButtonItemChecked:(BOOL)checked {
    if (toolbarItems == nil) {
        toolbarItems = [[NSMutableArray arrayWithArray:toolbar.items] retain];
        checkUncheckIndex = -1;

        for (NSUInteger i = 0; i < [toolbarItems count]; i++) {
            UIBarButtonItem *barButtonItem = [toolbarItems objectAtIndex:i];
            if (barButtonItem.action == @selector(checkUncheckClicked)) {
                favoriteIndex = i;
                break;
            }
        }
    }

    if (checkUncheckIndex != -1) {
        UIBarButtonItem *barButtonItem = [[[UIBarButtonItem alloc] initWithImage:[UIImage imageNamed:checked ? @"checked.png" : @"unchecked.png"] 
                                                                           style:UIBarButtonItemStylePlain target:self action:@selector(checkUncheckClicked)] autorelease];
        [toolbarItems replaceObjectAtIndex:checkUncheckIndex withObject:barButtonItem];

        toolbar.items = toolbarItems;
    }
}

And, of course toolbarItems and toolbar should be released in your dealloc for the class.

Hope this helps!

Answer 2

For the entire toolbar that you created in IB (that is to say, not the individual toolbar items), create an IBOutlet:

@IBOutlet weak var toolbarThatYouMade: UIToolbar!

This is an array of individual toolbar items, so you would access the leftmost member (for example) with a [0] index:

toolbarThatYouMade.items![0].image = UIImage(named: "New Image")

This code assumes that you have an image named "New Image" in your assets.

You can then trigger an image change for a toolbar item without having to access that specific item itself; for example, if you were using this for something like a media player, you could toggle pause/play images from:
a) the Pause/Play button itself,
b) the Stop button,
c) when you are notified of a change of player state,
or
d) something else entirely. (Be brave! Be bold! Be something else that begins with 'b'!)