首页 > 解决方案 > React Native Scroll View 不显示图像

问题描述

下面是我的反应原生应用程序代码的代码。但它没有显示图像。我将容器样式从滚动视图移动到图像以不正确的方式显示的图像。

<ScrollView vertical={true} style={styles.container} >
  <Image
    style={{ width: '100%', height: '100%' }}
    source={{ uri: this.props.navigation.state.params.PassedURL }}>
  </Image>
</ScrollView>

这里是容器样式

container: {
  flex: 1,
  backgroundColor: 'gray',
  padding: 10
},

屏幕上没有其他东西可以渲染

标签: androidreact-nativescrollview

解决方案


不要使用flex:1in ScrollView,如果不能解决它,请尝试按照其他人的建议设置特定的宽度和高度

<ScrollView vertical={true} style={styles.container} >
   <Image
     style={{ width: 200, height: 200 }}
     source={{ uri: this.props.navigation.state.params.PassedURL }}>
    />
</ScrollView>

容器样式

container: {
  backgroundColor: 'gray',
  padding: 10
},

编辑:

如果您希望它填充到全宽,只需将宽度设置为 100%,高度将相应调整,并可能根据您的需要放置 resizeMode="contain" 或 "cover"


推荐阅读