Set an image width to the screen width and the height of the original image height (LIKE INSTAGRAM) in react-native

user_16020564 0
Viewed 326

I want to implement like instagram to show the images/video on full width of the device and the original image height. How can I do that ?

react-native
1 Answers

Simply put the image with width as device width and height as device height. Then specify the resizeMode property to contain. This will make the whole image fit the screen.

<Image style={styles.image} source={{ uri: img_url }} />;

image style,

const {width, height} = Dimensions.get('window');

image: {
  width,
  height,
  resizeMode: 'contain'
},

Or check this Live Snack Example

user_73375060
Related