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