node package manager

react-native-popover-menu

React Native: Popover Menu

This library is a ReactNative bridge around native popup/popover menus. It allows you to create simple popup menus.

Before we dive into on how to use this library. We would like to thank all the contributor of zawadz88/MaterialPopupMenu & liufengting/FTPopMenu libraries for providing such a awesome nice, cool library

Getting started

$ npm install react-native-popover-menu --save

$ react-native link react-native-popover-menu

Usage

import RNPopoverMenu from 'react-native-popover-menu';
 
  • React Way
<RNPopover visible={this.state.visible} reference={this.ref}>
  <RNPopover.Menu label={"Editing"}>
    <RNPopover.Menu label={"Copy"} icon={copy} />
    <RNPopover.Menu label={"Paste"} icon={paste} />
  </RNPopover.Menu>
  <RNPopover.Menu >
    <RNPopover.Menu label={"Share"} icon={share} />
  </RNPopover.Menu>
</RNPopover>;
  • API Way
    RNPopoverMenu.Show(this.ref, {
      title: "",
      menus: [ ],
      onDone: selection => { },
      onCancel: () => { }
    });

Props

Prop Type Default Note
title string Title of popove section
tintColor: iOS string Color of tint
perferedWidth: iOS number Perfered Width of the Popover
rowHeight: iOS number Height of the menu row
menus array Array of Menus
onDone(sectionSelection, menuSelection) func It is called when menu is selected
onCancel func It is called when we close the popover

Credits

Contribution

Contributions are welcome and are greatly appreciated! Every little bit helps, and credit will always be given.

License

This library is provided under the MIT License.

RNBottomActionSheet @ Pranav Raj Singh Chauhan

Other Contributions

Screenshots

Screenshots Screenshots

Screenshots

Screenshots

Screenshots