make a UIBarButtonItem with customView behave like Flexible-Space item

Question

I have a UIBarButtonItem that has a UITextField as its customView. The toolbar contains this item and a few buttons.

As the toolbar resizes (say on a device-orientation change) I want the UITextField to grow or shrink (width) to occupy all the available space in the toolbar.

Short of figuring out the combined sizes of all the buttons in the toolbar, then setting the UITextField width appropriately, is there just some magical way to make this item behave like a flexible-space bar item?

Schulman

Answer 1

If you set UIViewAutoresizingFlexibleWidth to your textfield it should automatically shrink or grow.

Vinegarette

This will not take into account the other buttons - i.e. a long label will exceed its reasonable bounds... – Highstepper

This worked fantastically for my text field with a button on the right. Cheers! – Habitation

Answer 2

So as I wrote in the comment, the solution suggested by @Krishna_K does not work at all times.

Since I wrote my own method, thought of sharing. A portion of it is based on: Get the width of a UIBarButtonItem

// Expand the status label to fill remaining space
CGFloat totalItemsWidth = 0.0;
CGFloat itemsMargin     = 8.0;
for (UIBarButtonItem *barButtonItem in myToolbar.items) {
    if (barButtonItem != self.myLabelItem) {
        // Get width of bar button item (hack from other SO question)
        UIView *view = [barButtonItem valueForKey:@"view"];
        CGFloat width = view? [view frame].size.width : (CGFloat)0.0;

        totalItemsWidth += width + itemsMargin;
    }
}

self.myLabelItem.width = (myToolbar.frame.size.width - totalItemsWidth) - itemsMargin;

Comments:

• Can't explain why this works with flexible spaces, but it does

• Notice that items passed to UIToolbar are copied not retained - so you should always work on the bar items from the toolbar itself, not your local retained object.

• That hack in there is the only thing that worked for getting width (tried width property, tried after some delay so views are added, tried letting views expand on their own). Usual hack-warnings apply...

That's it folks...

Highstepper

That can't possibly work with flexible space UIBarButtonItem ... it doesn't have a view. – Kletter

It works because flexible buttons have a size of 0, and when you set the size of the one item, later those expand to fill the remaining gap, which should be close to 0. That is, when sized properly, the flexible space items will be close to 0. – Wainscot

Answer 3

I have a nice UIToolbar subclass I just wrote to do this, thanks to the code in Oded's post. It works fine for a toolbar with 5 items: button, flex space, textfield, flex space, button. By overriding layoutSubviews, it can properly adjust the UITextField width:

@implementation AdaptingTextFieldToolbar

- (void)layoutSubviews
{
    CGFloat totalItemsWidth = 0.0;
    CGFloat itemsMargin     = 8.0;
    UIBarButtonItem *textFieldBarButtonItem;
    for (UIBarButtonItem *barButtonItem in self.items) {
        // Get width of bar button item (hack from other SO question)
        UIView *view = [barButtonItem valueForKey:@"view"];
        if(view) {
            if([view isKindOfClass:[UITextField class]]) {
                textFieldBarButtonItem = barButtonItem;
            } else
            if(view.bounds.size.width > 0) {
                // Docs say width can be negative for variable size items
                totalItemsWidth += view.bounds.size.width + itemsMargin;
            }
        }
        totalItemsWidth += itemsMargin;
    }

    textFieldBarButtonItem.width = (self.bounds.size.width - totalItemsWidth) - itemsMargin;
    NSLog(@"WIDTH=%f", textFieldBarButtonItem.width);

    [super layoutSubviews];
}
@end

Wainscot