React-native: KeyboardAvoidingView with keyboardDismissMode interactive does not resize as keyboards hides.

[grundmanise]

Description

When using keyboardDismissMode="interactive" on ScrollView KeyboardAvoidingView does not resize as keyboards hides.

Here's a gif to demonstrate what behavior I'm referring to:

_gif taken from https://github.com/Andr3wHur5t/react-native-keyboard-spacer/issues/48 , but KeyboardAvoidingView has the same issue._

Reproduction

https://sketch.expo.io/B1JIYaynx

Solution

Track keyboard height when panning of the keyboard starts?

Additional Information

• React Native version: 0.42
• Platform: iOS

[RyanMitchellWilson]

I'm seeing this problem as well.

[hramos]

Hi there! This issue is being closed because it has been inactive for a while. Maybe the issue has been fixed in a recent release, or perhaps it is not affecting a lot of people. Either way, we're automatically closing issues after a period of inactivity. Please do not take it personally!

If you think this issue should definitely remain open, please let us know. The following information is helpful when it comes to determining if the issue should be re-opened:

• Does the issue still reproduce on the latest release candidate? Post a comment with the version you tested.
• If so, is there any information missing from the bug report? Post a comment with all the information required by the issue template.
• Is there a pull request that addresses this issue? Post a comment with the PR number so we can follow up.

If you would like to work on a patch to fix the issue, contributions are very welcome! Read through the contribution guide, and feel free to hop into #react-native if you need help planning your contribution.

[pozdena]

I'm having this issue as well. Maybe most people won't care about this, which led to it being auto-closed, but it's crucial to the small number of people who run into this and are using React Native to create complex, high quality apps. I don't have time to contribute right now but I will be forced to fix this eventually if no one else gets around to it. :)

[RyanMitchellWilson]

Can this be reopened, I would really like to have this in my app

[mferranti]

i have this issue too.

[artsx]

Hello, someone found a solution?

[404sand808s]

Also having this issue.

[martinezguillaume]

Need this ! 🙂 It would be so nice !

[RyanMitchellWilson]

@hramos this has been sitting around for 7 months with no reply from the react-native team. Is there a way we could get this prioritized?

[ericlewis]

Any word from the team on this?

[zsaraf]

@facebook-github-bot anything?

[furkancelik]

is solved?

[chrisbull]

Would be great to have a fix for this, or a solution to make it work. Thanks!

[franzwarning]

Any update on this?

[herarya]

+1 , any solution guys ?

[freeall]

@hramos I saw that you closed and re-opened this. Wanted to let you know that this issue still exists in the new versions of react-native. I can't find a way to make KeyboardAvoidingView and ScrollView with keyboardDismissMode='interactive' work together.

[hramos]

Can you specify the version you last tried this on? ("Latest" by itself is not sufficient, due to the monthly release train, release candidates, master).

[mahyarr]

Im using 0.55.2 and I have this problem

[pribeh]

The same is happening with flatlist as well. 0.55.2

[borbit]

I am using 0.56.0 - the problem still exists

[ultramiraculous]

For the specific issue in the original post, is there a reason InputAccessoryView wouldn't be used? It seems like the correct solution for a keyboard toolbar/input bar.

[pribeh]

@ultramiraculous that's what I was looking for.

[hramos]

Closed as InputAccessoryView is what is preferred in this case.

[VinceBT]

Sorry but this is far from closed, the deep problem comes from the fact that the KeyboardAvoidingView does not follow the keyboard movement when dragged interactively with keyboardDismissMode="interactive", as you can see in the first GIF, the ScrollView is half of its size until the touch is released, this has nothing to do with toolbars or InputAccessoryView

[tgensol]

Still having this issue too

[scottmas]

Also, InputAccessoryView has extremely spotty documentation. I'm not a novice programmer and I don't understand at all how this component is supposed to work. My initial efforts ended up with a whole lot of nothing.

[hramos]

The docs for InputAccessoryView link to a working example: https://github.com/facebook/react-native/blob/master/RNTester/js/InputAccessoryViewExample.js. It might also be useful to understand the underlying iOS class: https://developer.apple.com/documentation/uikit/uiresponder/1621119-inputaccessoryview