rni

react-native-imagepicker

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

Showing:

Popularity

Downloads/wk

1

GitHub Stars

18

Maintenance

Last Commit

4yrs ago

Contributors

5

Package

Dependencies

0

License

MIT

Type Definitions

Tree-Shakeable

No?

Categories

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. Fixed in RN >= 0.48.

Rate & Review

Great Documentation0
Easy to Use0
Performant0
Highly Customizable0
Bleeding Edge0
Responsive Maintainers0
Poor Documentation0
Hard to Use0
Slow0
Buggy0
Abandoned0
Unwelcoming Community0
100
No reviews found
Be the first to rate

Alternatives

No alternatives found

Tutorials

No tutorials found
Add a tutorial