material-components_material-components-ios/components/ButtonBar

title	layout	section	excerpt
Button Bar	detail	components	The Button Bar component is a view that facilitates the creation and layout of a horizontally-aligned list of buttons.

Button Bar

[](docs/assets/button_bar.mp4)

The Button Bar is a view that represents a list of UIBarButtonItems as horizontally aligned buttons.

API Documentation

• MDCButtonBar
• MDCButtonBarDelegate

---

Installation

Requirements

• Xcode 7.0 or higher.
• iOS SDK version 7.0 or higher.

Installation with CocoaPods

To add this component to your Xcode project using CocoaPods, add the following to your Podfile:

pod 'MaterialComponents/ButtonBar'

Then, run the following command:

pod install

---

Overview

A Button Bar is similar in concept to a UIToolbar, but Button Bars are not a drop-in API replacement for UIToolbar. Button Bars are slightly more versatile in that one might use a Button Bar to create a Toolbar or a Navigation Bar (left/right button bars).

Button Bar supports a subset of UIBarButtonItem's properties. Learn more by reading the section on UIBarButtonItem properties.

---

Usage

Importing

Before using Button Bar, you'll need to import it:

Objective-C

#import "MaterialButtonBar.h"

Swift

import MaterialComponents

Create an instance of MDCButtonBar and provide it with an array of UIBarButtonItems.

Objective-C

MDCButtonBar *buttonBar = [[MDCButtonBar alloc] init];

UIBarButtonItem *item =
    [[UIBarButtonItem alloc] initWithTitle:@"<# title #>"
                                     style:UIBarButtonItemStyleDone // ignored
                                    target:self
                                    action:@selector(<# selector #>)];

buttonBar.items = @[ actionItem ];

CGSize size = [buttonBar sizeThatFits:self.view.bounds.size];
buttonBar.frame = (CGRect){<# origin #>, size};
[self.view addSubview:buttonBar];

Swift

let buttonBar = MDCButtonBar()

let actionItem = UIBarButtonItem(
  title: "<# title #>",
  style: .Done, // ignored
  target: self,
  action: "<# selector #>"
)

buttonBar.items = [actionItem]

let size = buttonBar.sizeThatFits(self.view.bounds.size)
buttonBar.frame = CGRect(x: <# x #>, y: <# y #>, width: size.width, height: size.height)
self.view.addSubview(buttonBar)

UIBarButtonItem properties

Supported

The following properties are taken into consideration when items is set and the corresponding buttons are created.

Changes made to properties marked (observed) will be reflected in the corresponding buttons.

• title (observed)
• image (observed)
• enabled (observed)
• width
• target
• action
• titleTextAttributesForState:

TODO(featherless): File bugs to observe the rest of the properties.

Note: in order to make Button Bar reflect changes to not-observed properties you must clear the MDCButtonBar instance's items property and reset it, like so:

Objective-C

item.target = <some other target>;

NSArray *items = buttonBar.items;
buttonBar.items = nil;
buttonBar.items = items;

Swift

item.target = <some other target>

let items = buttonBar.items
buttonBar.items = nil
buttonBar.items = items

Unsupported

TODO(featherless): File issues for each of these.

• style is ignored.
• instances initialized with initWithBarButtonSystemItem:. See issue #264 for more details.
• landscapeImagePhone
• imageInsets
• landscapeImagePhoneInsets
• possibleTitles