1.0.4 • Published 1 year ago

rn-actionsheet-module v1.0.4

Weekly downloads
187
License
MIT
Repository
github
Last release
1 year ago

React Native ActionSheet

This package will help you to using ActionSheetIOS(IOS) and BottomSheetDialog(Android).

Usage of this package same as for IOS and Android. Also this package usage same as ActionSheetIOS

Using ActionSheetIOS component for IOS and using RecyclerView and BottomSheetDialog for Android as NativeModule.

Version 1.0.4

  • tintColor added for Android
  • backgroundColor added for Android

Getting Started

With NPM

npm install --save rn-actionsheet-module

With YARN

yarn add rn-actionsheet-module

After React Native v0.60 you don't need to link anything. Native Modules are now Autolinked

Automatic linking

react-native link rn-actionsheet-module

Manual Linking

Manual Installation (If something went wrong with react-native link)

Props

PropsTypeRequiredOS
optionsIOSarrayYesIOS
optionsAndroidarrayYesAndroid
titlestringYesAndroid, IOS
messagestringNoIOS
tintColorstringNoIOS, Android
backgroundColorstringNoAndroid
destructiveButtonIndexnumberNoIOS
cancelButtonIndexnumberNoIOS
onCancelAndroidIndexnumberYesAndroid
With v0.2.0

Android doesn't need any cancel option but back button or outside click will return onCancelAndroidIndex

Usage

import ActionSheet from 'rn-actionsheet-module'

<TouchableOpacity onPress={() => {
   ActionSheet(
       {
          title             : "Lorem ipsum",
          optionsIOS        : ["Cancel", "From Gallery", "From Camera"],
          optionsAndroid        : ["From Gallery", "From Camera"],
          destructiveButtonIndex: null, // undefined // 1, 2, etc.,
          cancelButtonIndex     : 0, // 
          onCancelAndroidIndex: 3 // android doesn't need any cancel option but back button or outside click will return onCancelAndroidIndex
       }, (index) => {
        switch (index) {
         case Platform.OS === "ios" ? 1 : 0 :{
           alert("From Camera clicked")
         }
         case Platform.OS === "ios" ? 2 : 1 :{
           alert("From Camera clicked")
         }
         case Platform.OS === "ios" ? 0 : 3 :{
           alert("onCancel")
         }
         default:{
           alert("Default")
         }
        }
       }
   )
}}>
  <Text>Show ActionSheet</Text>
</TouchableOpacity>

FYI

You can use more than one ActionSheet in same screen.

License

This project is licensed under the MIT License - see the LICENSE.md file for details