图像resizeMode ='包含'在React Native中不起作用

Question

这是最简单的代码:

export default class App extends React.Component {
  render() {
    return (
      <View style={styles.container}>
        <Image resizeMode={'contain'} source={imageSource}/>
      </View>
    )
  }
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: '#fff',
    alignItems: 'center',
    justifyContent: 'center',
  },
})

如果resizeMode设置在'center'上,它的工作方式几乎与预期一致,但在'contains'时,图像不会调整大小.图像真的很大,但它没有调整大小......我哪里错了？:)

Answer 1

您的图像没有高度和重量的上下文.你需要指定它.

这应该可以解决您的问题:

 <Image
style={{ width: "100%", height: "100%" }}
resizeMode={"contain"}
source={imageSource}
/>;