ionic-team
bug(android): follow-up for Capacitor v5 - overlaying status bar does not affect safe area insets
Bug Report
Capacitor Version
💊 Capacitor Doctor 💊
Latest Dependencies:
@capacitor/cli: 5.2.3 @capacitor/core: 5.2.3 @capacitor/android: 5.2.3 @capacitor/ios: 5.2.3
Installed Dependencies:
@capacitor/cli: 5.2.3 @capacitor/core: 5.2.3 @capacitor/android: 5.2.3 @capacitor/ios: 5.2.3
[success] iOS looking great! 👌 [success] Android looking great! 👌
Platform(s)
Android
Current Behavior
This is a follow-up to to the already reported bug in issues #2840 and https://github.com/ionic-team/ionic-framework/issues/17927. The #2840 issue was locked in November 2022 but as this still affects the latest version of Capacitor at the time (5.2.3), I am opening this this follow-up issue.
I know it is actually not a Capacitor or Ionic bug as it is apparently originates from Chromium webview but on the other hand it looks like the filed bug at chromium https://bugs.chromium.org/p/chromium/issues/detail?id=1094366 is not going to be fixed anytime soon.
Currently the only existing workaround seems to be to get the inset values by using native code via a plugin.
But the currently existing plugins
https://github.com/owlsdepartment/capacitor-plugin-android-insets and https://github.com/capacitor-community/safe-area
do not seem to be maintained anymore resp. they currently lead to dependency conflicts when trying to use them in combination with Capacitor v5 (see owlsdepartment/capacitor-plugin-android-insets/issues/1 and capacitor-community/safe-area/issues/6).
Expected Behavior
Not using the setOverlaysWebView method is not an option as many apps rely on it.
Until the problem is fixed on the Chromium side (if it ever will be) could the Capacitor team maybe provide an official plugin that is maintained on a regular basis and supports the latest Capacitor versions?
Code Reproduction
// Display content under transparent status bar (Android only)
await StatusBar.setOverlaysWebView({ overlay: true });
Thanks a lot!
I have the same problem and I use this one https://github.com/Aashu-Dubey/capacitor-statusbar-safe-area It supports the latest Capacitor versions.
I've also been using https://github.com/AlwaysLoveme/capacitor-plugin-safe-area, works great. It also provides a listener for device rotation and other inset changes.
Thanks for the links to the other plugins @rulaman123 and @aeharding, i will definitely check them out!
Nevertheless I would like to suggest to ionic-team to add the method for getting the inset values to the official Capacitor status-bar plugin so the code can be maintained at one place instead of having it in various redundant repositories. I think the fact that all these plugins exist shows that there obiously is an urgent need for it. As the code can just be merged from one of these other plugins it shouldn't be too much work.
And even if the bug will be fixed on the Chromium side one day I think it would still make sense to have this functionality available when using the status bar.
