@princewill_iroka/react-native-falling-drawer v1.0.14
react-native-falling-drawer
Customizable falling drawer for React Native
Installation
$ npm install react-native-falling-drawer --save
then
import React, { Component } from 'react';
import {
Text,
} from 'react-native'
import FallingDrawer from 'react-native-falling-drawer'
const SCREENS = [
{
key: "profile",
name: "Profile",
color: "red",
titleColor: "#fff",
hamburgerColor: "#fff",
render: () => <View><Text>This is profile screen</Text></View>
}
]
render() {
return (
<FallingDrawer screens={SCREENS}/>
);
}
}
Refer to the Example
Available props:
prop | type | description | default |
---|---|---|---|
screens | array | An array of sceens to switch between | |
headerHeight | number | Height of the header | ios: 60, android: 50 |
shakeDuration | number | Shake effect duration in ms | 800 |
optionCollapseSpeed | number | Collapse speed of the options in ms | 150 |
optionCollapseDelay | number | Delay between each option animation in ms | 200 |
diversifyAnimations | boolean | If true, it applies bounce, shake and swing animations to the options, otherwise only shake | true |
screens:
Each screen in the screens array is an object which looks like this:
{
key: "profile", // unique key among all screens
name: "Profile", // header and option title
color: "red", // header and option color
titleColor: "#fff",
hamburgerColor: "#fff",
render: () => {...} // specifies how the screen is rendered
customHeader: () => {...} // custom header and option
}
License
MIT
9 months ago
9 months ago
9 months ago
9 months ago
9 months ago
9 months ago
9 months ago
9 months ago
9 months ago
9 months ago
9 months ago
9 months ago
9 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago