Picker Modal For React Native

An easy and fully customizable picker modal for React Native.

How to use it:

1. Install and import the Picker Modal component.

# NPM
$ npm i react-native-picker-modal
import PickerModal from "@freakycoder/react-native-picker-modal";

2. Create a basic Picker modal in your app.

<PickerModal
  title="Modal Title"
  isVisible={isVisible}
  data={["Action 1", "Action 2"]}
  onPress={(selectedItem: string) => {
    Alert.alert("Alert", selectedItem);
  }}
  onCancelPress={() => {
    setVisible(false);
  }}
  onBackdropPress={() => {
    setVisible(false);
  }}
/>

3. Available props.

style?: CustomStyleProp;
dividerStyle?: CustomStyleProp;
cancelButtonStyle?: CustomStyleProp;
titleTextContainer?: CustomStyleProp;
titleTextStyle?: CustomTextStyleProp;
cancelButtonTextStyle?: CustomTextStyleProp;
data: string[];
title: string;
isVisible: boolean;
TouchableComponent?: any;
cancelButtonUnderlayColor?: string;
onPress: (selectedItem: string) => void;
onCancelPress: () => void;
onBackdropPress?: () => void;

Preview:

Picker Modal For React Native

Download Details:

Author: WrathChaos

Live Demo: View The Demo

Download Link: Download The Source Code

Official Website: https://github.com/WrathChaos/react-native-picker-modal

License: MIT

Tags:

Add Comment