Drawer.md

Drawer

Drawer for both iOS and Android.
Drawer can be the perfect option to provide navigation options.
Replacing Component: React Native Drawer

Syntax

import React, { Component } from 'react';
import { Drawer } from 'native-base';
import SideBar from './yourPathToSideBar';
export default class DrawerExample extends Component {
  render() {
    closeDrawer = () => {
      this.drawer._root.close()
    };
    openDrawer = () => {
      this.drawer._root.open()
    };
    return (
      <Drawer
        ref={(ref) => { this.drawer = ref; }}
        content={<SideBar navigator={this.navigator} />}
        onClose={() => this.closeDrawer()} >
      // Main View
      </Drawer>
    );
  }
}

Note: You need to create your own SideBar component and import it.

Configuration

Property	Default	Option	Description
type	overlay	-	type of drawer
tapToClose	true	boolean	Close drawer on tap
openDrawerOffset	0.2	number	Defines right hand margin when drawer open
panCloseMask	0.2	number	Defines the screen width for the start of pan close action
closedDrawerOffset	0	number	Defines left hand margin when drawer closed
tweenHandler	-	Function	Takes in pan ratio that represents the tween percent and returns an object of native props to be set on constituent views