1.2.2 • Published 7 years ago
react-native-reside-menu v1.2.2
react-native-reside-menu
Add a cool full-screen reside menu to your react-native application. Implemented using pure JavaScript. Uses NativeDriver for better performance.
This JS implementation is taken from Android - AndroidResideMenu iOS - iOS REsideMenu
Installation
npm i -S react-native-reside-menu
Usage
import React, { Component } from 'react';
import ResideMenu from 'react-native-reside-menu';
import { View } from 'react-native';
const vc = () => <View style={{ flex: 1,backgroundColor: '#444' }} />
export default class App extends Component {
render() {
return (
<ResideMenu
onResideStateChange={(s) => { console.log(s) }}
VisibleComponent={() => <View style={{ flex: 1, backgroundColor: '#eee' }} />}
HiddenComponent={() => <View style={{ flex: 1, backgroundColor: '#eee' }} />}
/>
)
}
}
Props
Props | description | type | isRequired | defaultValue |
---|---|---|---|---|
VisibleComponent | The top component in the reside menu (two layer) stack | React Element | true | null |
HiddenComponent | The bottom component in the reside menu (two layer) stack. Hidden by the top layer before action. | React Element | true | null |
xCoord | A number which dictates how far away the reside menu is pushed, on the X Axis | number | false | 300 dp |
onResideStateChange | call back to when the state changes. -1, 0, 1 for left center and right | function | false | null |