Display an image stored on phone

Question

I have succesfully been able to take a photo inside my app and store it on the phone, but how do I display it?

I tried this static approach but it does not work (Yes the image is there :) )

 <Image width={40} height={40} source={{uri: '/storage/emulated/0/DCIM/IMG_20161201_125218.jpg'}} />

Answer 1

Even I faced this issues and got it resolved. You have to prepend the the file path with file:// (mind the double /).

<Image source={{uri:'file:///storage/emulated/0/DCIM/IMG_20161201_125218.jpg'}}
    style={myImageStyle}/>

Here's a reference!

I hope this helps :)

Answer 2

    <Image source = {{uri: "file:///storage/emulated/0/appiwell/image/qkpOyUaRla.jpg", 
                    width: responsiveWidth(100), 
                    height: responsiveHeight(100)}}/>

Notice, should set width, height inside {uri, width, height}. Width, height in style maybe didn't work.

responsiveWidth, responsiveHeight here https://www.npmjs.com/package/react-native-responsive-dimensions