143 lines
2.2 KiB
Markdown
143 lines
2.2 KiB
Markdown
---
|
|
id: tabbarios
|
|
title: TabBarIOS
|
|
layout: docs
|
|
category: components
|
|
permalink: docs/tabbarios.html
|
|
next: tabbarios-item
|
|
previous: switch
|
|
---
|
|
### Props
|
|
|
|
- [View props...](docs/view.html#props)
|
|
- [`barStyle`](docs/tabbarios.html#barstyle)
|
|
- [`barTintColor`](docs/tabbarios.html#bartintcolor)
|
|
- [`itemPositioning`](docs/tabbarios.html#itempositioning)
|
|
- [`style`](docs/tabbarios.html#style)
|
|
- [`tintColor`](docs/tabbarios.html#tintcolor)
|
|
- [`translucent`](docs/tabbarios.html#translucent)
|
|
- [`unselectedItemTintColor`](docs/tabbarios.html#unselecteditemtintcolor)
|
|
- [`unselectedTintColor`](docs/tabbarios.html#unselectedtintcolor)
|
|
|
|
|
|
|
|
|
|
|
|
|
|
---
|
|
|
|
# Reference
|
|
|
|
## Props
|
|
|
|
### `barStyle`
|
|
|
|
The style of the tab bar. Supported values are 'default', 'black'.
|
|
Use 'black' instead of setting `barTintColor` to black. This produces
|
|
a tab bar with the native iOS style with higher translucency.
|
|
|
|
| Type | Required |
|
|
| - | - |
|
|
| enum('default', 'black') | No |
|
|
|
|
|
|
|
|
|
|
---
|
|
|
|
### `barTintColor`
|
|
|
|
Background color of the tab bar
|
|
|
|
| Type | Required |
|
|
| - | - |
|
|
| [color](docs/colors.html) | No |
|
|
|
|
|
|
|
|
|
|
---
|
|
|
|
### `itemPositioning`
|
|
|
|
Specifies tab bar item positioning. Available values are:
|
|
|
|
- `fill` - distributes items across the entire width of the tab bar
|
|
- `center` - centers item in the available tab bar space
|
|
- `auto` (default) - distributes items dynamically according to the user interface idiom. In a horizontally compact environment (e.g. iPhone 5) this value defaults to `fill`, in a horizontally regular one (e.g. iPad) it defaults to center.
|
|
|
|
| Type | Required |
|
|
| - | - |
|
|
| enum('fill', 'center', 'auto') | No |
|
|
|
|
|
|
|
|
|
|
---
|
|
|
|
### `style`
|
|
|
|
|
|
|
|
| Type | Required |
|
|
| - | - |
|
|
| [ViewPropTypes.style](docs/viewproptypes.html#style) | No |
|
|
|
|
|
|
|
|
|
|
---
|
|
|
|
### `tintColor`
|
|
|
|
Color of the currently selected tab icon
|
|
|
|
| Type | Required |
|
|
| - | - |
|
|
| [color](docs/colors.html) | No |
|
|
|
|
|
|
|
|
|
|
---
|
|
|
|
### `translucent`
|
|
|
|
A Boolean value that indicates whether the tab bar is translucent
|
|
|
|
| Type | Required |
|
|
| - | - |
|
|
| bool | No |
|
|
|
|
|
|
|
|
|
|
---
|
|
|
|
### `unselectedItemTintColor`
|
|
|
|
Color of unselected tab icons. Available since iOS 10.
|
|
|
|
| Type | Required |
|
|
| - | - |
|
|
| [color](docs/colors.html) | No |
|
|
|
|
|
|
|
|
|
|
---
|
|
|
|
### `unselectedTintColor`
|
|
|
|
Color of text on unselected tabs
|
|
|
|
| Type | Required |
|
|
| - | - |
|
|
| [color](docs/colors.html) | No |
|
|
|
|
|
|
|
|
|
|
|
|
|