Skip to content
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

Status bar visible after focus into input / StatusBar.hide() not working #154

Open
3 tasks done
canado opened this issue Sep 18, 2019 · 15 comments
Open
3 tasks done

Comments

@canado
Copy link

canado commented Sep 18, 2019

Bug Report

  • Android
  • CLI 7.1.0
  • Orientation landscape
  • config.xml
    plugin name="cordova-plugin-statusbar" source="npm" />
    preference name="StatusBarOverlaysWebView" value="true" />
    preference name="StatusBarBackgroundColor" value="#000000" />
    preference name="StatusBarStyle" value="lightcontent" />

Problem

When the user focus on an input text field, the keyboard appears but also the status bar
When trying to hide the status bar in focusin event with StatusBar.hide() the status bar is not hidding.
Also when calling StatusBar.hide() on focusout, the status bar is still not hiding.
Also when calling StatusBar.hide() with a little setTimeout 500ms the status bar is not hidding

What is expected to happen?

When using StatusBar.hide() the status bar should disappear

What does actually happen?

When using StatusBar.hide() the status bar is not hidding

Information

Please note that if an alert is invoked the status bar is disappearing

Command or Code

Environment, Platform, Device

Version information

Checklist

  • I searched for existing GitHub issues
  • I updated all Cordova tooling to most recent version
  • I included all the necessary information above
@canado
Copy link
Author

canado commented Sep 18, 2019

It seems that the status bar hide was working perfectly prior Android Software update.
Since the last or the previous update the StatusBar.hide() is no more working
The only solution would be to trigger an alert but this is way too much overkill!

Thanks

@breautek
Copy link
Contributor

It seems that the status bar hide was working perfectly prior Android Software update.

Command or Code
Environment, Platform, Device
Version information

Can you fill out this information please, especially since potentially related to an android OS version.

@canado
Copy link
Author

canado commented Sep 19, 2019

You are right here it is
both cases working / not working
Android SM-G950W

not working Android 9 / One UI version
Build number PPR1.180610.011.G950WVLS6CSH1

Working previous version I don't know

@breautek
Copy link
Contributor

I'm unable to reproduce this on my Android 9 device.

I have copied your preferences and created a text field and a button. The button will hide the statusbar by calling StatusBar.hide()

I click the button and observe the statusbar hiding.
I then click on the textfield to give it focus, I observe the keyboard has opened and the status bar is still hidden at this time. Let me know if I did something wrong.

I would advise to ensure that your cordova-android platform & tooling is up to date with the latest versions available. If the issue still persists, consider creating a minimal cordova app that reproduces the issue and share a github repo.

My android device is:
SM-N960W

@canado
Copy link
Author

canado commented Sep 19, 2019

Ok thanks for the advice
I can confirm that it is working perfectly fine on
Android S7
SM-G930W8
Android 8

@breautek
Copy link
Contributor

Also worth note that you're using an older version of the Cordova CLI, so when you simply run cordova platform add android, it will install an older version of the platform as well.

The latest version of the CLI is 9.0.0 but if something is blocking you from upgrading (9.0.0 does have some breaking changes for plugin authors), you can use cordova platform add android@8 to install the latest version of cordova-android. I created my cordova project using CLI 8.1.2.

@canado
Copy link
Author

canado commented Sep 19, 2019

I am able to compile on CLI 9.0.0, and I still have the same issue : (

@breautek
Copy link
Contributor

Can you provide me a sample reproduction app? I'll take a deeper look later tonight.

https://github.com/apache/cordova-contribute/blob/master/create-reproduction.md

@canado
Copy link
Author

canado commented Sep 19, 2019

Please note that the status bar is a little different from the traditional status bar as it contains two extra icons for gaming.

see screenshot attached
https://imgur.com/a/DPT6bbU

@breautek
Copy link
Contributor

The UI in the picture is not the status bar. It's the navigation bar. The status bar is what appears on the top of the screen, e.g where the time and battery indicator is located.

@canado
Copy link
Author

canado commented Sep 19, 2019

You are right, I managed to fix the issue on the "navigation bar" by doing this
if (window.StatusBar){
window.StatusBar.show();
setTimeout(function(){
window.StatusBar.hide();
},5);
}

when I bring up the status bar and hide it again, it makes the navigation bar disappear.
If you know any other solution to remove the navigation bar, let me know.

Also sorry for the misunderstanding

@breautek
Copy link
Contributor

I'm not sure why status bar APIs would be changing the navigation bar. That sounds like an unintended side effect to me and probably a bug. StatusBar.show()/StatusBar.hide() should only be affecting the status bar, not the navigation bar.

Cordova doesn't have any APIs that specifically targets the navigation bar. Although there is probably a third-party plugin available to do this. A quick search led me to older plugin but I cannot vouch if it works as it hasn't received an update for the last 4 years.

@canado
Copy link
Author

canado commented Sep 19, 2019

Just tested it, and I can confirm it is not working.
Anyway if people have the same issue as me with the navigation bar, at least there is a "fix"

@ghost
Copy link

ghost commented Jan 17, 2020

package.json

"dependencies": {
    "cordova-android": "^8.1.0",
    "cordova-plugin-splashscreen": "^5.0.3",
    "cordova-plugin-statusbar": "^2.4.3"
  }

config.xml

    <preference name="Orientation" value="portrait" />
    <preference name="Fullscreen" value="true" />

This is what's going on on my side, maybe be relevant

When an input element is focused status bar is displayed as well as keyboard. When an input element is blurred status bar doesn't go away. However, if I call window.StatusBar.hide() at app initialization the problem is gone, that is, status bar doesn't show up on input focus.

@tanhatariq
Copy link

I am also facing the same issue with Status Bar, the Status bar keeps overlapping the UI, until we use any input, once any input in App is being focussed out, the status bar starts behaving normally, i have tested this right from Android 8 until Android 13, real devices and simulators as well, but everywhere the problem remains the same. any help will be deeply appreciated.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants