wix-incubator / react-native-keyboard-input

Use your own custom input component instead of the system keyboard
MIT License
819 stars 150 forks source link

iOS: Cannot expand the keyboard-input from current component #3

Closed thorbenandresen closed 7 years ago

thorbenandresen commented 7 years ago

Repro

  1. Open demoApp on iOS
  2. Click on 'show1'
  3. Keyboard will expand
  4. Dismiss keyboard input
  5. Click on 'show1'

Expected:

Actual:

Notes:

I have been working around this by resetting the this.state.customKeyboard to an empty object whenever the keyboard is hidden: https://gist.github.com/Thorbenandresen/ff416493dfed8c2860fdeb6c01fcc91b (see componentDidUpdate)

In order to prevent the keyboard from popping up, I have commented out TextInputKeyboardManagerIOS.removeInputComponent(inputRef); from CustomKeyboardView.js

However I am not sure yet if this is the way to go or if this introduced un-intended consequences.

artald commented 7 years ago

Thanks for reporting about it. It's actually a known issue and now fixed.

The problem is that there are system events that may cause the keyboard to be dismissed, for example: showing a modal screen and even dismissing the keyboard interactively. This causes the state of the JS component that manages the current keyboard to go out of sync.

To handle these cases, there is a callback prop that was not used in the demo - onKeyboardResigned. It will get called when the keyboard was dismissed for some reason so you can sync your state and clear the keyboard component, see here: https://github.com/wix/react-native-keyboard-input/blob/master/demo/demoApp.js#L125.

The missing part was indeed preventing the keyboard from showing up again when the keyboard is reset. I solved it on the native side so there's no need to comment stuff in the JS. The issues was that the native code was restoring the focus to the original input anyway when the keyboard component was being reset, now it's doing it only when necessary.

The fix is available in version 3.0.3.