CODEWITHSUNDEEP
javascriptreact-nativeecmascript-6expo
ProEvilz
ProEvilz

Reputation: 5455

Expo/React Native image paths from camera

I'm using the the Camera package in Expo and I'm able to take pictures successfully.

After taking a picture, I get an object back with data

Object {
  "height": 4096,
  "uri": "file:///var/mobile/Containers/Data/Application/7399B27C-F34B-4B2F-8F58-237D41136EE9/Library/Caches/ExponentExperienceData/asdasdasdefwefw/Camera/C3D87AB5-6B91-4A9E-83FC-DFSFEEWFEFSAFSD.jpg",
  "width": 2304,
},

Now in order to display this image, I want to use the <ImageBackground /> or <Image /> component. e.g. 

 <ImageBackground source={require( Object.uri )} />

Of cause, the problem with either of these two componenents is that require's value must be a static path and it cannot accept variables.

So how can I display the image without saving it to the photo library and using the image picker to open it from the library?

Upvotes: 2

Views: 1129

Answers (1)

Alok Mali
Alok Mali

Reputation: 2881

If you are using an absolute path of an image than you can do it like below - 

<ImageBackground source={{uri: Object.uri}} />

For an Image with inline-style - 

<Image style={{ height: 200, resizeMode: 'cover' }} source={{ uri: Object.uri }} />

Upvotes: 2

Related Questions