A Ripple menu effect for your react native application
JavaScript
Switch branches/tags
Nothing to show
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Failed to load latest commit information.
.npmignore Create .npmignore Jun 23, 2017
README.md Update README.md Aug 1, 2017
ezgif.com-video-to-gif.gif
index.js
package.json Update package.json Jun 23, 2017

README.md

react-native-circular-menu

A Ripple menu effect for your react native application

npm version NPM downloads Package Quality Donate

Example

example

How to install

npm i -S react-native-circular-menu

How to use

import CircularMenu from 'react-native-circular-menu';

...

render(){
   return(
      <CircularMenu
         items={this._renderItems()}
         closeBtn={this._renderCloseBtn()}
         show={false}
         items={[...]}
         position={"topLeft"}
      />
   )
}

Props

Name Description Required
show Set true to show and false to hide yes
color Change color of ripple effect no
size Change the scale size of circle (default : 20) no
items Menu items (array) yes
position Change position of animation circle (default : topLeft) no
closeBtn Receives a component for close button yes

Positions

Circular Menu supports 7 positions, topLeft, topCenter, topRight, center, bottomLeft, bottomCenter, bottomRight.

TODO

  • Test in iPhone
  • Test in Android
  • Add animations

of coooourse PR are welcome :)