1

How can I set the colour of the status bar to be clear. No matter what I do, it is white with some alpha.

I do not want it to disappear and I want the text to be black.

In the picture it might look like nag bar and status bar are grey but actually both are white with some blur affect or nag bar has blur affect and status bar is clear.

Pinterest clear status bar

Here is what I get despite the clear status bar background colour enter image description here

Michal Shatz
  • 1,416
  • 2
  • 20
  • 31

2 Answers2

6

The status bar has no background since iOS 7. In other words, it's clear by default.

If you see it white, it means the underlying view is white, and you need to change that.

Gabriele Petronella
  • 106,943
  • 21
  • 217
  • 235
  • So basically if everything is clear all the way to the window I get black background. Thats not what I want. I want a behaviour like Pinterest. I attached a photo to my question please look. – Michal Shatz Oct 20 '14 at 12:13
  • if you use a `UINavigationController` that's the default behavior, i.e. the `UINavigationBar` will extend below the status bar. There's tons of material on web explaining this, so you can easily find a tutorial. The key point here is that the status bar doesn't have a background per se. – Gabriele Petronella Oct 20 '14 at 13:11
  • I have tried everything I could find online and still my status bar is slightly white. I added a picture. Thanks :) – Michal Shatz Oct 20 '14 at 18:09
  • Ok I figured it out. You were right. Somewhere in my code a bar was added to adjust to the iOS7 change :) – Michal Shatz Oct 20 '14 at 18:30
  • How'd you make it clear? I set my root view to `UIColor.clearColor()` and my status bar is black – djv Aug 09 '15 at 00:30
  • For anyone searching: My solution was to make my root view's subview `top` constraint to the Top Layout Guide `-20` (Top Layout Guide is the bottom of the status bar). – djv Aug 09 '15 at 01:05
0

I was having the same problem. It ended up that my view was constrained to the top layout guide when instead it should have been constrained to the superview. Even though the view is constrained to different points it will look the same in interface builder (in my case, I think this is because I was instantiating the viewcontroller to my navigation controller in code and not displaying the navbar). See the image below.

Constraining to the superview and to the top layout guide both look the same in interface buildedr.

Click on the constraints for the imageview in the view above and the difference in constraints can be seen in the size inspector.

Constraining to the superview will look like this: enter image description here

This results in the simulator displaying the view like this: Notice how the status bar is clear and overlaid on top of the imageview. Notice how the status bar is clear and overlaid on top of the imageview.

Constraining to the top layout guide will look like this: enter image description here

This results in the simulator displaying the view like this: enter image description here Notice how the status bar appears white and how the imageview seems constrained to the status bar (the status bar is white text on a white background fyi).

So, in order to fix this problem, you need to change the constraint of the image view to be constrained to the superview.

You change this by selecting the constraint in this list: enter image description here

Once you have the constraint selected you can change what the constraint is attached to over here:

enter image description here

Francojamesfan
  • 85
  • 1
  • 5