Separator between toolbar items in UIToolbar

Question

How to add a separator between buttons in a UIToolbar?

Sample image is shown in the below link

enter image description here

score 16 · Answer 1 · answered May 02 '13 at 17:28

I did it with a custom view button, with a 1 pixel wide background:

UILabel *label = [[UILabel alloc] initWithFrame:CGRectMake(0, 0, 1, 44)];
label.backgroundColor = [UIColor whiteColor];

UIBarButtonItem *divider = [[UIBarButtonItem alloc] initWithCustomView:label];
// Add button to array of toolbar items
[items addObject:divider];
// Or set items directly:
//toolbar.items = [NSArray arrayWithObject:divider];
label.text = @"";

score 6 · Accepted Answer · answered Feb 07 '12 at 18:19

6

I can think of two ways :

(a) You could make them very thin toolbar buttons with user interaction disabled.

(b) Your other choice would be to implement your own toolbar. I'd try (a) first ;)

answered Feb 07 '12 at 18:19

deanWombourne

38,189
13
98
110

I had to do that in the past and the easiest way, under iOS 5 at least, was to use method (a). Using the new custom appearance api, setting a background image and setting the button width to 1px, the effect was very convincing. You can then use flexible spacers as usual to keep everything aligned just right. – droussel Mar 01 '12 at 15:13

score 1 · Answer 3 · answered Oct 14 '17 at 17:24

1

You can also make a toolbar button and set the Title = |

answered Oct 14 '17 at 17:24

3Stone

143
6

score 0 · Answer 4 · answered Feb 07 '12 at 18:24

0

If yo want a clean, simple layout I would prefer a very thin image with this separator in it. Then you can add fix distances between your normal button, the separator image button (user interaction disabled) and the next button.

answered Feb 07 '12 at 18:24

andi1984

676
10
27

Separator between toolbar items in UIToolbar

4 Answers4

Linked