Edit this page on Github

iosTabBar

A component for displaying a tab bar.

@Component({
  selector: 'sample',
  template: `
<TabBar tintColor="white" barTintColor="darkslateblue">
  <TabBarItem systemIcon="history" [selected]="selectedTab == 'one'" (select)="selectedTab='one'"><Text>Tab one</Text></TabBarItem>
  <TabBarItem systemIcon="favorites" [selected]="selectedTab == 'two'" (select)="selectedTab='two'"><Text>Tab two</Text></TabBarItem>
  <TabBarItem systemIcon="featured" badge="8" [selected]="selectedTab == 'three'" (select)="selectedTab='three'"><Text>Tab three</Text></TabBarItem>
</TabBar>
  `
})
export class Sample {
  selectedTab: string = 'one';
}

Available styles

https://facebook.github.io/react-native/docs/view.html#style

Inputs

Inherits all inputs from high level component

barTintColor: color

To be documented

itemPositioning: enum('auto', 'fill', 'center')

To be documented

tintColor: color

To be documented

translucent: boolean

To be documented


Getting started

Features

bootstrapAPIsGesturesHttpRouterStyle

Components

ActivityIndicatorHighLevelComponentImagePickerRefreshControlScrollViewSliderSwitchTextTextInputViewWebView
Android
DrawerLayoutPagerLayoutProgressBarToolbar
iOS
DatePickerNavigatorProgressViewSegmentedControlTabBarTabBarItem

Directives

Opacity feedbackRipple feedback