704f2a21aa
Reviewers: larche, #mdc_ios_owners Reviewed By: larche Subscribers: featherless Projects: #material_components_ios Differential Revision: http://codereview.cc/D421
| title | layout | section |
|---|---|---|
| Header Stack View | detail | documentation |
Header Stack View
The Header Stack View component is a view that coordinates the layout of two vertically-stacked bar views.
Material Design Specifications
API Documentation
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/HeaderStackView'
Then, run the following command:
$ pod install
Usage
This view's sole purpose is to facilitate the relative layout of its two bars in a predictable way.
The top bar is typically a navigation bar. The bottom bar, when provided, is typically a tab bar.
TODO(featherless): Add link to specification (do this above).
TODO(featherless): Add conceptual screenshots of the various scenarios. To include:
- Only a top bar.
- Only a bottom bar.
- Two bars.
TODO(featherless): Discuss relationship to UIStackView introduced in iOS 9.
Integration
The HeaderStackView can be treated like a typical UIView.
Create a header stack view:
MDCHeaderStackView *headerStackView = [MDCHeaderStackView new];
You may provide a top bar:
headerStackView.topBar = navigationBar;
You may provide a bottom bar:
headerStackView.bottomBar = tabBar;
You'll certainly size the header stack view to fit:
headerStackView.frame = self.view.bounds;
[headerStackView sizeToFit];
Add the view:
[self.view addSubview:headerStackView];