You are viewing a plain text version of this content. The canonical link for it is here.
Posted to dev@cordova.apache.org by "seamlink-aalves (via GitHub)" <gi...@apache.org> on 2026/03/07 16:53:50 UTC
[I] Statusbar confusion [cordova-discuss]
seamlink-aalves opened a new issue, #114:
URL: https://github.com/apache/cordova-discuss/issues/114
Hi,
With the latest releases of `cordova-android` 15 and `cordova-ios` 8 I see that each have started to implement the management of the status bar in each platform and that, for me, signals that the `cordova-plugin-statusbar` will be deprecated soon. The blog posts mentions that the latest versions do not require the statusbar plugin.
For me, I haven't been able to drop the status bar plugin with the latest releases of each platform. Our apps have been for a long time presented with the webview fully extented to the size of the screen (edge to edge). To be able to do this we have used StatusBarOverlaysWebView preference of the statusbar plugin and manage ourselves the insets.
In `cordova-android` we have now `AndroidEdgeToEdge` preference that extends the webview but I have not found a similar preference for iOS, which forces me to keep using the statusbar plugin. I think a similar preference should be implemented for that platform or simply have a single preference for both platforms like `EnableEdgeToEdge`.
With the new implementations of the statusbar within each respective platform there is no method to set the colour of the text like we had with the statusbar plugin with `statusbarLightStyle` and `styleDefault`. I need to be able to manage a proper contrast for the text if my app has light background. In this case I think each platform should implement a single function to do this: something like `setColor` with a parameter `light` or `dark`.
Has anyone faced these issues?
Alexandre Alves
--
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
To unsubscribe, e-mail: dev-unsubscribe@cordova.apache.org.apache.org
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
---------------------------------------------------------------------
To unsubscribe, e-mail: dev-unsubscribe@cordova.apache.org
For additional commands, e-mail: dev-help@cordova.apache.org
Re: [I] Statusbar confusion [cordova-discuss]
Posted by "itbeyond (via GitHub)" <gi...@apache.org>.
itbeyond commented on issue #114:
URL: https://github.com/apache/cordova-discuss/issues/114#issuecomment-4334089479
I have an app that has been running for over 10 years and worked perfectly until all this edge-to-edge started. My last working iterations were cordova-android 14 with the cordova-plugin-android-edge-to-edge and edge-to-edge enabled in preferences. I have just been porting to cordova-android 15 and on my real devices and simulators the webview is truncating the bottom of the screen. If I enable preference name="Fullscreen" value="true" I get full screen and it works fine.
I have removed the cordova-plugin-android-edge-to-edge, cordova-plugin-statusbar & cordova-plugin-splashscreen.
The setting of preference name="AndroidEdgeToEdge" value="false" drops about 2cm off the bottom (see image) and with this set to true if is about half the size droped off with the app top line under the statusbar. If I run the app in desktop workspaces it is correct in any of the test conditions. Can someone please shed light on this or what I can do to test or check what is going on or point me to the right place to post this. If I revert to cordova-android 14 it works fine.
<img width="270" height="600" alt="Image" src="https://github.com/user-attachments/assets/2e65ea32-896d-481f-88f4-5c408fafac36" />
<img width="1920" height="1200" alt="Image" src="https://github.com/user-attachments/assets/647932a9-4767-4890-abc6-ba0940b63225" />
--
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
To unsubscribe, e-mail: dev-unsubscribe@cordova.apache.org
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
---------------------------------------------------------------------
To unsubscribe, e-mail: dev-unsubscribe@cordova.apache.org
For additional commands, e-mail: dev-help@cordova.apache.org
Re: [I] Statusbar confusion [cordova-discuss]
Posted by "seamlink-aalves (via GitHub)" <gi...@apache.org>.
seamlink-aalves commented on issue #114:
URL: https://github.com/apache/cordova-discuss/issues/114#issuecomment-4047313684
I did further test for this migration and found other issues that I'd like to share:
For cordova-android 15 I started testing the build of the App with `AndroidEdgeToEdge` preference and while I see the same result as with `StatusBarOverlaysWebView` of `cordova-plugin-statusbar` this will to work correctly on Android version under 15. For these devices the app will not extend under the status bar but worst of all it will keep adding the insets on the top of the App. In summary, I get the status bar, the app UI starts bellow the the status bar and it will also assume the insets as if the app extended bellow the status bar. It also made no difference having the statusbar plugin or not. The result is the same.
After some digging of the cordova-android 15 code I was able to get a better result changing the source code here (https://github.com/apache/cordova-android/blob/c02d1b0331d82c0480a275804f85d134ad201155/framework/src/org/apache/cordova/CordovaActivity.java#L124) from:
`canEdgeToEdge = preferences.getBoolean("AndroidEdgeToEdge", false)
&& Build.VERSION.SDK_INT >= Build.VERSION_CODES.VANILLA_ICE_CREAM;`
to:
`canEdgeToEdge = preferences.getBoolean("AndroidEdgeToEdge", false);`
Also changed here (https://github.com/apache/cordova-android/blob/c02d1b0331d82c0480a275804f85d134ad201155/framework/src/org/apache/cordova/SystemBarPlugin.java#L58) from:
`canEdgeToEdge = preferences.getBoolean("AndroidEdgeToEdge", false)
&& Build.VERSION.SDK_INT >= Build.VERSION_CODES.VANILLA_ICE_CREAM;`
to:
`canEdgeToEdge = preferences.getBoolean("AndroidEdgeToEdge", false);`
While this fixes the insets problem in Android < 15 and does not change the behaviour for Android >= 15, for the first ones it does not solve the overlay of the status bar. For me this would be acceptable and good compromise. I found no way to overlay the statusbar over the webview for android <15.
I will try to make a PR with this change.
For cordova-ios 8 my tests have turned out mixed results. After my last comment I did further tests and while I confirmed that in a blank app I was able to get an App with the webview extended under the statusbar with `viewport-fit=cover`, with our App, after removing the status bar plugin and having `viewport-fit=cover` I was unable to get the App to extend under the statusbar. Without the status bar I could only get the desired result by implementing an override to the `viewDidLoad` function in the `ViewController` like this:
```
/*
Licensed to the Apache Software Foundation (ASF) under one
or more contributor license agreements. See the NOTICE file
distributed with this work for additional information
regarding copyright ownership. The ASF licenses this file
to you under the Apache License, Version 2.0 (the
"License"); you may not use this file except in compliance
with the License. You may obtain a copy of the License at
http://www.apache.org/licenses/LICENSE-2.0
Unless required by applicable law or agreed to in writing,
software distributed under the License is distributed on an
"AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
KIND, either express or implied. See the License for the
specific language governing permissions and limitations
under the License.
*/
import Cordova
import WebKit
#if compiler(>=6.1)
@objc @implementation
#else
@_objcImplementation
#endif
extension MainViewController {
}
class ViewController: MainViewController {
override func viewDidLoad() {
super.viewDidLoad()
if #available(iOS 11.0, *), let wk = self.webView as? WKWebView {
wk.scrollView.contentInsetAdjustmentBehavior = .never
}
}
}
```
Please note that I searched the complete code of the App to check if there was something manipulating. I found that the cordova inappvrowser also has code related to the manipulation of the statusbar, so I removed it but got the same result with UI of the app starting after the status bar. After removing both the statusbar and the inappbrowser I found no code related to the manipulation of the statusbar except for the platform code.
Finally, I found no way to control the color of the text of the status bar without the status bar plugin. Will this be implemented in the future?
--
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
To unsubscribe, e-mail: dev-unsubscribe@cordova.apache.org
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
---------------------------------------------------------------------
To unsubscribe, e-mail: dev-unsubscribe@cordova.apache.org
For additional commands, e-mail: dev-help@cordova.apache.org
Re: [I] Statusbar confusion [cordova-discuss]
Posted by "seamlink-aalves (via GitHub)" <gi...@apache.org>.
seamlink-aalves commented on issue #114:
URL: https://github.com/apache/cordova-discuss/issues/114#issuecomment-4019380617
Hi @dpogue
Thank you for your comment. I did not know this. I can confirm that `viewport-fit=cover` will work on iOS. I was not aware of this.
Nevertheless I will keep my suggestion that both platforms should be implemented the same way. I don't see a reason why we should have different configurations to achieve the same goal in both platforms.
Concerning the definition of the colour of the text of the status bar, I see no way to set it with the new implementation in each platform. If the UI of the App has a dark color and extends bellow the status bar and the OS is in light-mode (which will make the color black) I have no way to set it to a white color.
Are you planning to support this in a future releases of each platform?
--
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
To unsubscribe, e-mail: dev-unsubscribe@cordova.apache.org
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
---------------------------------------------------------------------
To unsubscribe, e-mail: dev-unsubscribe@cordova.apache.org
For additional commands, e-mail: dev-help@cordova.apache.org
Re: [I] Statusbar confusion [cordova-discuss]
Posted by "Chuckytuh (via GitHub)" <gi...@apache.org>.
Chuckytuh commented on issue #114:
URL: https://github.com/apache/cordova-discuss/issues/114#issuecomment-4139388884
@seamlink-aalves on that same test app there's an input item which allows to easily validate the behavior around IME insets handling and I confirm that there are problems around it as well. As per https://issues.chromium.org/issues/457682720, they should be fixed from WebView version 144.0.7514.0 upwards.
We built https://github.com/ionic-team/cordova-plugin-inset-injector which gives us control over IME insets handling and also unifies the safe-area-insets across multiple Android WebView versions. The code is open and you're free to use as you see fit but we aren't supporting that repository officially.
--
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
To unsubscribe, e-mail: dev-unsubscribe@cordova.apache.org
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
---------------------------------------------------------------------
To unsubscribe, e-mail: dev-unsubscribe@cordova.apache.org
For additional commands, e-mail: dev-help@cordova.apache.org
Re: [I] Statusbar confusion [cordova-discuss]
Posted by "seamlink-aalves (via GitHub)" <gi...@apache.org>.
seamlink-aalves commented on issue #114:
URL: https://github.com/apache/cordova-discuss/issues/114#issuecomment-4133058477
Hi @Chuckytuh
Thank you for confirming this. I also observed a problem with insets when openning the keyboard. Can you confirm this?
I have done a hook to change the cordova native code on after prepare while this is not fixed in the project (it also includes a fix for when the keyboard is openned). If you confirm that it also works for you I'll do a PR for this also. Can you please check?
[androidEdgeToEdgeFix.js](https://github.com/user-attachments/files/26269132/androidEdgeToEdgeFix.js)
--
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
To unsubscribe, e-mail: dev-unsubscribe@cordova.apache.org
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
---------------------------------------------------------------------
To unsubscribe, e-mail: dev-unsubscribe@cordova.apache.org
For additional commands, e-mail: dev-help@cordova.apache.org
Re: [I] Statusbar confusion [cordova-discuss]
Posted by "seamlink-aalves (via GitHub)" <gi...@apache.org>.
seamlink-aalves commented on issue #114:
URL: https://github.com/apache/cordova-discuss/issues/114#issuecomment-4048756603
Another finding I would like to report is that, with the change included in the PR I did for cordova-android, for Android devices with version <15, I had previously reported that the status bar would start bellow the statusbar and with the correct insets. This is actually not true. It does extend to the full height of the device but the status bar is black or white depending on the theme of the device. If I set the status bar to transparent with `window.statusbar.setBackgroundColor("#00000000")` it will have the same behaviour in version bellow 15 and higher then 15.
--
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
To unsubscribe, e-mail: dev-unsubscribe@cordova.apache.org
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
---------------------------------------------------------------------
To unsubscribe, e-mail: dev-unsubscribe@cordova.apache.org
For additional commands, e-mail: dev-help@cordova.apache.org
Re: [I] Statusbar confusion [cordova-discuss]
Posted by "dpogue (via GitHub)" <gi...@apache.org>.
dpogue commented on issue #114:
URL: https://github.com/apache/cordova-discuss/issues/114#issuecomment-4017065873
For iOS, the status bar obeys the `viewport-fit` option of the `<meta name="viewport">` tag.
`viewport-fit=cover` will make the WebView cover the whole screen and give you access to CSS environment variables to implement your own status bar.
`viewport-fit=contain` will keep the WebView below the status bar, with the status bar colours being determined by the `<meta name="theme-color">` tag.
--
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
To unsubscribe, e-mail: dev-unsubscribe@cordova.apache.org
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
---------------------------------------------------------------------
To unsubscribe, e-mail: dev-unsubscribe@cordova.apache.org
For additional commands, e-mail: dev-help@cordova.apache.org
Re: [I] Statusbar confusion [cordova-discuss]
Posted by "Chuckytuh (via GitHub)" <gi...@apache.org>.
Chuckytuh commented on issue #114:
URL: https://github.com/apache/cordova-discuss/issues/114#issuecomment-4131247340
I +1 on the missing feature that we used to have with `StatusBarOverlaysWebView`.
Even though it was said on https://github.com/apache/cordova-android/pull/1817 that the new `AndroidEdgeToEdge` would allow to accomplish the same, it isn't true for < Android 15.
With cordova-android 14 we didn't get any safe area insets being reported, even when using the statusbar plugin, however, using `AndroidEdgeToEdge` from cordova-android 15 we do get the insets being reported (albeit in some versions of the WebView they aren't properly reported as is well known).
With the changes suggested on https://github.com/apache/cordova-android/pull/1902 the result is that insets are expected to be reported and handled by app developers to reposition elements accordingly, however, on those Android versions the default WebView versions pre-installed do not report the insets correctly due to WebView known bugs. But, when using cordova-android 14 it wouldn't be a problem because, even though insets aren't reported, they don't need to be handled at all by the webapp.
See the following screenshots of a test app (https://github.com/Chuckytuh/cordovakeyboardtest/tree/cordova-android15-edgetoedge) running @seamlink-aalves changes in an Android 14 simulator running WebView version `113.0.5672.136`:
| Portrait | Landscape left | Landscape right |
|--------|--------|--------|
| <img width="1080" height="2400" alt="Image" src="https://github.com/user-attachments/assets/ef2a8bbd-0d74-439b-a112-fc5bbaac5025" /> | <img width="2400" height="1080" alt="Image" src="https://github.com/user-attachments/assets/14998d98-db1c-424e-9fd1-dd04f92a4ae8" /> | <img width="2400" height="1080" alt="Image" src="https://github.com/user-attachments/assets/2540420a-7826-46a6-9d56-cc779ca9d7dc" /> |
And running on WebView version `146.0.7680.119` in Android 14:
| Portrait | Landscape left | Landscape right |
|--------|--------|--------|
| <img width="1080" height="2400" alt="Image" src="https://github.com/user-attachments/assets/75afd824-a5e2-4a04-ad23-da8fa01f7f51" /> | <img width="2400" height="1080" alt="Image" src="https://github.com/user-attachments/assets/eeffb491-c6e7-464a-99dc-841e53ae9bb6" /> | <img width="2400" height="1080" alt="Image" src="https://github.com/user-attachments/assets/b4426b77-2429-494a-a9b8-eeb9f3ced059" /> |
--
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
To unsubscribe, e-mail: dev-unsubscribe@cordova.apache.org
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
---------------------------------------------------------------------
To unsubscribe, e-mail: dev-unsubscribe@cordova.apache.org
For additional commands, e-mail: dev-help@cordova.apache.org