Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

iPhone Toolbar button spacing

Is there a way to have the UIBarButtonItems in a toolbar space themselves out evenly?

like image 651
Ian Vink Avatar asked May 10 '10 22:05

Ian Vink


People also ask

How Big Should buttons be iOS?

In this article it's 7 principles about button design. In the Human Interface Guidelines, Apple recommends a minimum target size of 44 pixels (px) wide 44 pixels tall.

Where is the status bar on iPhone?

The icons in the status bar at the top of the screen provide information about iPhone. On an iPhone with Face ID, there are additional status icons at the top of Control Center.


2 Answers

Ignore the width on UIBarButtonItem suggestion; this is not the correct approach as recommended by Apple and will not work if you want to add further icons.

The correct approach is to add a "Flexible space" (technically another button!) in between each button. You see it in Interface Builder, or it can be added directly in code if needed.

like image 94
h4xxr Avatar answered Sep 21 '22 15:09

h4xxr


Drop a Flexible Space bar button item in between your UIBarButtonItems. This is pretty easy to do in IB, look down the bottom of the controls.

If you want to do this programtically, this code should help:

UIBarButtonItem* button1 = [[UIBarButtonItem alloc] initWithTitle:@"Button1" style:UIBarButtonItemStyleBordered target:self action:@selector(button1Action)];
UIBarButtonItem* button2 = [[UIBarButtonItem alloc] initWithTitle:@"Button2" style:UIBarButtonItemStyleBordered target:self action:@selector(button2Action)];
UIBarButtonItem *flexibleSpace = [[UIBarButtonItem alloc] initWithBarButtonSystemItem:UIBarButtonSystemItemFlexibleSpace target:nil action:nil];
[myToolbar setItems:[NSArray arrayWithObjects:button1, flexibleSpace, button2, nil]];
like image 43
Ben Williams Avatar answered Sep 20 '22 15:09

Ben Williams