KeyboardAvoidingView not working with "padding" or "height

I am wrapping a View which contains a TextInput and Text component. My goal is for the height of the view to change when the keyboard is visible.

For my app I need the Header, TabBars, and the sending component to be transparent and absolute which they are which means the text input pulls underneathe them without the marginTop or setting the position of the text input to absolute as well.

I've tried conditionally changing the height of the view based on the keyboard being visible but the movemnt is not smoothe. I'd like to use KeyboardAvoidingView but the only behavior that does anything is position and I dont want to push it up.

As you can see from the photos theie is no adjustment no matter what I do.

Any help would be greatly appreciated!

EDITED Below is the solution that worked for me

 <View style={tw.style(`h-full bg-white`, {})}>
  <StatusBar barStyle={"light-content"} />
   <KeyboardAvoidingView behavior="padding" keyboardVerticalOffset={-160}>
    <View
      style={tw.style(`w-full bg-white`, {
        marginTop: 177,
        marginBottom: 225,
      })}
    >
      <TextInput
        style={tw.style(`h-full w-full text-black text-base p-4 bg-white`, {
          textAlignVertical: "top",
        })}
        defaultValue={defaultMessage}
        onChangeText={(messageText) => setMessageText(messageText)}
        maxLength={500 + defaultMessage.length}
        keyboardType="default"
        multiline={true}
      />
      <View style={tw.style(`w-full h-8 items-end pr-4 py-2`, {})}>
        <Text>{charRemain} characters remaining</Text>
      </View>
    </View>
  </KeyboardAvoidingView>
</View>

Solution

Try to add keyboardVerticalOffset

<KeyboardAvoidingView style={tw.style(`h-full flex flex-col bg-white`, {})} behavior="height" keyboardVerticalOffset={200}>

Please do some hit and trial with some positive and negative offset values.