rnr

react-native-reside-menu

Add a cool reside menu to your react-native application.

Showing:

Popularity

Downloads/wk

1

GitHub Stars

10

Maintenance

Last Commit

4yrs ago

Contributors

0

Package

Dependencies

1

License

MIT

Type Definitions

Tree-Shakeable

No?

Categories

Readme

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

Example. Animations are smoother

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

PropsdescriptiontypeisRequireddefaultValue
VisibleComponentThe top component in the reside menu (two layer) stackReact Elementtruenull
HiddenComponentThe bottom component in the reside menu (two layer) stack. Hidden by the top layer before action.React Elementtruenull
xCoordA number which dictates how far away the reside menu is pushed, on the X Axisnumberfalse300 dp
onResideStateChangecall back to when the state changes. -1, 0, 1 for left center and rightfunctionfalsenull

Rate & Review

Great Documentation0
Easy to Use0
Performant0
Highly Customizable0
Bleeding Edge0
Responsive Maintainers0
Poor Documentation0
Hard to Use0
Slow0
Buggy0
Abandoned0
Unwelcoming Community0
100