React-native-image-picker: How to downsize (in terms of mb) the picked image ?

Created on 17 Apr 2020  路  3Comments  路  Source: react-native-image-picker/react-native-image-picker

Question

How to reduce the size of selected image before uploading to firebase?

Code

pickImage = () => {
    var options = {
      title: 'Select Image',
      storageOptions: {
        mediaType : 'photo',
        quality: 1,
        maxWidth: 500,
        maxHeight: 500,
        allowsEditing: true,
        skipBackup: true,
        path: 'images',
        cameraRoll: true,
        waitUntilSaved: true
      },
    };
    ImagePicker.launchImageLibrary(options, 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 {
        // You can also display the image using data:
        // let source = { uri: 'data:image/jpeg;base64,' + response.data };
        //const resizeResponse = {response: response.fileSize, response: response.uri}
        this.setState({ 
          image: response.uri,
          imageLocalPath: response.uri
        });
      }
    });
  };

Environment

Target Platform: iOS, Android
Development Operating System: macOS Catalina 10.15.3
Build tools (Xcode or Android Studio version, iOS or Android SDK version, if relevant): Xcode, iOS 13.2.2

React Native version (e.g. 0.45.1): 0.61.3
react-native-image-picker: "^1.1.0"

Most helpful comment

Put inside option variable info about maxWidth, maxHeight and quality.
BTW, it's not an issue.

For example:
```
const options = {
quality: 1.0 // range is 0.1 - 1.0
maxWidth: 800,
maxHeight: 800
}

All 3 comments

Put inside option variable info about maxWidth, maxHeight and quality.
BTW, it's not an issue.

For example:
```
const options = {
quality: 1.0 // range is 0.1 - 1.0
maxWidth: 800,
maxHeight: 800
}

Put inside option variable info about maxWidth, maxHeight and quality.
BTW, it's not an issue.

For example:

const options = {
  quality: 1.0  // range is 0.1 - 1.0
  maxWidth: 800,
  maxHeight: 800
}

Thank you for your solution. Indeed, i see now is not an issue. :)

In my case it does not do anything, i tried using it the same way but didn't reduced the size, can you tell me how does it work in ios.

Was this page helpful?
0 / 5 - 0 ratings