How to give option to select image only from gallery in react-native-image-picker?

Question

The below code give popup showing camera or choose from gallery. I do not want camera option in this. I want to launch gallery when this function is called. Is there any way to do that?

import ImagePicker from 'react-native-image-picker';

function selectImageFromGallery() {
const options = {
  title: 'Select Avatar',
  storageOptions: {
    skipBackup: true,
    path: 'images',
  },
};
 
ImagePicker.showImagePicker(options, (response) => {
  console.log('Response = ', response);
 
  if (response.didCancel) {
    console.log('User cancelled image picker');
  } else if (response.error) {
    console.log('ImagePicker Error: ', response.error);
  } else if (response.customButton) {
    console.log('User tapped custom button: ', response.customButton);
  } else {
    const source = { uri: response.uri };
  }
});}

2k views, not a single correct answer... incredible – fullStackChris Oct 05 '21 at 05:31 — fullStackChris, Oct 05 '21 at 05:31

score 1 · Answer 1 · answered Nov 25 '20 at 09:37

Use launchImageLibrary instead of showImagePicker. It will directly ask gallery option

ImagePicker.launchImageLibrary(options, (response) => {
  console.log('Response = ', response);
 
  if (response.didCancel) {
    console.log('User cancelled image picker');
  } else if (response.error) {
    console.log('ImagePicker Error: ', response.error);
  } else if (response.customButton) {
    console.log('User tapped custom button: ', response.customButton);
  } else {
    const source = { uri: response.uri };
  }
});

score 1 · Answer 2 · edited Feb 03 '21 at 20:38

1

These are the two lines you need to change in Migrating from 2.x.x to 3.x.x:

// before, 2.x.x
import ImagePicker from 'react-native-image-picker';
ImagePicker.showImagePicker(options , response => {
    ...
});

// after, 3.x.x
import {launchCamera, launchImageLibrary} from 'react-native-image-picker';
launchImageLibrary(options , response => {
    ...
});

edited Feb 03 '21 at 20:38

myeongkil kim

2,465
4
16
22

answered Feb 02 '21 at 21:24

rob_abcba

76
2

score 0 · Answer 3 · answered Nov 25 '20 at 07:43

for get image from gallery use this code :

  var options = {
            title: 'Select Image',
            allowsEditing: false,
            quality:0.9,
            noData: true,
            maxWidth:1200,
            maxHeight:1200,
            mediaType: "photo",
            customButtons: [
              { name: 'customOptionKey', title: 'Choose Photo from Custom Option' },
            ],
            storageOptions: {
                skipBackup: true,
                cameraRoll: false
            },
          };

          ImagePicker2.launchImageLibrary(options, response => {
            console.log('Response = ', response);
      
            if (response.didCancel) {
              console.log('User cancelled image picker');
            } else if (response.error) {
              console.log('ImagePicker Error: ', response.error);
            } else if (response.customButton) {
              console.log('User tapped custom button: ', response.customButton);
              alert(response.customButton);
            } else {
              let source = response;
              // You can also display the image using data:
              // let source = { uri: 'data:image/jpeg;base64,' + response.data };
              this._sendpic(response.uri);
            }
          });

and get image from Camera use this code:


        var options = {
            title: 'Select Image',
            allowsEditing: false,
            quality:0.9,
            noData: true,
            maxWidth:1200,
            maxHeight:1200,
            mediaType: "photo",
            customButtons: [
              { name: 'customOptionKey', title: 'Choose Photo from Custom Option' },
            ],
            storageOptions: {
                skipBackup: true,
                cameraRoll: false
            },
          };

          ImagePicker2.launchCamera(options, response => {
            console.log('Response = ', response);
      
            if (response.didCancel) {
              console.log('User cancelled image picker');
            } else if (response.error) {
              console.log('ImagePicker Error: ', response.error);
            } else if (response.customButton) {
              console.log('User tapped custom button: ', response.customButton);
              alert(response.customButton);
            } else {
              let source = response;
              // You can also display the image using data:
              // let source = { uri: 'data:image/jpeg;base64,' + response.data };
              this._sendpic(response.uri);
            }
          });

for more info see this link: link

How to give option to select image only from gallery in react-native-image-picker?

3 Answers3