Andr3wHur5t / react-native-keyboard-spacer

Plug and play react-native keyboard spacer view.
MIT License
1.56k stars 219 forks source link

Ios TextInput multiline Issue #68

Open ferminmoli opened 6 years ago

ferminmoli commented 6 years ago

Keyboard overlaps Text Input multine once you start typing.

hungdev commented 3 years ago

i get same issue

lkoehl commented 3 years ago

Dealing with the same problem. Are there any solutions yet?

hungdev commented 3 years ago

@lkoehl i still don't have solution for it, if you find out, please write it down here <3

lkoehl commented 3 years ago

This problem really gives me headaches, I have no solution yet but it might be a good idea to present my findings.

As we all know this problem appears when you use a TextInput component with multiline enabled and no fixed height. The keyboard spacer does create a view in the needed height, but somehow the TextInput completely ignores it and will continue growing even out of view. I also created my own quick and dirty keyboard-spacer to test it. From this test I am going to say that this problem isn't part of the the keyboard spacer instead it is a problem with TextInput.

My first idea was to restrain the height of the parent view, but that doesn't work. The TextInput grows in size until it is the size of the parent. It complete ignores all other sibling components and even pushes them out of frame. Awesome. Maybe it's a know bug?

So far the only solution insight is to restrain the size of the TextInput itself and animate its height. I don't really have a solution for it so far.

hungdev commented 3 years ago

@lkoehl I have an idea, to calculate the height of input you can use onLayout to get the height. We need to pass the height of input to keyboard spacer component. Sorry i can't fix it, because I don't have knowledge about animation :/

lkoehl commented 3 years ago

@hungdev Check out this component I created. It is very hacky and not very beautiful good. Give it a shot, so far it works for me. Will be adding a Demo and a README soon.

hungdev commented 3 years ago

@lkoehl nice!