使视图的高度根据图像动态

Question

我想让视图的高度根据图片的高度而变化，就像在Twitter和LinkedIn中一样，即如果有风景图片，那么与肖像图片相比，高度是不同的，到目前为止，我尝试过这样做，但我在图像上方和下方都有很多空白，这看起来不太好，我不想通过调整大小来拉伸或覆盖来影响图像的分辨率

我现在的代码是`

<TouchableOpacity onPress={() => handleImagePress(0)} style={{width:device_width,height:device_height
}}>
<NativeImage source={{uri:SingleImage.uri}}   resizeMode="contain" style={{ width:"100%",overflow:"hidden" ,height :"100%" ,resizeMode:"contain"}}  />  
</TouchableOpacity>

`

黑色箭头为空白在这里，我将设备高度设置为设备高度，因为它远小于图像高度，如果我设置了图像高度，则空白区域的大小会增加

Answer 1

我创建了一个小吃，您可以在其中获取具有随机高度的图像&宽度和调整高度&根据图像属性显示在屏幕上的同一图像的宽度。在这里看看，它应该能帮你完成任务https://snack.expo.dev/c0uDwh1DD

Answer 2

您可以使用以下代码获取图像大小，并将其应用于您的视图和图像，如果与屏幕相比，图像大小非常大，则根据您的要求缩小。

Image.getSize(Imagepath,
(width, height) => {
console.log(width,height)
}
);

您需要使用useState将这些值保存在变量中。