-
-
Notifications
You must be signed in to change notification settings - Fork 71
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Inconsistent NavigationBar
Behavior with Edge-to-Edge
Support (Android)
#592
Comments
Hey @wise-danya 👋 Thank you for providing a repo and high quality issue description! Before digging into internals may I ask you what is the purpose of disabling the module and keeping edge-to-edge mode? Basically the feature with disabling module was added to fallback to default Android |
Hey @kirillzyusko 👋 Thanks for the quick response and for digging into the issue! Let me provide some additional context to clarify. Purpose of Keeping Edge-to-Edge ModeThe reason I want to keep <resources>
<style name="AppTheme" parent="Theme.EdgeToEdge">
<!-- … -->
</style>
</resources> Since the app’s theme relies on Purpose of Disabling the ModuleAs for disabling the module, the main reason is to allow a gradual adaptation of I’m following the approach you suggested for gradual adoption:
This allows me to selectively enable the module on screens where it has been fully integrated, while the rest of the app uses the default Android Any workaround or ideas on how to avoid this conflict between the two libraries would be really helpful! |
Thanks @wise-danya I think now I understand better what you are trying to achieve. Let me dig a little bit in internals and ask you about how you are going to handle them in your app 👀 1️⃣
|
Hi, I think the issue was introduced from |
@RayKay91 the provided example doesn't use |
@wise-danya did you solve this problem? Can I close this issue? 👀 |
Description
On Android, when toggling the
enabled
prop of the<KeyboardProvider />
usinguseKeyboardController
, the systemNavigationBar
behaves inconsistently due to the handling ofedge-to-edge
mode:When
enabled
is set totrue
, theNavigationBar
disappears.When
enabled
is set tofalse
, theNavigationBar
reappears and causes layout issues by lifting the content.This issue is primarily caused by toggling
edge-to-edge
mode in theenable()
anddisable()
methods.Steps to reproduce the behavior
react-native-keyboard-controller
andreact-native-bars
into a project.useKeyboardController
hook to toggle the enabled prop of<KeyboardProvider />
.enabled
totrue
, observe that the systemNavigationBar
disappears.enabled
tofalse
, observe that theNavigationBar
reappears and lifts the content.Expected behavior
The
NavigationBar
should remain hidden or translucent and should not affect the layout or content positioning, regardless of the enabled state of theKeyboardProvider
.Repo for reproducing
You can find a minimal reproducible example for this issue in the following repository: https://github.com/wise-danya/rn-keyboard-controller-issue-example
Video Demo
rnkc-demo.mov
Additional context
On some screens, when the library is disabled, the
NavigationBar
is visible and causes the content to be lifted, leading to layout issues. This makes it hard to gradually adopt the library across multiple screens in an app.Environment:
The text was updated successfully, but these errors were encountered: