React Native Circle Menu

Check this library on other platforms:

Looking for developers for your project?
This project is maintained by Ramotion, Inc. We specialize in the designing and coding of custom UI for Mobile Apps and Websites.

Features

• Custom colors
• Custom size

Installation

npm install --save @ramotion/react-native-circle-menu

Usage

Look it in folder ./example

import React, {Component} from 'react'
import CircleMenu from '@ramotion/react-native-circle-menu'

class Example extends Component {
    items = [
      {
        name: 'md-home',
        color: '#298CFF'
      },
      {
        name: 'md-search',
        color: '#30A400'
      },
      {
        name: 'md-time',
        color: '#FF4B32'
      },
      {
        name: 'md-settings',
        color: '#8A39FF'
      },
      {
        name: 'md-navigate',
        color: '#FF6A00'
      }
    ];
    
    onPress = index => console.warn(`${this.items[index].name} icon pressed!`);
    
    render() {
    	return <CircleMenu
            bgColor="#E74C3C"
            items={this.items}
            onPress={this.onPress}
        />
    }
}

Props

Licence

Circle menu is released under the MIT license. See LICENSE for details.

Get the Showroom App for iOS to give it a try

Try this UI component and more like this in our mobild app. Contact us if interested.

Follow us for the latest updates