How to distribute buttons along length in UIToolbar?

Question

In my application, I use some code, to dynamically add buttons with images to a UIToolbar:

[self.navigationController setToolbarHidden:NO];
UIImage *buttonImage1 = [UIImage imageNamed:@"1.png"];
UIImage *buttonImage2 = [UIImage imageNamed:@"2.png"];
UIImage *buttonImage3 = [UIImage imageNamed:@"3.png"];

UIBarButtonItem *toolButton1 = [[UIBarButtonItem alloc] initWithImage:buttonImage1 style:UIBarButtonItemStylePlain target:self action:@selector(btnSettingsClick:)];
UIBarButtonItem *toolButton2= [[UIBarButtonItem alloc] initWithImage:buttonImage2 style:UIBarButtonItemStylePlain target:self action:@selector(btnSettingsClick:)];
UIBarButtonItem *toolButton3 = [[UIBarButtonItem alloc] initWithImage:buttonImage3 style:UIBarButtonItemStylePlain target:self action:@selector(btnSettingsClick:)];

[self setToolbarItems:[NSArray arrayWithObjects:toolButton1, toolButton2, toolButton3, nil]];

But it is not working well:

If I try to set another button style:

toolButton1.style = UIBarButtonSystemItemFlexibleSpace;
toolButton2.style = UIBarButtonSystemItemFlexibleSpace;
toolButton3.style = UIBarButtonSystemItemFlexibleSpace;

It also looks poor:

How can I fix this?

Increase

You may want to check out: #8644001 – Creight

Answer 1

Add two additonal bar buttons that use the system style UIBarButtonSystemItemFlexibleSpace and place one between each of your existing buttons:

[self.navigationController setToolbarHidden:NO];
UIImage *buttonImage1 = [UIImage imageNamed:@"1"];
UIImage *buttonImage2 = [UIImage imageNamed:@"2"];
UIImage *buttonImage3 = [UIImage imageNamed:@"3"];

UIBarButtonItem *toolButton1 = [[UIBarButtonItem alloc] initWithImage:buttonImage1 style:UIBarButtonItemStylePlain target:self action:@selector(btnSettingsClick:)];
UIBarButtonItem *toolButton2= [[UIBarButtonItem alloc] initWithImage:buttonImage2 style:UIBarButtonItemStylePlain target:self action:@selector(btnSettingsClick:)];
UIBarButtonItem *toolButton3 = [[UIBarButtonItem alloc] initWithImage:buttonImage3 style:UIBarButtonItemStylePlain target:self action:@selector(btnSettingsClick:)];

[self setToolbarItems:[NSArray arrayWithObjects:
    toolButton1, 
    [[UIBarButtonItem alloc] initWithBarButtonSystemItem:UIBarButtonSystemItemFlexibleSpace target:nil action:nil],
    toolButton2, 
    [[UIBarButtonItem alloc] initWithBarButtonSystemItem:UIBarButtonSystemItemFlexibleSpace target:nil action:nil],
    toolButton3, 
    nil]];

It's weird to conceptualize, but the flexible space is actually a distinct object and not a style to apply to other objects.

Hereof

Good answer, but the side note is incorrect. The @2x suffix works just fine with or without specifying the .png extension. In fact, the extension is required if it's not .png (it's possible to use @2x jpeg images). – Mustee

Answer 2

You need to use flexible spaces to have the buttons distribute along the length of your toolbar. Before the butttons, bettween each button, and after your buttons your should have a flexible space button. (UIBarButtonSystemItemFlexibleSpace)

UIBarButtonItem *flexibleSpaceBtn = [[UIBarButtonItem alloc] initWithBarButtonSystemItem:UIBarButtonSystemItemFlexibleSpace target:nil action:NULL]

Toolbar items array should be something like this:

[self setToolbarItems:[NSArray arrayWithObjects:toolButton1, flexibleSpaceBtn1, toolButton2, flexibleSpaceBtn2, toolButton3, nil]];

Chair

Answer 3

Here is some ref code that I use -

//Constants
let imageNames : [String] = ["img1.png", ... "imgN.png"];

/********************************************************************************/
/** @fcn        spacingDemo()
 *  @brief      space all toolbar items evenly across the UIToolbar on keyboard
 *
 *  @param      [in] (UITextView) textView : view to attach keyboard to in response
 */
/********************************************************************************/
func spacingDemo() {

    //Vars
    var barButtons : [UIBarButtonItem];
    var button : UIButton;
    var img    : UIImage;

    //Init
    keyboardToolbar = UIToolbar();
    barButtons      = [UIBarButtonItem]();

    //Config
    keyboardToolbar.barTintColor = UIColor.lightGray;   /* set bkgnd color      */
    let flexBarButton = UIBarButtonItem(barButtonSystemItem: .flexibleSpace, target: nil, action: nil);
    barButtons.append(flexBarButton);                   /* size-to-fit          */

    for imageName in imageNames {

        //Gen Button
        button = UIButton(type: .custom);
        button.setImage(UIImage(named: imageName), for: .normal);
        button.addTarget(self, action:  #selector(self.keyboardResponse), for: .touchUpInside);
        barButtons.append(UIBarButtonItem(customView: button));

        //Apply Spacing
        let flexBarButton = UIBarButtonItem(barButtonSystemItem: .flexibleSpace, target: nil, action: nil);
        barButtons.append(flexBarButton);               /* size-to-fit          */
    }

    //Assemble
    keyboardToolbar.items = barButtons;

    //Attach
    textView.inputAccessoryView = keyboardToolbar;

    //Cleanup
    keyboardToolbar.sizeToFit();

    return;
}

Kamenskuralski