Merge pull request #2 from react-navigation/@satya164/updates

Update README and version
This commit is contained in:
Brent Vatne
2018-05-23 15:08:03 -07:00
parent c748660930
commit 22c844e4f5
6 changed files with 63 additions and 31 deletions

View File

@@ -1,3 +1,46 @@
# React Navigation Material Bottom Tabs
See: https://github.com/react-navigation/react-navigation-tabs
Bottom Navigation component following [Material design guidelines](https://material.io/design/components/bottom-navigation.html) to use with React Navigation. Uses the Bottom Navigation component from [React Native Paper](https://callstack.github.io/react-native-paper/bottom-navigation.html).
## Installation
Open a Terminal in your project's folder and run,
```sh
yarn add react-navigation-material-bottom-tabs
```
If you're on a vanilla React Native project, you also need to install and link [react-native-vector-icons](https://github.com/oblador/react-native-vector-icons).
```sh
yarn add react-native-vector-icons
react-native link react-native-vector-icons
```
If you don't want to install vector icons, you can use [babel-plugin-optional-require](https://github.com/satya164/babel-plugin-optional-require) to opt-out.
If you use CRNA or Expo, you don't need to install vector icons. But you will need to make sure that your `.babelrc` includes `babel-preset-expo`:
```json
{
"presets": ["expo"]
}
```
## Usage
```js
import { createMaterialBottomTabNavigator } from 'react-navigation-material-bottom-tabs';
export default createMaterialBottomTabNavigator({
Album: { screen: Album },
Library: { screen: Library },
History: { screen: History },
Cart: { screen: Cart },
}, {
initialRouteName: 'Album',
activeTintColor: '#F44336',
});
```
For more info, see: https://github.com/react-navigation/react-navigation-tabs