Can't assign multiple Buttons to UINavigationItem when using Storyboard with iOS 5

Question

I'm a iOS developer with a lot experience in developing the UI by code.

I'm now testing the Storyboard functionality, because I testing to switch to "design" the UI rather then implementing it. In the past I stuck with to much limits using nib/xib's and therefore I never succeed with the switch. So here comes a new try with storyboading :)

Now my question - I'm designing an iPad Storyboard which has a Navigation Controller and a Tableview Controller. I want to add multiple UIBarButtonItems, but I can just add one for each side with the Interface Builder.

The code would look like:

UIBarButtonItem *b = [[UIBarButtonItem alloc] initWithBarButtonSystemItem:UIBarButtonSystemItemBookmarks target:nil action:nil];

UIBarButtonItem *spacer = [[UIBarButtonItem alloc] initWithBarButtonSystemItem:UIBarButtonSystemItemFixedSpace target:nil action:nil];
spacer.width = 20;

self.navigationItem.rightBarButtonItems = [NSArray arrayWithObjects:self.editButtonItem, spacer, b, nil];

But why can't I add multiple buttons using the IB? There are only outlets for leftBarButtonItem, rightBarButtonItems, backBarButtonItems...

This is driving me crazy¡¡¡

Thanks!

Answer 1

I found an easy solution.

1) Add the folowing category:

@interface UINavigationItem(MultipleButtonsAddition)
@property (nonatomic, strong) IBOutletCollection(UIBarButtonItem) NSArray* rightBarButtonItemsCollection;
@property (nonatomic, strong) IBOutletCollection(UIBarButtonItem) NSArray* leftBarButtonItemsCollection;
@end

@implementation UINavigationItem(MultipleButtonsAddition)

- (void) setRightBarButtonItemsCollection:(NSArray *)rightBarButtonItemsCollection {
    self.rightBarButtonItems = [rightBarButtonItemsCollection sortedArrayUsingDescriptors:@[[NSSortDescriptor sortDescriptorWithKey:@"tag" ascending:YES]]];
}

- (void) setLeftBarButtonItemsCollection:(NSArray *)leftBarButtonItemsCollection {
    self.leftBarButtonItems = [leftBarButtonItemsCollection sortedArrayUsingDescriptors:@[[NSSortDescriptor sortDescriptorWithKey:@"tag" ascending:YES]]];
}

- (NSArray*) rightBarButtonItemsCollection {
    return self.rightBarButtonItems;
}

- (NSArray*) leftBarButtonItemsCollection {
    return self.leftBarButtonItems;
}

@end

2) Add your items to view controller (items will be sorted ascending by tag)

3) Connect your items with leftBarButtonItemsCollection or rightBarButtonItemsCollection outlet collection of UINavigationItem

Answer 2

EDIT

At the time I answered this question, Xcode was not offering the possibility of linking added buttons in the storyboard. The trick presented permitted to still have the segues designed in the storyboard.

With more recent versions of Xcode, for sure the solution introduced by @ecotax and later the more detailed answer of @ShimanskiArtem are the ones to be used.

---

I had the same problem as you and I found the following trick

Suppose you have a navigationController in which you would like to have multiple buttons. Since iOS 5 you can assign an array. The problem is that you lose all the benefits of using the storyboard as it will be done programmatically.

I used the following trick. Usually when you want multiple button on the navigation bar you don't want a toolbar.

In the current view (not in the navigation controller) where you want the buttons to appear, show the toolbar by changing

bottomBar = inferred to bottomBar = toolbar.

A toolbar will appear at the bottom. Add UIBarButtons to this bar. Link them to other view controllers using segues, etc ...

in your .h file create an outlet for each button

@property (strong, nonatomic) IBOutlet UIBarButtonItem *Button1;
@property (strong, nonatomic) IBOutlet UIBarButtonItem *Button2;
@property (strong, nonatomic) IBOutlet UIBarButtonItem *Button3;

Then in your viewDidLoad() link the buttons to the navigation bar and hide the toolbar. Add them in the reverse order of the order you want to see them

self.navigationItem.rightBarButtonItems =
    [NSArray arrayWithObjects:self.Button3, self.Button2, self.Button1, nil];

self.navigationController.toolbarHidden = YES;

And voilà you have multiple buttons in your navigation bar

and the result in the simulator