Keyboard.addListener('keyboardDidShow', ...) callback is invoked with inaccurate measures in Android devices with notch

Incriminated API

// In Android
Keyboard.addListener('keyboardDidShow', e => {
   // On OnePlus 7, and Pixel 3XL (simulator) this value is underestimated by exactly StatusBar.currentHeight.
    e.endCoordinates.height
})

Prerequisites

In AndroidManifest.xml, set android:windowSoftInputMode="adjustPan".

Visual tests

The black horizontal bar should be the same width (40dp) as the red bar, in a container with a bottom padding of the keyboard’s height. This component mimics KeyboardAvoidingView with behavior padding set. The height of keyboard should be the same as the height of the red bar. The issue has been reproduced with GBoard, SwiftKey…

Remarks: I would have imagined that the view height would equal keyboard height + keyboard Y. But that is only true … on OnePlus7, which is the problematic device!

Emulator, Pixel 2 XL, Android 10	OnePlus 7, Android 10, OxygenOS 10.0.1

React Native version:

System:
    OS: Linux 4.19 Manjaro Linux undefined
    CPU: (8) x64 Intel(R) Core(TM) i7-8809G CPU @ 3.10GHz
    Memory: 565.35 MB / 31.33 GB
    Shell: 5.7.1 - /bin/zsh
  Binaries:
    Node: 12.13.0 - /usr/bin/node
    npm: 6.12.0 - /usr/bin/npm
  IDEs:
    Android Studio: 3.5 AI-191.8026.42.35.5900203
  npmPackages:
    react: 16.8.1 => 16.8.1 
    react-native: 0.61.3 => 0.61.3

Steps To Reproduce

1. Open the reproduction demo in a Pixel 3XL emulator with Android 10+.
2. Observe that KeyboardAvoidingView with behavior padding doesn’t add enough padding.

Describe what you expected to happen: The padding should match keyboard’s real height.

Full reproduction : react-native-oneplus7-keyboard-height-discrepancy

Observations

• StatusBar.currentHeight is substituted to the keyboard layout end frame height.
• StatusBar.currentHeight is also substituted from keyboard layout end frame screenY

[jsamr]

@fabianeichinger Thank you so much for your great involvement in this open source project, looking forwards for your take on this!

[jsamr]

@fabianeichinger The goal of the screenshots is to compare with notch (Pixel 3XL) and without notch (Nexus 5X). With notch, the red vertical bar height doesn’t match the keyboard’s height. Without, it does.

with 2 different keyboards

That was because I used android 10 in the Pixel and android 11 in the nexus. I have fixed that issue and updated the screenshots. But anyway, the relevant part is that it seems that having a notch causes ev.endCoordinates.height to be miscalculated. Compare the vertical red bar with keyboard’s height on the Pixel, you’ll notice a mismatch.