Question

我一直在使用React Native开发移动应用程序，并将其部署到Samsung Galaxy S6 Edge上，以通过Expo进行测试。到目前为止，一切正常，我正在使用的所有图像均已正确显示。

但是，当我尝试将其部署到其他设备上时，某些图像无法显示。在Huawei MediaPad上，标题图像（用<Image>标签包裹）无法显示；在三星Galaxy S8和OnePlus 6上，背景图像（用<ImageBackground>标签包裹）无法显示。

我尝试运行该应用程序的已编译APK文件，认为这些问题可能与通过Wi-Fi传输图像有关，但无济于事。不过，有趣的是，在我将其换成新图像之前，背景图像在所有设备上均显示良好（因为前身只是一个占位符）。这两个图像均为4K（3840 x 2160），唯一的区别是图像的存储大小。作为调试措施，我在Photoshop中以最强的压缩率压缩了新图像，但同样无济于事。

下面是我用来渲染两个图像的代码（当然不是完整的粘贴，但是我很乐意根据要求这样做）：

<ImageBackground
        source={require('./../../assets/images/bg_portrait_dots.png')}
        style={{width: '100%', height: '100%', position: 'absolute'}}
        >
            <View style={styles.parentView}>
                <View style={styles.elementSpacer}>
                    <Image
                        source={require('./../../assets/images/iview_learning_logo.png')}
                        style={styles.headerImage}
                    />
                </View>

下面是控制上面列出的元素的样式表参数：

parentView: {
    flex: 1,
    flexDirection: 'column',
    padding: 30,
    justifyContent: 'center',
},
headerImage: {
    width: null,
    resizeMode: 'contain',
    height: 120,
    position: 'relative',
},
elementSpacer: {
    flex: 1,
},

React Native图像不会在某些移动设备上显示

0 个答案: