[Swift] The color of the Navigation Bar is different (lighter) from the specified color.

When I set the color of the navigation bar with navigationController? .NavigationBar.barTintColor, it was different from the set color.

problem

Complete image

I designed the navigation color as well as the main background color. However, when I set navigationController? .NavigationBar.barTintColor to the same color as the main background, the actual navigation displayed was a little lighter.

Image of the problem

Solution

It was caused by NavigationBar.isTranslucent. NavigationBar.isTranslucent is a value that specifies the transparency of the navigation bar. If you have not set an image in the navigation bar, the default is true and it is translucent. If you don't want it to be translucent, you can set this value to false.

** Excerpt **

If the navigation bar doesn't have a custom background image, or if any pixel of the background image has an alpha value of less than 1.0, the default value of this property is true. If the background image is completely opaque, the default value of this property is false. If you set this property to true and the custom background image is completely opaque, UIKit applies a system-defined opacity of less than 1.0 to the image. If you set this property to false and the background image is not opaque, UIKit adds an opaque backdrop.

AppDelegate.swift

func application(_ application: UIApplication, didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey: Any]?) -> Bool {
    UINavigationBar.appearance().isTranslucent = false
    return true
}

UISearchController is affected when isTranslucent = false

If you set false to NavigationBar.isTranslucent, the search bar will shift downward when you focus on ʻUISearchController` set in the navigation bar. In that case, you can solve it by writing the following implementation in Controller.

Controller.swift

extendedLayoutIncludesOpaqueBars = true