Continuing discussions from react-native-keyboard-spacer#71

[dextermb]

You can test using virtual devices by using Xcode or android studio. Xcode requires a mac, whereas android studio can be used anywhere.

I have tested your updated demo, I seem to be still having issues. See the attached screenshot.

This is a Pixel 2 XL with UI scale set to max. As you can see the input is focused, but the keyboard overlaps it.

---

Reference

[hieunc229]

Thanks, @dextermb. I dig a little bit into the problem, seem like it related to facebook/react-native#15387.

In short, when keyboardWillShow event is triggered, the library calculate and animate the position of the<Spacer>...</Spacer>. Unfortunately, keyboardWillShow is not available on Android.

One solution could be using keyboardDidShow for Android instead (see Method > addListener > Note...). I will spend a little more time to see is there any better solution for this

[dextermb]

@hieunc229 What react-native-keyboard-spacer does is check if the Platform is ios or android, then switch between event names.

As seen here:

const updateListener = Platform.OS === 'android' ? 'keyboardDidShow' : 'keyboardWillShow';
const resetListener = Platform.OS === 'android' ? 'keyboardDidHide' : 'keyboardWillHide';

[hieunc229]

I have updated the repo and managed to test it on a Nexus 5. Preview on Expo Snack

Hope it help!

[hieunc229]

Since the problem is solved, I'll close this issue. Feel free to reopen when necessary!