Change the Color of the Status Bar Tutorial

The status bar can have a dark and light appearance inside an app In this tutorial the appearance of the status bar will be changed. This tutorial is made with Xcode 8 and built for iOS 10.

Open Xcode and create a new Single View Application.

Choose Next. For product name, use IOS10StatusBarColorTutorial and then fill out the Organization Name and Organization Identifier with your customary values. Enter Swift as Language and make sure only iPhone is selected in Devices.

Go to the Storyboard. Select the View and in the Attributes Inspector change the Background Color to Light Gray. Build and Run the Project. The default style of the status bar is dark content.

The style of the status bar we will try to achieve is a status bar with white content. Go to the ViewController.swift file and add the following lines of code.

override var preferredStatusBarStyle: UIStatusBarStyle {
    return .lightContent

This will set the type of theUIStatusBarStyle enum to lightContent. Build and Run the project to see the content of the status bar changed to light.

Next, go back to the Storyboard, Select the View Controller and in the Editor menu Select Embed in Navigation Controller. Select the Navigation Bar and in the Attribute Inspector set the Bar Tint color to red. The Storyboard will look like this.

Build and Run the project, The content of the status bar is dark again, which is the default. The reason for this is, iOS asked for the style of the status bar of the navigation controller instead of the contained view controller.

To change the style of all navigation controller inside the app, change the following method in the AppDelegate.swift file.

func application(_ application: UIApplication, didFinishLaunchingWithOptions launchOptions: [UIApplicationLaunchOptionsKey: Any]?) -> Bool {
    // Override point for customization after application launch.
    UINavigationBar.appearance().barStyle = .blackOpaque
    return true

Build and Run the Project again, this time the content of the status bar changed to white.

You can download the source code of the IOS10StatusBarColorTutorial at the ioscreator repository on Github.