rn-expandable-circle-menu v1.0.2

React Native Expandable Circle Menu

React Native expandable circle menu library

Demo

Installation

First, download the library from npm:

npm install rn-expandable-circle-menu --save

Usage

import CircleMenu from 'rn-expandable-circle-menu'

const openMenuButton = {
  image: require('./assets/openMenu.png'),
}

const closeMenuButton = {
  image: require('./assets/closeMenu.png'),
  // You can override style of every item
  style: {
    backgroundColor: 'red'
  }
}

const menuItems = [
  {
    image: require('./assets/shareLogo.png'),
    onClick: () => {
      alert('Share button pressed')
    },
    style: {
      backgroundColor: 'yellow'
    }
  },
  {
    image: require('./assets/searchLogo.png'),
    onClick: () => {
      alert('Search button pressed')
    }
  },
  {
    image: require('./assets/moreLogo.png'),
    onClick: () => {
      alert('More button pressed')
    }
  },
  {
    image: require('./assets/downloadLogo.png'),
    onClick: () => {
      alert('Download button pressed')
    }
  },
];


const CircleMenuView = () => {
  return (
    <CircleMenu
      menuItems={menuItems}
      openMenuButton={openMenuButton}
      closeMenuButton={closeMenuButton}
    />
  )
}

Props

menuItems

openMenuButton & closeMenuButton