rni
react-native-imagepicker
npm i react-native-imagepicker
rni

react-native-imagepicker

A React Native module which wraps ActionSheetIOS, CameraRoll and ImagePickerIOS to select a photo from the library or camera

by Aleksei Androsov

2.0.0 (see all)License:MITTypeScript:Not Found
npm i react-native-imagepicker
Readme

react-native-imagepicker

A React Native module which wraps ActionSheetIOS, CameraRoll and ImagePickerIOS to select a photo from the PhotoLibrary or CameraRoll. No external plugins needed.

Setup

  1. npm install --save react-native-imagepicker
  2. Setup CameraRoll

Usage

Basics

const imagePicker = require('react-native-imagepicker');
imagePicker.open({
    takePhoto: true,
    useLastPhoto: true,
    chooseFromLibrary: true
}).then(({ uri, width, height }) => {
    console.log('image asset', uri, width, height);
}, (error) => {
    // Typically, user cancel  
    console.log('error', error);
});

Each button (takePhoto, useLastPhoto, chooseFromLibrary) can be configure in following way

imagePicker.open({
    cancelTitle: 'Your custom title',
    takePhoto: {
        title: 'Your custom title',
        config: { /* Config object to ImagePickerIOS.openCameraDialog() */ }
    },
    useLastPhoto: {
        title: 'Your custom title',
        config: { /* Config object to CameraRoll.getPhotos() */ }
    },
    chooseFromLibrary: {
        title: 'Your custom title',
        config: { /* Config object to ImagePickerIOS.openSelectDialog() */ }
    },
    ...
})

Also you can disable some of buttons

const imagePicker = require('react-native-imagepicker');

imagePicker.open({
    takePhoto: 'Custom title',  // Shorthand for custom title
    useLastPhoto: false, // disable this button
    chooseFromLibrary: true // get default values
})

uri usage

uri can be directly passed to <Image/> or FormData

...
render() {
    <Image source={{ uri: uri, isStatic: true }}/>
} 
...
const fd = new FormData();
fd.append('photo', {
    uri: uri,
    type: 'image/jpeg',
    name: 'photo.jpg'
});

Known bugs

  1. ImagePickerIOS take photo with wrong orientation #12249. You can replace RCTImagePickerManager.m with version from PR.

Downloads/wk

13

GitHub Stars

18

LAST COMMIT

5yrs ago

MAINTAINERS

1

CONTRIBUTORS

5

OPEN ISSUES

4

OPEN PRs

0
VersionTagPublished
2.0.0
latest
5yrs ago
No alternatives found
No tutorials found
Add a tutorial
No dependencies found

Rate & Review

100
No reviews found
Be the first to rate