Cordova Plugin Statusbar

For customizing the StatusBar of iOS and Android platform, some functions are provided by the StatusBar object. We have to add the permission for the statusbar plugin to make any changes to the statusbar. For doing this, we need to add the below code:

Installation

To add this plugin to your app, you have to install the plugin by typing the below command:

The above command is used for the Cordova 5.0+ versions. If you have an older version of Cordova installed, you can easily install this plugin via the deprecated id.

You can also install this plugin directly via the repo url.

Methods

There are various methods available in the Statusbar plugin. You can use these methods depending on changes you need to make. The list of methods used in these plugins are listed below:

• StatusBar.overlaysWebView
• StatusBar.styleDefault
• StatusBar.styleLightContent
• StatusBar.styleBlackTranslucent
• StatusBar.styleBlackOpaque
• StatusBar.backgroundColorByName
• StatusBar.backgroundColorByHexString
• StatusBar.hide
• StatusBar.show

StatusBar.overlaysWebView

If you want to make the statusbar overlay or not overlay WebView at startup, you have to add this method:

To make the statusbar overlay on top of the app, you have to set the value to true. But it should be confirmed that you adjust your style accordingly, so the content or title bar of the app will not be covered.

If the value is set to false, it makes the statusbar solid and it does not overlay your app. This method is supported in various platforms such as Android 5+, iOS 7+, etc.

StatusBar.styleDefault

The StatusBar.styleDefault is used for the default statusbar(dark text, for light backgrounds). This method is supported on various platforms such as Android 6+, Windows Phone 7, Windows Phone 8, and Windows Phone 8.1.

StatusBar.styleLightContent

This method uses the lightContent statusbar (light text, for dark backgrounds). It is supported on various platforms such as Android 6+, iOS, Windows Phone 7, Windows Phone 8, and Windows Phone 8.1.

StatusBar.styleBlackOpaque

This method uses the blackOpaque statusbar(light text, for dark backgrounds). It is supported on various platforms such as Android 6+, iOS, Windows Phone 7, Windows Phone 8, and Windows Phone 8.1.

StatusBar.styleBlackTranslucent

This method uses the blackTranslucent statusbar(light text, for dark backgrounds). If we talk about the compatibility of this method, it is supported on various platforms such as Android 6+, iOS, Windows Phone 7, Windows Phone 8, and Windows Phone 8.1.

StatusBar.hide

To hide the statusbar, the StatusBar.hide method is used. For knowing the compatibility of this method, it is supported in various platforms such as Android, iOS, Windows Phone 7, Windows Phone 8, and Windows Phone 8.1.

StatusBar.show

To show the statusbar, the StatusBar.show method is used. It is supported on various platforms such as Android, iOS, Windows Phone 7, Windows Phone 8, on Windows Phone 8.1.

StatusBar.backgroundColorByName

You can easily set the background color of the statusbar by the color name, if you set the value of StatusBar.overlaysWebView to false in iOS platform.

StatusBar.backgroundColorByHexString

You can easily set the background color of the statusbar using the hex string.

CSS shorthand properties are also supported in this method by using the below command:

In the iOS platform, if you set the value of StatusBar.overlaysWebView to false (#RRGGBB), you can set the background color of the statusbar using a hex string.

In Android platform, you can specify the values as #AARRGGBB, (AA is an alpha value, if you set the value of StatusBar.overlaysWebView to true.

This method is supported on various platforms such as Android 5+, iOS, Windows Phone 7, Windows Phone 8, and Windows Phone 8.1.

StatusBar.isVisible

It is used to see if the StatusBar is visible or not. It is supported on Android, iOS, Windows Phone 7, Windows Phone 8, and Windows Phone 8.1.

statusTap:

This event is listened to determine if the statusbar is tapped. It is supported on the iOS platform.