/ Menu

A React Native bridge around native elegant selection list or dropdown menu

A React Native bridge around native elegant selection list or dropdown menu

react-native-selection-menu

This library is a React Native bridge around native elegant selection list or dropdown menu for both Android and iOS.

ReactNative: Native Selection Menu (Android/iOS)

iOS

rushisangani/RSSelectionMenu
ios-hero

Android

Hamadakram/AlertView
Banner
Hamadakram/AlertView
869f9e6c-48a2-11e7-9e6c-829b573e7730

📖 Getting started

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

$ react-native link react-native-selection-menu

  • Android
    • Please add below script in your build.gradle
buildscript {
    repositories {
        jcenter()
        maven { url "https://maven.google.com" }
        maven { url "https://jitpack.io" }
        ...
    }
}

allprojects {
    repositories {
        mavenLocal()
        jcenter()
        maven { url "https://maven.google.com" }
        maven { url "https://jitpack.io" }
        ...
    }
}

Note: Android SDK 27 > is supported

  • iOS

    iOS Prerequisite: Please make sure CocoaPods is installed on your system

    • After react-native link react-native-selection-menu, please verify node_modules/react-native-selection-menu/ios/ contains Pods folder. If does not exist please execute pod install command on node_modules/react-native-selection-menu/ios/, if any error => try pod repo update then pod install

    • After verification, open your project and create a folder 'RSSelectionMenu' under Libraries.

    • Drag node_modules/react-native-selection-menu/ios/pods/Pods.xcodeproject into RNSelectionMenu, as well as the RNSelectionMenu.xcodeproject if it does not exist.

    • Add the RSSelectionMenu.framework into your project's Embedded Binaries and make sure the framework is also in linked libraries.

    • Go to your project's Build Settings -> Frameworks Search Path and add ${BUILT_PRODUCTS_DIR}/RSSelectionMenu non-recursive.

    • Now build your iOS app through Xcode

💻 Usage

import { RNSelectionMenu } from 'react-native-selection-menu'
  • Actionsheet: RNSelectionMenu.Actionsheet(props)

  • Alert: RNSelectionMenu.Alert(props)

  • Formsheet: RNSelectionMenu.Formsheet(props)

💡 Props

  • General(iOS & Android)
Prop Type Default Note
`` ``

Selection

| Single | 0 |
| Multiple | 1 |

Limitation: Multiple selection is currently not supported on Android

GitHub