React Native resizeMode:'contain' not working with expo?

Question

I am working the resizeMode:'contain' because the image is stretching. but the resizeMode not working with expo app.

image: {
    width: 80,
    height: 80,
    borderRadius: 10,
    resizeMode:'contain',
  },


<TouchableOpacity onPress={() => onPress({ product })}>
   <Image
     source={{ uri: getProductImage(product.images[0].src, 100) }}
     style={styles.image}
   />
</TouchableOpacity>[enter image description here][1]

screenshot

Does this answer your question? [Image 'contain' resizeMode not working in react native](https://stackoverflow.com/questions/36436913/image-contain-resizemode-not-working-in-react-native) — SDushan, Apr 07 '20 at 14:24

B. Mohammad · Answer 1 · 2020-04-07T13:57:40.327

2

try to put resizeMode='contain' inside Image component:

<Image
     resizeMode='contain'
     source={{ uri: getProductImage(product.images[0].src, 100) }}
     style={styles.image}
   />

check also this method using flex and `height:undefined': example

edited Apr 07 '20 at 13:57

answered Apr 07 '20 at 13:43

B. Mohammad

2,152
1
13
28

I used the resizeMode={'contain'} like this but still not working. – Mohit Sharma Apr 07 '20 at 13:44
use it like this resizeMode='contain' – B. Mohammad Apr 07 '20 at 13:46
Still not working is there another way to use this. before that was working but after the update node_module the property not working. – Mohit Sharma Apr 07 '20 at 13:50
check the example for flex method – B. Mohammad Apr 07 '20 at 13:58
this is fine but I am getting an issue in height of the images. the images are coming from API. – Mohit Sharma Apr 07 '20 at 14:20
if images dont have same proportions the result wont be the same even with same height – B. Mohammad Apr 07 '20 at 14:24

React Native resizeMode:'contain' not working with expo?

1 Answers1