CODEWITHSUNDEEP
react-nativekeyboardscrollview
Kasra
Kasra

Reputation: 63

KeyboardAvoidingView shifts the first 4 TextInput off the screen

I am using KeyboardAvoidingView with ScrollView and TextInput. When the first few TextInput get focused, the keyboard appears and shifts the TextInput too high out of the screen.

I have tried putting the KeyboardAvoidingView as parent tag and ScrollView as child and vice versa. I've also played with props for KeyboardAvoidingView (keyboardVerticalOffset, behavior, etc). However, non of them worked. I have also tested react-native-keyboard-aware-scrollview package and did not work at all.

<KeyboardAvoidingView behavior={'position'}>
        <ScrollView>
          <TextInput/>
          <TextInput/>
          <TextInput/>
          ...
        </ScrollView>
</KeyboardAvoidingView>

Expected behavior: When the input is located at the area, close to top, the keyboard must not shifts the screen up. (The distance between keyboard and the focused input must not be big)

Upvotes: 0

Views: 1117

Answers (1)

SRS
SRS

Reputation: 51

You can change the props behavior={'position'} to behavior={'padding'}. In my case it solves the problem.

Upvotes: 1

Related Questions