Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

StatusBar.setBackgroundColor(color) for iOs or Plugin

See original GitHub issue

Version

1.0.0-beta.4

Platfrom

iOS built application

Question

There was already a similar question or request at #194. There it is stated that setting the StatusBar background-color is not supported on iOs, but that it would be possible to use the cordova-plugin-statusbar. But when trying to install the plugin it says that the plugin is incompatible:

$ npm install cordova-plugin-statusbar
+ cordova-plugin-statusbar@2.4.2
added 1 package in 6.12s

$ npx cap sync ios
✔ Copying web assets from www to ios/App/public in 55.72ms
✔ Copying native bridge in 911.66μp
✔ Copying capacitor.config.json in 1.19ms
✔ copy in 92.41ms
✔ Updating iOS plugins in 5.71ms
  Found 0 Capacitor plugins for ios:
✔ Updating iOS native dependencies in 3.76s
  Found 1 incompatible Cordova plugin for ios, skipped install
    CordovaPluginStatusbar (2.4.2)
✔ update ios in 3.77s
Sync finished in 3.877s

Did I miss something? Is there another already implemented way to get customised background-colors for the status bar via JS code?

Issue Analytics

State:
Created 5 years ago
Reactions:5
Comments:11 (3 by maintainers)

Top GitHub Comments

9reactions

Robinhoehcommented, Apr 3, 2020

There is a dropwon in xcode which you can select:

9reactions

jcesarmobilecommented, Sep 19, 2018

I’ve searched why I added the statusbar plugin to the incompatible ones and the reason was statusbar plugin makes the Capacitor app crash if UIViewControllerBasedStatusBarAppearance is set to YES (which is the default value now), so basically installing it made the app crash. At the beginning we had UIViewControllerBasedStatusBarAppearance set to NO and when I tried the statusbar was working, that’s why on that commend I recommended to use the cordova one.

As I also said on that comment, setting the statusbar background color is not really supported on iOS, the statusbar it’s been transparent since iOS 7 and it’s not possible to change the color. What cordova-plugin-statusbar does it to add a fake view and set it’s color. We want to avoid this kind of hacks in Capacitor.

Going to close this as feature request and if it gets enough +1 reactions (it already have 2) we might consider to add it in the future. But I think this should be avoided as adding a fake view is not a good solution and most times requires resizing the webview, which causes a lot of new problems.

Top Results From Across the Web

Status Bar Capacitor Plugin API

This plugin requires "View controller-based status bar appearance" ... setBackgroundColor and setOverlaysWebView are currently not supported on iOS devices.

How to change the status bar background color and text color ...

You can set background color for status bar during application launch or during viewDidLoad of your view controller. extension UIApplication { var ...

Capacitor/IOS Status Bar - Ionic Forum

Go to the Main.storyboard file; select the View; and in the Attributes Inspector, change the Background Color to whichever color you'd like. The ......

Change Status Bar Background Color in React Native

React Native has the SafeAreaView component to change the background color of the status bar in IOS. For Android status bar, we need...

Change Status Bar Color for Android and iOS in .NET MAUI

Are you having trouble changing the background color of the status bar in your .NET MAUI app? Watch this video! With the .NET...