React Native:uri图像未显示在Android上,但显示在iOS模拟器上

7rfyedvj  于 2023-08-07  发布在  React
关注(0)|答案(6)|浏览(125)

我正在开发一个react-native应用程序。我从一个API中获取一些图像,并将它们显示为平面列表。问题是这些图像在 *iOS * 模拟器上显示完美,但在 Android 模拟器上无法显示。我已经设置了图像的宽度和高度,但问题仍然是一样的。
下面是代码

组件

<Image
          style={styles.image}
          source={{
            uri: image,
          }}
          resizeMode="contain"
        />

字符串

样式

container__image: {
    width: '100%',
  },
  image: {
    width: '100%',
    height: 200,
    resizeMode: 'contain',
  },


uri前面的image是一个prop,包含图像的http地址。

yzckvree

yzckvree1#

我不依赖Android模拟器来处理来自URL的图像,特别是如果这些图像来自API。硬编码的URL,一般来说,工作正常。
然而,我注意到iOS模拟器在这方面给出了类似的结果,iPhoneAndroid的情况并非如此。在从API获取图像,将其存储在手机上的store逻辑/AsyncStorage中时,我注意到真实的的Android设备显示的图片比Android模拟器多。我花了很长时间才弄清楚为什么 * 图像不能在Android上工作,但在iOS上工作 *,有很多关于Stack Overflow的主题。显然,它们确实起作用了,但在真实的的设备上…是的,在调试过程中,我检查了httphttps。这些图像被提供超过https。我也有widthheight设置。
有点令人沮丧,但我很好奇是否有更多的人经历过这个问题。

6yjfywim

6yjfywim2#

我也遇到了同样的问题,但当我在模拟器中退出应用程序并重新打开它时,它就没事了,尽管我猜这不是最好的解决方案

qaxu7uf2

qaxu7uf23#

也许这似乎是一个问题,因为Android不允许http
请在更改Android设置后构建新的Android,如下所示。

  • android/app/src/main/AndroidManifest.xml
<application
        android:usesCleartextTraffic="true"> // you add this
...
</application>

字符串

5jvtdoz2

5jvtdoz24#

你能解决这个问题吗我也有同样的问题,我通过
1.接近Android模拟器
1.第一个月
1.在Android Studio设备管理器中擦除数据
运行react-native start --reset-cache && react-native run-android

6tdlim6h

6tdlim6h5#

尝试在uri中用引号(单引号或双引号)加上direct link。这可能在android中有效,而且你的大小调整模式也必须在样式中。

<Image
          style={styles.image}
          source={{
          uri: 'https://reactnative.dev/img/tiny_logo.png',
          }}
        />

字符串

t9aqgxwy

t9aqgxwy6#

可能是存储权限。
检查手机上的应用程序详细信息,并向应用程序给予存储权限

相关问题