`KeyboardAvoidingView` with translucent status bar leaves space at the bottom of the screen on Android

[QichenZhu]

Description

When android:windowTranslucentStatus is set to true, KeyboardAvoidingView adds extra white space at the bottom of the screen after the soft keyboard closes.

This is similar to #27526.

Steps to reproduce

1. Build the reproducer for Android with New Arch enabled.

cd ReproducerApp
yarn
yarn android

2. Start Metro.

npx react-native start

3. Launch the app.

4. Tap the text to open the soft keyboard.

5. Close the soft keyboard.

React Native Version

0.77.0

Affected Platforms

Runtime - Android

Output of npx react-native info

System:
  OS: Linux 5.15 Linux Mint 21.3 (Virginia)
  CPU: (6) x64 AMD Ryzen 5 3500X 6-Core Processor
  Memory: 32.90 GB / 39.16 GB
  Shell:
    version: 5.1.16
    path: /bin/bash
Binaries:
  Node:
    version: 20.18.1
    path: ~/.nvm/versions/node/v20.18.1/bin/node
  Yarn:
    version: 1.22.22
    path: ~/.nvm/versions/node/v20.18.1/bin/yarn
  npm:
    version: 10.8.2
    path: ~/.nvm/versions/node/v20.18.1/bin/npm
  Watchman:
    version: 20241022.093722.0
    path: /home/penguin/watchman/built/bin/watchman
SDKs:
  Android SDK:
    API Levels:
      - "31"
      - "32"
      - "33"
      - "34"
      - "35"
    Build Tools:
      - 30.0.3
      - 33.0.1
      - 34.0.0
      - 35.0.0
    System Images:
      - android-22 | Google APIs Intel x86 Atom
      - android-34 | Intel x86_64 Atom
      - android-34 | Google APIs Intel x86_64 Atom
    Android NDK: Not Found
IDEs:
  Android Studio: Not Found
Languages:
  Java:
    version: 17.0.14
    path: /usr/bin/javac
  Ruby: Not Found
npmPackages:
  "@react-native-community/cli":
    installed: 15.0.1
    wanted: 15.0.1
  react:
    installed: 18.3.1
    wanted: 18.3.1
  react-native:
    installed: 0.77.0
    wanted: 0.77.0
npmGlobalPackages:
  "*react-native*": Not Found
Android:
  hermesEnabled: true
  newArchEnabled: true
iOS:
  hermesEnabled: Not found
  newArchEnabled: false

Stacktrace or Logs

N/A

Reproducer

https://github.com/QichenZhu/reproducer-react-native-keyboard-avoiding-view-android-rn77

Screenshots and Videos

47140.mp4

[QichenZhu]

This was fixed by #29292.

But the fix was recently reverted by #45928 to address #45880.

mLastHeight includes the translucent status bar height, but in Bridgeless mode it's not set.

mVisibleViewArea.height() works in Bridgeless mode but doesn’t account for the translucent status bar.

How about using getMeasuredHeight()? It should resolve both issues.

[jja08111]

It also occurs when using WindowCompat.setDecorFitsSystemWindows(window, false).

[QichenZhu]

Hi @shubhamguptadream11, just checking on the progress of this. Let me know if there’s something I can assist with.

[VagnerNerves]

It's happening in my project: when I click on an input and open the keyboard, after closing, there is a spacing at the bottom.

[QichenZhu]

@shubhamguptadream11 This issue is still reproducible in React Native 0.77. We have a PR and another possible solution. Any chance we can make progress on this? Thanks a lot!

[danielrakaczki1]

Any update on this? Still happening with

    "react-native": "0.79.2"
    "expo": "^53.0.7",
    "expo-status-bar": "^2.2.3",