Question

下面是我的代码

<View style={{ flex: 1, backgroundColor: "#f1f5f7", alignItems: "center" }}>
      <ScrollView>
        <ImageBackground
          source={{
            uri:
              "https://mosfeed.id/assets/collections/ads/small/photo_2021-03-10%2016.38.26.jpeg",
          }}
          style={{
            width: screenWidth,
            height: 190,
            alignItems: "center",
            justifyContent: "center",
            paddingHorizontal: 50,
          }}
        ></ImageBackground>
        <ItemData title="Upcoming Events" data={DATA1} />
        <ItemData title="Premium" data={DATA2} />
      </ScrollView>
      <MaterialSnackbar ref={snackbarRef} />
    </View>

问题是图像没有显示在 android 模拟器上，只能从我的服务器上显示。但是当我从其他服务器链接更改链接时，图像会显示。

是否有任何设置可以在我的服务器上显示图像。

谢谢

Answer 1

我是通过以下方式实现的：

import { ImageBackground } from 'react-native';

<ImageBackground style={ styles.imgBackground } 
                 resizeMode='cover' 
                 source={require('./Your/Path.png')}>

   //place your now nested component JSX code here

</ImageBackground>

然后是样式：

imgBackground: {
        width: '100%',
        height: '100%',
        flex: 1 
},

反应原生图像未显示在android模拟器上

1 个答案: