How to change the color of the lower border of a UINavigationBar?

I read a lot of threads, but no one solved this question in a clear, consistent answer for the latest version of Swift.

For example, this question in the top answer suggests UINavigationBar.appearance().setShadowImage() . However, this method does not exist in the latest version of the quick version.

I do not want to hide the lower bound. I just want to change the color .

In addition, it would be great to change the height, but I know that I ask too much in one question.

Edit: I created an image with a 2x1 pixel and set it to shadowImage, but the border did not change:

 UINavigationBar.appearance().barTintColor = UIColor.whiteColor() UINavigationBar.appearance().shadowImage = UIImage(named: "border.jpg") //in my AppDelegate, for global appearance 

Here is the image; this is really small: border image

+10
ios swift uinavigationcontroller uinavigationbar
source share
3 answers

SWIFT 2.x:

For convenience, I extended UIImage() to allow me to essentially use it as a color with the code below.

 extension UIImage { class func imageWithColor(color: UIColor) -> UIImage { let rect = CGRectMake(0, 0, 1.0, 0.5) UIGraphicsBeginImageContextWithOptions(rect.size, false, 0) color.setFill() UIRectFill(rect) let image: UIImage = UIGraphicsGetImageFromCurrentImageContext() UIGraphicsEndImageContext() return image } } 

Then you need to add the following lines to your code to customize the shadow image of the viewController UINavigationBar or the color in this instance.

 // Sets Bar Background Image (Color) // self.navigationController?.navigationBar.setBackgroundImage(UIImage.imageWithColor(UIColor.blueColor()), forBarMetrics: .Default) // Sets Bar Shadow Image (Color) // self.navigationController?.navigationBar.shadowImage = UIImage.imageWithColor(UIColor.redColor()) 

SWIFT 3.x / 4.x:

Extension Code:

 extension UIImage { class func imageWithColor(color: UIColor) -> UIImage { let rect = CGRect(x: 0.0, y: 0.0, width: 1.0, height: 0.5) UIGraphicsBeginImageContextWithOptions(rect.size, false, 0.0) color.setFill() UIRectFill(rect) let image : UIImage = UIGraphicsGetImageFromCurrentImageContext()! UIGraphicsEndImageContext() return image } } 

NavigationBar Code:

 // Sets Bar Background Image (Color) // navigationController?.navigationBar.setBackgroundImage(UIImage.imageWithColor(color: .blue), for: .default) // Sets Bar Shadow Image (Color) // navigationController?.navigationBar.shadowImage = UIImage.imageWithColor(color: .red) 

Change 1:

Updated extension code so that you can adjust the size of the rectangle without changing the opacity of the UIImage color.

Edit 2:

Added Swift 3 + Swift 4 code.

+19
source share

Old UIKit configuration methods, such as UISomeClass.setSomething(whatIWantToSet) , have been reformulated so that you can directly set them using the = sign. So, in my example, you will need to use UISomeClass.something = whatIWantToSet .

In your case, this is UINavigationBar.appearance().shadowImage = whatYouWantToSet .

+1
source share

A bit tricky solution, but it works without the need for coding and extensions. Just add to the StoryBoard under the Bar Progress View navigation and set its color and height to your liking. If you want to set the full border, also set the progress to 1.

enter image description here

This way you get the right border for your navigation bar and the ability to add progressView at any time as an added bonus. I know, I know ... it's quite complicated, but programmers should be lazy, no?

0
source share

All Articles