d0866fc6f0
ButtonBar, FlexibleHeader, HeaderStackView, and NavigationBar are all implementation details of AppBar. While these components can be used on their own, in practice we expect most typical usage to rely on AppBar. FlexibleHeader is a bit blurry in that there is often value in relying on it solely, but because it is not a true concept in the spec and its behavioral demos largely overlap with AppBar's, it is now a dragons demo. Pivotal story: https://www.pivotaltracker.com/story/show/156982162
Header Stack Views
The Header Stack View component is a view that coordinates the layout of two vertically stacked bar views.
Design & API Documentation
Installation
Installation with CocoaPods
To add this component to your Xcode project using CocoaPods, add the following to your Podfile:
pod 'MaterialComponents/HeaderStackView'
To add this component along with its themer and other related extensions, please add the following instead:
pod 'MaterialComponents/HeaderStackView+Extensions'
Then, run the following command:
pod install
Overview
This view's sole purpose is to facilitate the relative layout of two horizontal bars. The bottom bar will bottom align and be of fixed height. The top bar will stretch to fill the remaining space if there is any.
The top bar is typically a navigation bar. The bottom bar, when provided, is typically a tab bar.
Usage
Importing
Before using Header Stack View, you'll need to import it:
Swift
import MaterialComponents.MaterialHeaderStackView
Objective-C
#import "MaterialHeaderStackView.h"
Header Stack View provides MDCHeaderStackView, which is a UIView subclass.
Swift
let headerStackView = MDCHeaderStackView()
Objective-C
MDCHeaderStackView *headerStackView = [[MDCHeaderStackView alloc] init];
You may provide a top bar:
Swift
headerStackView.topBar = navigationBar
Objective-C
headerStackView.topBar = navigationBar;
You may provide a bottom bar:
Swift
headerStackView.bottomBar = tabBar
Objective-C
headerStackView.bottomBar = tabBar;