react native android背景图像不适合屏幕

Question

我是 React Native 的第一人，我正在尝试将图像作为背景。 但我无法适应我的安卓设备的全屏。我尝试了几个 android 设备，但不适用于所有设备。 这是我的代码。

import * as React from "react";
import { ImageBackground, StyleSheet, Text, View, Image, TouchableOpacity } from "react-native";

const styles = StyleSheet.create({
    container: {
        flex: 1,
    },
    image: {
        flex: 1,
        resizeMode: "cover",
    },
});

class MainMenuScreen extends React.Component {
  render() {
    return (
        <View style={styles.container}>
            <ImageBackground source={require('../assets/img/main_menu/background.png')} style={styles.image}>
            </ImageBackground>
        </View>
    );
  }
}

export default MainMenuScreen;

我还检查了 stackoverflow 中的所有文章。

Full screen background image in React Native app,

What's the best way to add a full screen background image in React Native

这些都是我尝试过的。

我将分享我现在拥有的图像。

The screen of Android

The real image

请帮助我。 谢谢

Answer 1

这样使用

render(){
    return(
        <View style={{ flex: 1 }}>
           <Image style={{ width: screenWidth, height: screenHeight, position: 'absolute', top: 0, left: 0 }}/>
           ......
        </View>
    )
}