React Native Paper text input: Why is my textInput so tall?

Question

Im trying to add a textinput to my react native app using react-native-paper, but it keeps rendering as a very tall box instead of horizontal. What am I doing wrong?

screenshot of rendered textbox

    import { StyleSheet, Text, View } from "react-native";
    import { TextInput } from "react-native-paper";
    import { useState } from "react";
    
    export default function SignUp() {
    return (
        <View style={styles.container}>
          <Text>SIGN UP! NOW~~!!</Text>
          <TextInput mode="outlined" style={styles.inp} />
        </View>
      );
    }
    
    const styles = StyleSheet.create({
      container: {
        flex: 1,
        alignItems: "center",
        justifyContent: "center",
      },
      inp: {
        height: 1,
      },
    });

Answer 1

I think this is some type of bug exclusive to android, because on both web and ios it doesnt occur. A workaround would be to include a width along with your height, or to wrap the TextInput in a View (this caused weird spacing behavior) so I would just define a width:

 const styles = StyleSheet.create({  
      inp: {
        height: 1,
        width:'100%'
      },
    });

Answer 2

I already have the same problem. This is because you have this TextInput inside a View with alignItems:"center" prop. The solution is put this TextInput inside a View tag like this:

 <View style={styles.container}>
          <Text>SIGN UP! NOW~~!!</Text>
          <View>
              <TextInput mode="outlined" style={styles.inp} />
          </View>
 </View>