React-native: KeyboardAvoidingView stop working if the keyboard type changes (iOS)

[iKrushYou]

I'm implementing the KeyboardAvoidingView inside of a modal that takes in user input as a string and also a currency value. This requires different keyboard types. It seems that when switching between the normal keyboard and the numeric keyboard, the view (and I'm using height to make sure the view is centered) stops adjusting the container based on the keyboard.

info 
  React Native Environment Info:
    System:
      OS: macOS 10.15
      CPU: (8) x64 Intel(R) Core(TM) i7-7920HQ CPU @ 3.10GHz
      Memory: 734.70 MB / 16.00 GB
      Shell: 3.2.57 - /bin/bash
    Binaries:
      Node: 12.5.0 - /usr/local/bin/node
      Yarn: 1.16.0 - /usr/local/bin/yarn
      npm: 6.9.0 - /usr/local/bin/npm
      Watchman: 4.9.0 - /usr/local/bin/watchman
    SDKs:
      iOS SDK:
        Platforms: iOS 12.2, macOS 10.14, tvOS 12.2, watchOS 5.2
    IDEs:
      Xcode: 10.2.1/10E1001 - /usr/bin/xcodebuild
    npmPackages:
      react: 16.8.3 => 16.8.3 
      react-native: https://github.com/expo/react-native/archive/sdk-34.0.0.tar.gz => 0.59.8 
    npmGlobalPackages:
      react-native-cli: 2.0.1
      react-native-git-upgrade: 0.2.7

https://snack.expo.io/SyqoJRYrB

The strange thing is: it works sometimes when on my actual device because I use Gboard but the numberpad comes from the apple keyboard. So it has to switch entirely. But the whole thing flashes and glitches out (not a very elegant animation)

[KA-32]

Confirm the same in RN 0.60.5

[samiacto]

I'm experiencing this too in RN 0.61.2 when switching between default keyboard and emoji keyboard on iOS

[ArthurBugan]

Any fix to this problem?, I got this problem on android 10 and expo sdk 35

[ramisalem]

Any fix to this problem?

[bockc]

Still happening in RN 0.61.5, when switching from default keyboard to emoji keyboard. I really would like a fix for this, it's been more than 6 months this has been reported :(

[iKrushYou]

This is not a solution to the actual bug here...however I have had success in using Native Base's Content component

Unfortunately, you need to add an entire UI library, but it does handle the keyboard switching issue (and actually adds a lot more functionality like dismissing the keyboard if you scroll down)

[ArthurBugan]

@iKrushYou Did you just replace ScrollView with Container and Content, or did something special? I'm going to try later, thanks for the tip!

[iKrushYou]

@ArthurBugan so all I've been doing is solely replacing any instances of ScrollView with Content

Actually, for that matter, I've been replacing all usages of SafeAreaView with Content as well because it just works better.

But, again, native-base is a pretty big library to add to your project if you're not already using it but the Content component just works so well in my experience.

[ArthurBugan]

It worked, thanks! @iKrushYou

[stale[bot]]

Hey there, it looks like there has been no activity on this issue recently. Has the issue been fixed, or does it still require the community's attention? This issue may be closed if no further activity occurs. You may also label this issue as a "Discussion" or add it to the "Backlog" and I will leave it open. Thank you for your contributions.

[stale[bot]]

Closing this issue after a prolonged period of inactivity. If this issue is still present in the latest release, please feel free to create a new issue with up-to-date information.

[lordofflakes]

I was able to fix this issue using react-native-keyboard-aware-scrollview module instead of using the whole NativeBase library.

[ebaynaud]

Seems to be better with behaviour set to padding instead of height