Skip to content

Commit 4ea7291

Browse files
authored
Merge pull request #175 from react-navigation/tab-docs
Update tab navigator docs. Closes #174
2 parents 31779c4 + 8647044 commit 4ea7291

File tree

3 files changed

+8
-12
lines changed

3 files changed

+8
-12
lines changed

docs/bottom-tab-navigator.md

Lines changed: 3 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -67,10 +67,9 @@ Title string of a tab displayed in the tab bar or React Element or a function th
6767

6868
#### `tabBarOnPress`
6969

70-
Callback to handle tap events; the argument is an object containing:
70+
Callback to handle press events; the argument is an object containing:
7171

72-
* the `previousScene: { route, index }` which is the scene we are leaving
73-
* the `scene: { route, index }` that was tapped
74-
* the `jumpToIndex` method that can perform the navigation for you
72+
* `navigation`: navigation prop for the screen
73+
* `defaultHandler`: the default handler for tab press
7574

7675
Useful for adding a custom logic before the transition to the next scene (the tapped one) starts.

docs/material-top-tab-navigator.md

Lines changed: 3 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -22,7 +22,6 @@ The route configs object is a mapping from route name to a route config.
2222
* `backBehavior` - Should the back button cause a tab switch to the initial tab? If yes, set to `initialRoute`, otherwise `none`. Defaults to `initialRoute` behavior.
2323
* `swipeEnabled` - Whether to allow swiping between tabs.
2424
* `animationEnabled` - Whether to animate when changing tabs.
25-
* `configureTransition` - a function that, given `currentTransitionProps` and `nextTransitionProps`, returns a configuration object that describes the animation between tabs.
2625
* `initialLayout` - Optional object containing the initial `height` and `width`, can be passed to prevent the one frame delay in [react-native-tab-view](https://github.com/react-native-community/react-native-tab-view#avoid-one-frame-delay) rendering.
2726
* `tabBarComponent` - Optional, override the component to use as the tab bar.
2827
* `tabBarOptions` - An object with the following properties:
@@ -77,10 +76,9 @@ Title string of a tab displayed in the tab bar or React Element or a function th
7776

7877
#### `tabBarOnPress`
7978

80-
Callback to handle tap events; the argument is an object containing:
79+
Callback to handle press events; the argument is an object containing:
8180

82-
* the `previousScene: { route, index }` which is the scene we are leaving
83-
* the `scene: { route, index }` that was tapped
84-
* the `jumpToIndex` method that can perform the navigation for you
81+
* `navigation`: navigation prop for the screen
82+
* `defaultHandler`: the default handler for tab press
8583

8684
Useful for adding a custom logic before the transition to the next scene (the tapped one) starts.

docs/tab-based-navigation.md

Lines changed: 2 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -86,10 +86,9 @@ export default createBottomTabNavigator(
8686

8787
Let's dissect this:
8888

89-
* `tabBarIcon` is a property on `navigationOptions`, so we know we can use it on our screen components, but in this case chose to put it in the `TabNavigator` configuration in order to centralize the icon configuration for convenience.
89+
* `tabBarIcon` is a property on `navigationOptions`, so we know we can use it on our screen components, but in this case chose to put it in the `createBottomTabNavigator` configuration in order to centralize the icon configuration for convenience.
9090
* `tabBarIcon` is a function that is given the `focused` state and `tintColor`. If you take a peek further down in the configuration you will see `tabBarOptions` and `activeTintColor` and `inactiveTintColor`. These default to the the iOS platform defaults, but you can change them here. The `tintColor` that is passed through to the `tabBarIcon` is either the active or inactive one, depending on the `focused` state (focused is active).
91-
* In order to make the behavior the same on iOS and Android, we have explicitly provided `tabBarComponent`, `tabBarPosition`, `animationEnabled`, and `swipeEnabled`. The default behavior of `TabNavigator` is to show a tab bar on the top of the screen on Android and on the bottom on iOS, but here we force it to be on the bottom on both platforms.
92-
* Read the [full API reference](bottom-tab-navigator.html) for further information on `TabNavigator` configuration options.
91+
* Read the [full API reference](bottom-tab-navigator.html) for further information on `createBottomTabNavigator` configuration options.
9392

9493
## Jumping between tabs
9594

0 commit comments

Comments
 (0)