@optisolbusiness/react-native-image-picker

A React Native module that allows you to select a photo/video from the device library or camera, documents from device library.

Installation

npm install @optisolbusiness/react-native-image-picker react-native-permissions react-native-document-picker react-native-image-picker react-native-awesome-alerts

iOS

update your package.json by adding the permissions,

 "reactNativePermissionsIOS": [
    "Camera",
    "PhotoLibrary",
    "Microphone"
  ],

then run npx react-native setup-ios-permissions followed by pod install

Then update your Info.plist with permissions usage descriptions:

<key>NSCameraUsageDescription</key>
<string>Your message to users when the camera is accessed for the first time</string>
<key>NSPhotoLibraryUsageDescription</key>
<string>Your message to users when the photo library is accessed for the first time</string>
<key>NSMicrophoneUsageDescription</key>
<string>YOUR TEXT</string>

Android

Add permissions to your app android/app/src/main/AndroidManifest.xml file:

 <uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE" />
 <uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" /> 
 <uses-permission android:name="android.permission.CAMERA"/>

Usage

import { CameraPicker, ImagePicker, DocumentPicker } from "@optisolbusiness/react-native-image-picker";

// ...

 <CameraPicker
   selectedTakePicture={handleSelectedTakePicture}
   alertMessage={'Maximum length exceeded'}
   mediaType={'video'}
 />

<ImagePicker
   selectedImage={selectedImage}
   alertMessage={'Maximum length exceeded'}
   maximumSelect={3}
   mediaType={'video'}
 />

<DocumentPicker
   supportedFormat={["pdf"]}
   maximumSelect={3}
   alertMessage={"Maximum length exceeded"}
   cancelMessage={"User Canceled"}
   selectedDocument={selectedDocument}
/>

CameraPicker Props

Prop	Type	Description
selectedTakePicture	Object	Mandatory. To get response object
alertMessage	string	Mandatory. To Show alert message
mediaType	String	Mandatory. 'photo' or 'video'
formatAsMp4	Boolean	Mandatory. Converts the selected video to MP4. iOS Only. when mediaType is 'video'

ImagePicker Props

Prop	Type	Description
selectedImage	Object	Mandatory. To get response object
alertMessage	String	Mandatory. To Show alert message
mediaType	String	Mandatory. 'photo' or 'video' or 'mixed'
formatAsMp4	Boolean	Mandatory. Converts the selected video to MP4. iOS Only. when mediaType is 'video'
maximumSelect	Number	Mandatory. allow any number of files

DocumentPicker Props

Prop	Type	Description
selectedDocument	Object	Mandatory. To get response object
alertMessage	String	Mandatory. To Show alert message
cancelMessage	String	Mandatory. Show cancel alert message
maximumSelect	Number	Mandatory. allow any number of files
supportedFormat	Object of Array	Mandatory. Type of Document

Contributing

See the contributing guide to learn how to contribute to the repository and the development workflow.

License

MIT

---

Made with create-react-native-library