Skip to content
This repository was archived by the owner on Feb 25, 2020. It is now read-only.

Repository files navigation

This package has been moved to https://github.com/react-navigation/react-navigation/tree/4.x/packages/material-bottom-tabs


React Navigation Material Bottom Tabs

Bottom Navigation component following Material design guidelines to use with React Navigation. Uses the Bottom Navigation component from React Native Paper.

Installation

Open a Terminal in your project's folder and run,

yarn add react-navigation-material-bottom-tabs react-native-paper

If you're on a vanilla React Native project, you also need to install and link react-native-vector-icons.

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 to opt-out.

If you use Expo, you don't need to install vector icons. But you will need to make sure that your .babelrc includes babel-preset-expo:

{
"presets": ["expo"]
}

If you don't use React Native Paper app, you should also add react-native-paper/babel to your .babelrc to avoid importing the whole library. See the Getting Started guide for more information.

Usage

import{createMaterialBottomTabNavigator}from'react-navigation-material-bottom-tabs';exportdefaultcreateMaterialBottomTabNavigator({Album: {screen: Album},Library: {screen: Library},History: {screen: History},Cart: {screen: Cart},},{initialRouteName: 'Album',activeColor: '#F44336',});

Docs

Documentation can be found on the React Navigation website.

About

A Material Design bottom tab navigator for React Navigation

Resources

Stars

175 stars

Watchers

2 watching

Forks

Releases

Packages

Used by

Contributors

Languages