• This repository has been archived on 25/Feb/2020
  • Stars
    star
    144
  • Rank 255,590 (Top 6 %)
  • Language
    TypeScript
  • License
    MIT License
  • Created over 6 years ago
  • Updated over 4 years ago

Reviews

There are no reviews yet. Be the first to send feedback to the community and the maintainers!

Repository Details

Drawer navigator for React Navigation

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


React Navigation Drawer

npm version CircleCI badge PRs Welcome

Drawer navigator for use on iOS and Android.

Installation

Open a Terminal in the project root and run:

yarn add react-navigation-drawer

If you are using Expo, you are done. Otherwise, continue to the next step.

Install and link react-native-gesture-handler and react-native-reanimated. To install and link them, run:

yarn add react-native-reanimated react-native-gesture-handler
react-native link react-native-reanimated
react-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.

Usage

import { createDrawerNavigator } from 'react-navigation-drawer';

export default createDrawerNavigator({
  Inbox: InboxStack
  Drafts: DraftsStack,
}, {
  initialRouteName: 'Inbox',
  contentOptions: {
    activeTintColor: '#e91e63',
  },
});

Development workflow

  • Clone this repository
  • Run yarn in the root directory and in the example directory
  • Run yarn dev in the root directory
  • Run yarn start in the example directory

Docs

Documentation can be found on the React Navigation website.

More Repositories

1

react-navigation

Routing and navigation for your React Native apps
TypeScript
23,453
star
2

react-native-safe-area-view

⚠️ Deprecated: use the successor react-native-safe-area-context instead!
TypeScript
660
star
3

hooks

React hooks for convenient react-navigation use
TypeScript
576
star
4

navigation-ex

Routing and navigation for your React Native apps
TypeScript
494
star
5

stack

Stack navigator for React Navigation
TypeScript
391
star
6

tabs

Tab navigators for React Navigation
TypeScript
327
star
7

react-navigation.github.io

Home of the documentation and other miscellanea
JavaScript
311
star
8

redux-helpers

Redux middleware and utils for React Navigation
JavaScript
295
star
9

material-bottom-tabs

A Material Design bottom tab navigator for React Navigation
TypeScript
174
star
10

animated-switch

A switch navigator but with transitions between screens powered by the react-native-reanimated Transitions API
TypeScript
159
star
11

search-layout

A basic search screen layout for usage with React Navigation.
JavaScript
125
star
12

web

Tools for react-navigation on web browsers and servers
JavaScript
95
star
13

rfcs

RFCs for changes to React Navigation
88
star
14

experimental-transitioner

A navigator for custom screen transitions with React Navigation and React Native
JavaScript
73
star
15

deep-linking-example

Example of usage of deep linking for blog post in React Navigation
TypeScript
67
star
16

core

Core utilities for the react-navigation framework shared between the native and web implementations.
JavaScript
62
star
17

native

React Native support for React Navigation. You probably don't need to use this directly, it's included in the react-navigation package.
JavaScript
46
star
18

web-server-example

Example for react-navigation and server-side rendering
JavaScript
44
star
19

create-react-app-example

Example create-react-app using react navigation
JavaScript
38
star
20

reanimated-stacks

TypeScript
21
star
21

boilerplate

Boilerplate app using React Navigation
TypeScript
13
star
22

theme-example

An example project with themes
Objective-C
12
star
23

ci-webhook

JavaScript
3
star
24

check-versions-action

Check for missing or outdated versions of packages mentioned in the issue
JavaScript
3
star
25

bot

A GitHub bot for react-navigation issues (currently unused)
JavaScript
2
star
26

deprecated-tab-navigator

Don't use this unless you have to. You will know if you have to
JavaScript
2
star
27

react-navigation-4

Code of React Navigation 4 for archiving
TypeScript
1
star