css - React Native 中出现在 Botton 的 TextInput

Question

我正在制作一个顶部带有徽标并带有后退按钮的表单，当我将 TextInput 放入其中时，它会出现在我的屏幕底部，如果我尝试在顶部设置它的样式，我的徽标会超出屏幕，即使任何更改在 TextInput 样式表中破坏了我所有的设计，我认为我的 flex 有一些问题，但我也在我的子视图中删除并添加了 flex 但无济于事。这是我制作徽标和显示文本的代码：

 <View style={styles.container}>
          <View style={{flex:1}}>
      <ImageBackground source={require('../assets/logo.png')}
      style={{ width: 200, height: 150,position: 'absolute', top: 20, left: -35, justifyContent: 'flex-start'}}
                resizeMode="contain">
        <View style={{position: 'absolute',left: 120,alignSelf:'center',marginTop:45}}> 
        <Text style = {styles.text} >UniQmove Training </Text> 
                </View>
     </ImageBackground>
     </View>
     <View style={{flex:3}}>
     <TouchableHighlight style={styles.inputContainer} onPress={() => this.backBtn()}>
     <ImageBackground source={require('../assets/back.png')}
      style={{ width: 40, height: 45,position: 'absolute',  justifyContent: 'flex-start'}}
                resizeMode="contain">

     </ImageBackground>
</TouchableHighlight>
</View>
               <View style={{margin:42}}>
                   <Text style = {{color:"#1589FF", fontSize:22,textAlign:"center",marginBottom:430}} >Create an Account </Text> 
               </View> 
               <KeyboardAvoidingView 
            keyboardVerticalOffset={100} behavior={"position"}>
                <View style={styles.inputx}>
          <Image style={styles.inputIcon} source={{uri: 'https://img.icons8.com/ultraviolet/40/000000/email.png'}}/>
          <TextInput style={styles.inputs}
              placeholder="Email"
              keyboardType="email-address"
              underlineColorAndroid='transparent'
              onChangeText={(email) => this.setState({email})}/>
        </View>
        </KeyboardAvoidingView>
      </View>

这是我的样式表：

const styles = StyleSheet.create({
    container: {
      flex: 1,
      justifyContent: 'center',
      backgroundColor: '#ffffff',
    },
    inputContainer: {
        width:350,
        height:45,
        right:160,
        top:-8,
        marginBottom:50,
        alignItems:'center'
    },
    text: {
      color:'#1589FF',
      fontSize: 24,
      fontWeight: 'bold',
      right:-8
     },
     inputx: {
        height:45,
        top:0,
        flexDirection: 'row',
        alignItems:'center'
    },
    inputs:{
      height:155,
      marginLeft:7,
      width:350,
    },
    inputIcon:{
      width:30,
      height:30,
      marginLeft:15,
      justifyContent: 'center'
    },
    back:{
      justifyContent: 'center',
     // marginBottom:320
    },
    buttonContainer: {
      height:45,
      flexDirection: 'row',
      justifyContent: 'center',
      alignItems: 'center',
      marginBottom:20,
      width:250,
      borderRadius:30,
      backgroundColor: "#1589FF",
    },
    loginText: {
      color: 'white',
    }
  });