react-native-cam-gallery

React Native Cam Gallery. A React Native module that allows you to select photos & videos from the device library & camera.

Installation

yarn add react-native-cam-gallery

cd ios && pod install && cd ..

**Please install this libraries**

react-native-permissions is added to access camera and storage permission in Android & IOS devices

yarn add react-native-permissions

react-native-camera-kit is a camera library for React Native apps.

yarn add react-native-camera-kit

@react-native-community/cameraroll is used to access media files from device library

yarn add @react-native-community/cameraroll

fbjs is used to access few Facebook's APIs

yarn add fbjs

Permissions

Android:

Need to add this permissions in AndroidManifest.xml

<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" />

<uses-permission android:name="android.permission.RECORD_AUDIO"/>

IOS:

Add permissions with usage descriptions to your app Info.plist:

<key>NSCameraUsageDescription</key>

<string>Allow access to capture photo</string>

<key>NSMicrophoneUsageDescription</key>

<string>Allow access to capture video</string>

<key>NSPhotoLibraryUsageDescription</key>

<string>Allow access to select photo</string>

Android: Add Kotlin to your project

Modify settings.gradle

Add the following lines in android/app/build.gradle:

include ':@react-native-community_cameraroll'
project(':@react-native-community_cameraroll').projectDir = new File(rootProject.projectDir, '../node_modules/@react-native-community/cameraroll/android')
include ':react-native-permissions'
project(':react-native-permissions').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-permissions/android')

Add these to PodFile

pod 'Permission-Camera', :path =>  "../node_modules/react-native-permissions/ios/Camera"

pod 'Permission-PhotoLibrary', :path =>  "../node_modules/react-native-permissions/ios/PhotoLibrary"

Components

**Component Usage**

import { RNCamGallery } from 'react-native-cam-gallery';

<RNCamGallery

  onSubmit={(data) => {}}

  onPermissionRejection={() => {}}

  onPermissionBlocked={() => {}}

/>

Props

| props | type | returns | | --------------------- | ------------------------- | -------------------------------------------------------------------------------------- | | onSubmit | handler function callback | returns selected and captured images list | | onPermissionRejection | handler function callback | called when user rejects camera and storage permission | | onPermissionBlocked | handler function callback | called when camera and storage permission is blocked |

Repository

Checkout our GitHub repository and contribute React-native-cam-gallery

Contributing

• Pull Requests are welcome, if you open a pull request we will do our best to get to it in a timely manner
• Pull Request Reviews are even more welcome! we need help testing, reviewing, and updating open PRs
• If you are interested in contributing more actively, please contact us.

Contributors

Sourav Das Amartya Chakraborty Suman Kamilya Soumen Samanta