Create Blank Space Between Nav Bar Items?

Question

I've spent several hours on trying to figure this out to no end. My last option is to just create blank labels to create space, but I feel like their is a more cleaner way.

Basically I have three buttons and we're trying to create fixed space between them for neatness. Each button is programmatically added.

I found this code:

UIBarButtonItem *fixedItem = [[UIBarButtonItem alloc] initWithBarButtonSystemItem:UIBarButtonSystemItemFixedSpace target:nil action:nil];
fixedItem.width = 20.0f; // or whatever you want

(Source)

But how do you assign this piece of code to a certain button?

Aaron · Answer 1 · 2014-03-05T23:30:23.233

Its possible you're confused. You don't assign this code to a button. That code creates a button of type UIBarButtonSystemItemFixedSpace. So, do what the answer you linked to says. Create the fixed & flexible UIBarButtonItems (along with the other buttons you have), then set them on your navigation bar. In this case they would appear in the top left area of your navigation bar (via leftBarButtonItems):

// Create "Normal" buttons items:
UIBarButtonItem *button1 = [[UIBarButtonItem alloc] initWithTitle:@"1" style:UIBarButtonItemStylePlain target:Nil action:nil];
UIBarButtonItem *button2 = [[UIBarButtonItem alloc] initWithTitle:@"2" style:UIBarButtonItemStylePlain target:Nil action:nil];    
UIBarButtonItem *button3 = [[UIBarButtonItem alloc] initWithTitle:@"3" style:UIBarButtonItemStylePlain target:Nil action:nil];

// Create "Spacer" bar button items 
UIBarButtonItem *fixedItem = [[UIBarButtonItem alloc] initWithBarButtonSystemItem:UIBarButtonSystemItemFixedSpace target:nil action:nil];
fixedItem.width = 20.0f; // or whatever you want
UIBarButtonItem *flexibleItem = [[UIBarButtonItem alloc] initWithBarButtonSystemItem:UIBarButtonSystemItemFlexibleSpace target:nil action:nil];

self.navigationItem.leftBarButtonItems = @[button1, fixedItem, button2, flexibleItem, button3];

Additionally, if you had a toolbar you could use the toolbar's items property:

self.toolbar.items = @[button1, fixedItem, button2, flexibleItem, button3];

The spacing works now with the buttons, however now that the buttons are spaced they no longer work with the selector actions specified. The buttons were created as UIButton(s) before and then placed in a navbar array as UIBarButtonItems which was how they were able to function before. How do you suppose I go about getting the functionality back? — Camerz007, Mar 06 '14 at 01:09
We got it working! Thank you so much!! We had to change the target to "self". — Camerz007, Mar 06 '14 at 01:43
I had assumed that UIBarButtonSystemItemFixedSpace buttons were a default width. This post by Aaron clued me in to the fact that I needed to set the width. — Lewis Edward Garrett, Apr 19 '23 at 17:33

score 4 · Answer 2 · answered May 11 '16 at 08:11

4

If you want to do this in Interface Builder. I tried to drag a Flexible or Fixed Space Bar Item, but it doesn't seem to work in a Navigation Bar. Workaround: Drag a UIView between the Bar Buttons. Adjust the width of the UIView in the size inspector and set the color of view and Bar Button Item to clear color.

answered May 11 '16 at 08:11

twofish

354
4
16

Thanks for this. I wish there was a better way in IB though! Have you found any? – Bradley Thomas Dec 21 '16 at 20:40

score 0 · Answer 3 · answered Mar 05 '14 at 23:24

0

You would add this button, potentially multiple times, into an array with the other buttons. Then you would set that array as the rightBarButtonItems (or leftBarButtonItems) or your view controllers navigation item.

answered Mar 05 '14 at 23:24

Wain

118,658
15
128
151

Create Blank Space Between Nav Bar Items?

3 Answers3