KeyboardAvoidingView doesn't move the view high enough while selecting some TextInput box towards the bottom of the screen

Viewed 2147

This is for iOS app created using react-native. I am using KeyboardAvoidingView in a form which contains a few TextInput fields. I have observed that the view is not moved high enough to accommodate the keyboard when a TextInput field towards the bottom of the screen is selected.

I created a snack that demonstrates this behavior (Link below). I have also observed that in some cases, the view is moved high enough on one iPhone but not the other. Initially, the problem was reported for iPhone 6S Plus in which users reported that the view is not moved high enough to accommodate the keyboard and in such cases, they are not able to see what they are typing the input box. When I was trying to create a snack to reproduce the problem, I found that I was able to reproduce that even on an iPhone 5s.

https://snack.expo.io/ry15dng2-

In the above snack, if you click on the TextInput box with value jug, you should see that the keyboard overlaps the input box and it is not clearly visible. I am sorry for the quality of the snack. I just tried to create a minimal example to reproduce the problem.

How can I fix this problem?

1 Answers
Related