-
- Notifications
You must be signed in to change notification settings - Fork 129
Description
Describe the bug
React Native version 0.81 and above includes an edgeToEdgeEnabled boolean in gradle.properties introduced by the following PR,
As per the React Native 0.81 release blog post, this boolean should only be used to enable edge-to-edge on Android 14 and below (as per Google, edge-to-edge is required for Android 15 & 16 "For apps targeting Android 16 (API level 36), R.attr#windowOptOutEdgeToEdgeEnforcement is deprecated and disabled, and your app can't opt-out of going edge-to-edge"). Note there is a minor typo in the React Native announcement - where it says "...to enable edge-to-edge on all supported Android versions below 16," I believe this should be below 15, but the difference is not significant.
Therefore, the expected (and confirmed) results in React Native with the default edgeToEdgeEnabled=false is that on Android 15 and 16, an app displays in edge-to-edge. On Android 14 and below, the app displays in the traditional non-edge-to-edge style.
However, if the app is wrapped in this library's KeyboardProvider, the results change - with the default edgeToEdgeEnabled=false, the app displays in traditional non-edge-to-edge style in all of Android versions including 14, 15, and 16.
Code snippet
My apologies, but I only have a moment to report this bug, but this should be easy to reproduce.
Repo for reproducing
Apologies, please see above.
To Reproduce
Please see above.
Expected behavior
Following the base React Native conventions, the app should display in traditional non-edge-to-edge in Android 14 and below, regardless of whether this library's KeyboardProvider is added, if edgeToEdgeEnabled=false, and display in edge-to-edge mode at all times in Android 15 and 16.
Screenshots
Apologies, I only have a moment to report this bug, but this should be easy to reproduce.
Smartphone (please complete the following information):
- Desktop OS: MacOS
- Device: Android emulators and physical devices.
- OS: Android versions 14, 15 & 16 tested
- RN version: 0.81.5
- RN architecture: New Arch
- JS engine: Default 0.81.5 engine
- Library version: 1.19.4
Additional context
I believe this should be easy to repro, but as mentioned in #1181, it's likely that this custom StatusBar in the FabricExample will throw off the results. You would likely need to remove this atypical StatusBar to see the bug described.
react-native-keyboard-controller/FabricExample/src/App.tsx
Lines 45 to 50 in 6aa917b
| <StatusBar | |
| animated | |
| translucent | |
| backgroundColor={"#FFFFFF00"} | |
| barStyle={"dark-content"} | |
| /> |