iOS: UIBarButton Proper Size

Question

In my iOS application on UIToolbar I have added "Done" custom button with image.

UIBarButtonItem *btnNextDoneDisable;
UIToolbar *navigateQuestionBar;

//*to add button

UIImage *img_done = [UIImage imageNamed:DONE_RED_BTN_PNG(appDelegate.isIphone)];
        btn = [UIButton buttonWithType:UIButtonTypeCustom];
        [btn setImage:img_done forState:UIControlStateNormal];
        btn.frame = CGRectMake(0.0, 0.0, img_done.size.width, img_done.size.height);
        [btn addTarget:self action:@selector(doneClicked) forControlEvents:UIControlEventTouchUpInside];
        btnNextDoneDisable = [[UIBarButtonItem alloc] initWithCustomView:btn];

 [arrButtons addObject:btnNextDoneDisable];

navigateQuestionBar.items = arrButtons;

Done button image sizes are:

80 × 30

156 × 57

But this looks disturb on iPad Pro(11.0),

What is the proper size for button?

score 1 · Answer 1 · answered Jan 24 '18 at 15:42

The proper size for Navigation Bar and Toolbar Icons, according to Human Interface Guidelines should be:

+-------------------------------+-------------------------------+
|         Target sizes          |         Maximum sizes         |
+-------------------------------+-------------------------------+
| 72px × 72px (24pt × 24pt @3x) | 84px × 84px (28pt × 28pt @3x) |
| 48px × 48px (24pt × 24pt @2x) | 56px × 56px (28pt × 28pt @2x) |
+-------------------------------+-------------------------------+

Here is a reference to Apple's Guidelines: https://developer.apple.com/ios/human-interface-guidelines/icons-and-images/custom-icons/

nice reference but not an answer to the question specified – Daij-Djan Jan 24 '18 at 16:44 — Daij-Djan, Jan 24 '18 at 16:44

score 0 · Answer 2 · answered Jan 24 '18 at 16:43

0

UIBarButtonItems have a fixed sizes and ignore any other size.

Additionally items added to a UINavigationBar or UIToolbar are placed by apple.

=> you cant set frame size or frame origin of your UIBarButtonItem

answered Jan 24 '18 at 16:43

Daij-Djan

49,552
17
113
135

score 0 · Answer 3 · answered Jan 24 '18 at 16:58

The problem is that in iOS 11 you must set the size of your UIBarButtonItem's customView by using constraints (so that the item is sized "from the inside out"). You are not doing that; your button has a frame, but that is not the correct way to size it. Give the button height and width constraints so that the runtime knows how to size the bar button item.

iOS: UIBarButton Proper Size

3 Answers3