iOS 8 NavigationBar BackgroundImage

ios uinavigationbar ios8 background-image
Chris picture Chris · Sep 26, 2014 · Viewed 23.5k times · Source

With iOS 8 the concept of just iPhone and iPad sizes along with portrait and landscape have changed and therefor setting the navigation bars background image isn't working the same. Currently i'm using the following code:

UIImage *NavigationPortraitBackground = [[UIImage imageNamed:@"nav-image-portrait"]
                                         resizableImageWithCapInsets:UIEdgeInsetsMake(0, 0, 0, 0)];

UIImage *NavigationLandscapeBackground = [[UIImage imageNamed:@"nav-image-landscape"]
                                          resizableImageWithCapInsets:UIEdgeInsetsMake(0, 0, 0, 0)];

[[UINavigationBar appearance] setBackgroundImage:NavigationPortraitBackground forBarMetrics:UIBarMetricsDefault];
[[UINavigationBar appearance] setBackgroundImage:NavigationLandscapeBackground forBarMetrics:UIBarMetricsCompact];

The bar metrics portion has been deprecated as of iOS 8. When starting up my app it simply repeats the bar image horizontally when on an iPhone 6 or 6 Plus. I've looked into image slices but i don't think thats the solution either.

portrait landscape

Answer

Chris picture Chris · Oct 5, 2014

I found the solution. I needed to use the method resizableImageWithCapInsets:resizingMode: and set the resizingMode to UIImageResizingModeStretch, otherwise the image would still tile in the navigation bar.

Objective-C:

[[UIImage imageNamed:@"nav-image-portrait"]
                                         resizableImageWithCapInsets:UIEdgeInsetsMake(0, 0, 0, 0) resizingMode:UIImageResizingModeStretch];

Swift 3 / 4:

UINavigationBar.appearance().setBackgroundImage(UIImage(named: "image")!.resizableImage(withCapInsets: UIEdgeInsets.zero, resizingMode: .stretch), for: .default)

Related questions

NavigationBar bar, tint, and title text color in iOS 8

The background text in the status bar is still black. How do I change the color to white? // io8, swift, Xcode 6.0.1 override func viewDidLoad() { super.viewDidLoad() self.navigationController?.navigationBar.barTintColor = UIColor.blackColor() self.navigationController?.navigationBar.titleTextAttributes = [NSForegroundColorAttributeName: UIColor.orangeColor()] }

Read More
Hide back button in navigation bar with hidesBackButton in Swift

I want to hide the back button when transitioning from one view to another. I read the questions regarding this problem and every answer was "use hidesBackButton". The problem with this is: when I put it in viewDidLoad/viewWillAppear the …

Read More
How to prevent status bar from overlapping content with hidesBarsOnSwipe set on UINavigationController?

I'm trying to use the new feature added in iOS 8 - hiding the navigation bar while user is scrolling the table view (similar to what mobile Safari does). I'm setting the property hidesBarsOnSwipe of UINavigationController to YES in viewDidAppear method …

Read More