0

I'm using Image Picker to get the user photo and then I need to show it in the next screen. How can i achieve this?

Image Picker function:

const options={
    title: 'Profile picture',
    takePhotoButtonTitle: 'Take picture',
    chooseFromLibraryButtonTitle: 'Choose from gallery'
}

myFun=()=>{
    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 {
          const source = { uri: response.uri };

          // You can also display the image using data:
          // const source = { uri: 'data:image/jpeg;base64,' + response.data };

          this.setState({
            avatarSource: source,
          });
        }
      });
}

I need to pass the image to the next screen with this button:

<GradientButton text='Next' onPress={() => {this.props.navigation.navigate('NextScreen', {photo: this.state.avatarSource} )}}/>

This is how I was trying but I can't make it work, I only managed to pass normal values like Strings with navigate parameters.

Mateus99
  • 119
  • 1
  • 2
  • 9

1 Answers1

0
<GradientButton text='Next' onPress={() => {this.props.navigation.navigate('NextScreen' {photo: this.state.avatarSource} )}}/>

It looks like there is a syntax error, you have to put a comma after 'NextScree' so that it should be;

<GradientButton text='Next' onPress={() => {this.props.navigation.navigate('NextScreen', {photo: this.state.avatarSource} )}}/>

And in the next screen you can get this data by using props.navigation.getParam('photo').

Hope that helps.

Bora Sumer
  • 788
  • 6
  • 17
  • Actually that was my mistake, I might have accidentaly deleted the comma in the question here in Stack Overflow, but in my code there is the comma, I'll fix the comma in the question. By the way, are you sure this method works to pass image? Because I did exactly what you said and I can only pass "simple" variables like Strings. – Mateus99 Jan 04 '20 at 16:43
  • I just figured out i can use a console.log() in the NextScreen to print the info about the image and it works, the only problem is that I cannot show it in the screen using for example – Mateus99 Jan 04 '20 at 17:03
  • I need to see the code for image so I can tell what it wrong. I assume you may use wrong type of source object. Add your image render code in your question post please. – Bora Sumer Jan 04 '20 at 18:12