react-native 实现图片宽度一定，高度自适应

原文地址

网上找了好久，相关问题也很少，尝试了很多，才试出来解决Image宽度一定，高度自适应的问题的方法。

实现后，效果如下，（图片可以在小框体中，宽度充满，上下滑动）

微信图片_20181121141628.png

import {
    View,
    Text,
    StyleSheet,
    ScrollView,
    DeviceEventEmitter,
    Image,
} from 'react-native'

import FitImage from 'react-native-fit-image';    //要先安装包


const ImageList = [
    require('../../../assets/image/article/7.jpg'),
    require('../../../assets/image/article/8.jpg'),
    require('../../../assets/image/article/9.jpg'),
    require('../../../assets/image/article/10.jpg'),
    require('../../../assets/image/article/11.jpg'),
    require('../../../assets/image/article/12.jpg'),

]

//通过resolveAssetSource获取本地图片宽高，（getSize方法只能用于网络图片的宽高）
let source =  ImageList[tapid]
this.setState({
  imw: Image.resolveAssetSource(source).width,
  imh: Image.resolveAssetSource(source).height,
})


//再在相应FitImage里引用，originalWidth originalHeight为获取的图片真实宽高
//图片就会在ScrollView里，保持宽度一定，高度自动变化的显示了。
<ScrollView style={[commentStyle.containerVC]}>
   <FitImage
      source={ImageList[tapid]}
      resizeMode="contain"
      originalWidth={imw}
      originalHeight={imh}
   />
</ScrollView>

原文地址