React Navigation Tabs
Tab navigators for React Navigation.
Open a Terminal in the project root and run:
yarn add react-navigation-tabs
If you are using Expo, you are done. Otherwise, continue to the next step.
yarn add react-native-reanimated react-native-gesture-handlerreact-native link react-native-reanimatedreact-native link react-native-gesture-handler
IMPORTANT: There are additional steps required for
react-native-gesture-handler on Android after running
react-native link react-native-gesture-handler. Check the this guide to complete the installation.
The package exports two different navigators:
createBottomTabNavigator: iOS like bottom tabs.
createMaterialTopTabNavigator: Material design themed top tabs with swipe gesture, from react-native-tab-view.
You can import individual navigators and use them:
;Album: screen: AlbumLibrary: screen: LibraryHistory: screen: HistoryCart: screen: Cart;
You can install another package,
react-navigation-material-bottom-tabs, to use a third type of tab navigator:
createMaterialBottomTabNavigator: Material design themed animated bottom tabs, from react-native-paper.
;Album: screen: AlbumLibrary: screen: LibraryHistory: screen: HistoryCart: screen: CartinitialRouteName: 'Album'activeTintColor: '#F44336';