Question

我使用下面的代码行在我的应用程序中以完整窗口显示图像

<View style={{flex: 1, alignItems: 'center', justifyContent: 'center'}}>
  <Image source={avatarSource}
    style={{width, height}}
    resizeMode={Image.resizeMode.contain} />
</View>

avatarSource是base64编码的图像字符串。当应用程序启动时，仅下载所有图像的缩略图，如果用户点击头像，则显示与Whatsapp类似的完整图像。如果不存在完整图像，则最初将缩略图加载到整个屏幕上，并从服务器下载完整图像，然后在下载完整图像后，avatarSource将更新，因此，完整图像图像显示在视图中。这个东西在iOS上无缝运行，但在Android上，一旦下载完整的图像，Image组件会自动更新，但不会渲染任何东西，我只看到一个白色的屏幕。如果我从resizeMode删除了Image，则Image组件会正确更新，但我认为默认resizeMode为cover，因为图像被剪裁。

如果您遇到此问题或/并考虑到某些解决方案，请分享。提前谢谢！

Answer 1

使用resizeMode：“contains”作为样式的一部分，所以： style = {{width，height，resizeMode：“contains”}}

React-Native Image resizeMode包含在Android

1 个答案: