在调整React Native之后获取实际图像大小

Question

我从尺寸未知的API中提取图片。

我希望能够在调整大小过程后知道图像的实际大小。

            <Image 
            style={{ resizeMode: Image.resizeMode.contain}}
            source={{uri:'https://blabla.com/img.jpg'}} 
            />

Image.resizeMode.contain 是统一缩放图像，以便图像的尺寸（宽度和高度）等于或小于视图的相应尺寸。

Answer 1

您可以使用onLayout

    <Image 
        style={{ resizeMode: Image.resizeMode.contain}}
        source={{uri:'https://blabla.com/img.jpg'}} 
        onLayout={(evt) => {
            const {width, height} = evt.nativeEvent.layout
            console.log('img actual width: '+width)
            console.log('img actual height: '+height)
        }} />