title: How to get a black statusbar on iPhone X on iOS 11
body: <p>By default the statusbar on an iPhone X looks like this:</p>
  
  <p><a href="https://i.stack.imgur.com/Pt4xc.png" rel="noreferrer"><img src="https://i.stack.imgur.com/Pt4xc.png" alt="enter image description here"></a></p>
  
  <p>But I would like to achieve this: </p>
  
  <p><a href="https://i.stack.imgur.com/Tp5vw.png" rel="noreferrer"><img src="https://i.stack.imgur.com/Tp5vw.png" alt="enter image description here"></a></p>
  
  <p>I tried setting the <code>preferredStatusBarStyle</code> to <code>lightContent</code> but it only worked after setting the background behind the statusbar to black. </p>
  
  <p>To fix the rounded corners I ended up adding another subview with rounded corners.</p>
  
  <pre><code>class ViewController: UIViewController {
  
      override func viewDidLoad() {
          super.viewDidLoad()
  
          view.backgroundColor = .black
  
          let roundedView = UIView(
              frame: CGRect(
                  x: 0,
                  y: UIApplication.shared.statusBarFrame.height,
                  width: view.frame.width,
                  height: view.frame.height
              )
          )
          roundedView.layer.cornerRadius = 10
          roundedView.layer.masksToBounds = true
          roundedView.backgroundColor = .white
          view.addSubview(roundedView)
  
          let label = UILabel(frame: CGRect(x: 0, y: 0, width: view.frame.width, height: 60))
          label.text = "Black statusbar!"
          label.textAlignment = .center
          roundedView.addSubview(label)
      }
  
      override var preferredStatusBarStyle: UIStatusBarStyle {
          return .lightContent
      }
  }
  </code></pre>
  
  <p>I'm wondering if this is the best approach.. there must be a better way to achieve this. </p>
  
  <hr>
  
  <p><strong>UPDATE</strong></p>
  
  <p>This is a terrible idea because: </p>
  
  <ul>
  <li>As <a href="https://stackoverflow.com/users/2227743/moritz">@Moritz</a> points out, the <a href="https://developer.apple.com/ios/human-interface-guidelines/overview/iphone-x/" rel="noreferrer">Apple's guidelines</a> explicitly forbids this: </li>
  </ul>
  
  <blockquote>
    <p><strong>Don't mask or call special attention to key display features.</strong> Don't attempt to hide the device's rounded corners, sensor housing, or
    indicator for accessing the Home screen by placing black bars at the
    top and bottom of the screen. Don't use visual adornments like
    brackets, bezels, shapes, or instructional text to call special
    attention to these areas either.</p>
  </blockquote>
  
  <ul>
  <li><p>The rounded corners at the top of the view might look nice, but you will have to add exceptions in the code to make sure the rounded corners are not shown on other iPhones. You will need to put this in all your ViewControllers / Storyboards.. That is not so great.</p></li>
  <li><p>The rounded corners at the bottom of the view will appear straight in screenshots, but the corners at the top (set manually) won't. This will be ugly when users share your app. </p></li>
  </ul>