Statusbar Color not applied immediately if you have a splash screen

[AssetKid]

Bug Report

Problem

If you have a splash screen, the status bar color is only applied after the app loads... Not on startup.

Similar report #104

What is expected to happen?

Status bar color should be applied immediately.

What does actually happen?

Status bar color is not applied immediately.

Information

Command or Code

npm run android

Environment, Platform, Device

Tested on Android 8.0 & 9.0 (Device & Emulator)

Version information

CLI

• Cordova 9.0.0 ([email protected])

Platfrom

• Android

Plugins

• cordova-plugin-whitelist
• cordova-plugin-statusbar
• cordova-plugin-splashscreen

Checklist

• [x] I searched for existing GitHub issues
• [x] I updated all Cordova tooling to most recent version
• [x] I included all the necessary information above

[janpio]

How did you set up the splashscreen?

Is this reproducible in a new, plain Cordova app? A minimal reproduction repository would really help to debug and later fix this issue. More information on how to create one: https://github.com/apache/cordova-contribute/blob/master/create-reproduction.md

[AssetKid]

Repo - https://github.com/AssetKid/cordova-statusbar-repro

The project is made using vue.js and vue-cli-plugin-cordova. Not sure if that might be the issue.

Setup

• npm install to install dependencies
• npm run cordova-prepare to install cordova plugins and platform
• npm run cordova-serve-android to start the development server
• npm run cordova-build-android to build for production

[breautek]

Confirmed this is an issue.

If the status bar color is being set via JavaScript API such as StatusBar.backgroundColorByHexString, then I would have expected this behaviour however; if the status bar color is being set via config.xml, then I would have expected to apply the style as soon as the splashscreen is shown which it does not appear to do so.

~Just for assurance... I am going to test this on a vanilla cordova project.~ Confirmed this is also an issue on a vanilla cordova project with cordova-plugin-splashscreen & cordova-plugin-statusbar plugins added. The statusbar plugin only appears to apply the change after the splashscreen delay.

Note I only tested on Android.

[janpio]

Is this more a statusbar or more a splashscreen problem @breautek?

[breautek]

I had a quick look at the source code last night before bed and it wasn't immediately obvious @janpio . statusbar makes calls to read from config.xml and to set the status bar styling/colors during the initialize method which as far as I know is the earliest a plugin can execute code.

This leads me to believe that perhaps something in splashscreen is blocking execution of other plugins during its splashscreen delay but I haven't proven that theory, nor did anything jumped out at me at a quick glance at its source code.

[jcesarmobile]

I think the way the native splash view is built and presented doesn’t allow to style the status bar

[breautek]

There's actually a pending PR in splashscreen that appears to address this issue.

https://github.com/apache/cordova-plugin-splashscreen/pull/124

[stritchi]

This problem still exists and I tried to find where the black bars are coming from.

a. in the file splashscreen.java the defaut theme android.R.style.Theme_Translucent_NoTitleBar is loaded to build the dialogue and this of course overwrites everything that you have set up before. I solved it to overwrite this file to access my own module style.

            // Create and show the dialog
            splashDialog = new Dialog(context, android.R.style.Theme_Translucent_NoTitleBar);