Cordova, how to change the color of the control bar: back, home and windows

Question

I do not know the name of the component but the image below clarifies what I need, I apologize...

I need to change the color of this component in Cordova

Answer 1

Bearing in mind that the Apache Cordova transforms HTML5 + CSS + Javascript into native code, you will have to make an adaptation of the basic original code to change the color of the NavigationBarColor. Below follows two forms, both via XML and programmatically, using JAVA. See:

XML

<item name="android:navigationBarColor">@color/theme_color</item>

JAVA

window.setNavigationBarColor(@ColorInt int color)

However there are some plugins in which you may be using. As for example, the Cordova-plugin-navigationbar-color. Since you are open source, you can study and adapt according to your needs. See how it would look:

window.NavigationBar.backgroundColorByHexString('#3F51B5');

^{Note: the method has been introduced into Android Lollipop and will not work in API version < 21.}