How to make navigation bar transparent in iOS 10 - ios

I have the following code to make the navigation bar transparent but while still displaying the back button, this works on all versions of iOS but its stopped working with the iOS 10 beta
navigationBar.setBackgroundImage(UIImage(), for: UIBarMetrics.default)
navigationBar.shadowImage = UIImage()
navigationBar.isTranslucent = true
Has something changed with iOS 10 in this area?
Note its not possible to use navigationBar.isHidden as this would result in the navigation bar back button and title etc. disappearing also.

I don't know what has changed in iOS 10 to stop the previous code from working, but to fix it I created a transparent image (it only needs to be one pixel in dimension) and used the following code to make the navigation bar transparent (but still showing the back navigation button).
let transparentPixel = UIImage(named: "TransparentPixel")
navigationBar.setBackgroundImage(transparentPixel, for: UIBarMetrics.default)
navigationBar.shadowImage = transparentPixel
navigationBar.backgroundColor = UIColor.clear()
navigationBar.isTranslucent = true
Incidentally, if you want to change the color of the navigation bar, you can use the same principle:
let redPixel = UIImage(named: "RedPixel")
navigationBar.setBackgroundImage(redPixel, for: UIBarMetrics.default)
navigationBar.shadowImage = redPixel
navigationBar.isTranslucent = false

The solution #Essence provided works perfectly!
This is what I am using even to create the 1px transparent image by code:
class MainClass: UIViewController {
let transparentPixel = UIImage.imageWithColor(color: UIColor.clear)
override func viewWillAppear(_ animated: Bool) {
drawCustomNavigationBar()
}
func drawCustomNavigationBar() {
let nav = (self.navigationController?.navigationBar)!
nav.setBackgroundImage(transparentPixel, for: UIBarMetrics.default)
nav.shadowImage = transparentPixel
nav.isTranslucent = true
}
}
extension UIImage {
class func imageWithColor(color: UIColor) -> UIImage {
let rect = CGRect(origin: CGPoint(x: 0, y:0), size: CGSize(width: 1, height: 1))
UIGraphicsBeginImageContext(rect.size)
let context = UIGraphicsGetCurrentContext()!
context.setFillColor(color.cgColor)
context.fill(rect)
let image = UIGraphicsGetImageFromCurrentImageContext()
UIGraphicsEndImageContext()
return image!
}
}

Swift 3.x
self.navigationController?.navigationBar.setBackgroundImage(UIImage(), for: .default)
self.navigationController?.navigationBar.shadowImage = UIImage()
self.navigationController?.navigationBar.backgroundColor = .clear
self.navigationController?.navigationBar.isTranslucent = true

Related

Change navigation bar color in QLPreviewController

I want to change navigation bar color of QLPreviewController in swift 3. I have used below code to change color but its not working
viewQLPreview = QLPreviewController()
viewQLPreview.dataSource = self
viewQLPreview.delegate = self
viewQLPreview.navigationController?.navigationBar.isTranslucent = false
viewQLPreview.navigationController?.navigationBar.tintColor = UIColor.red
I have used below code to Change navigation bar color of QLPreviewController in swift 3.0
UINavigationBar.appearance().barTintColor = UIColor.red
UINavigationBar.appearance(whenContainedInInstancesOf: [QLPreviewController.self]).backgroundColor = UIColor.red
Use below code before present QLPreviewController :
UINavigationBar.appearance().tintColor = UIColor.red
UINavigationBar.appearance().barTintColor = UIColor.blue
UINavigationBar.appearance().titleTextAttributes = [NSAttributedStringKey.foregroundColor: UIColor.red]
UINavigationBar.appearance().setBackgroundImage(fromColor(color: UIColor.blue), for: .default)
UINavigationBar.appearance().isTranslucent = false
func fromColor (color: UIColor) -> UIImage{
let rect = CGRect(x: 0, y: 0, width: 1, height: 1)
UIGraphicsBeginImageContext(rect.size)
let context: CGContext? = UIGraphicsGetCurrentContext()
context?.setFillColor(color.cgColor)
context?.fill(rect)
let image: UIImage? = UIGraphicsGetImageFromCurrentImageContext()
UIGraphicsEndImageContext()
return image ?? UIImage()
}
Put below code in viewDidLoad of QLPreviewController.
viewQLPreview.navigationController?.navigationBar.isTranslucent = false
viewQLPreview.navigationController?.navigationBar.tintColor = UIColor.red
Also make sure that viewQLPreview.navigationController != nil
If you are pushing QLPreviewController then this code will work....
If you are presenting QLPreviewController then you need to make sure that rootController should be navigation controller, in your case..
let viewQLPreview = QLPreviewController()
let nav = UINavigationController(rootViewController: viewQLPreview)
self.present(nav, animated: true, completion: nil)

Swift 4 Set Navigation Attributes for only one View Controller

I'm trying to make only one view controller's navigation bar translucent and change some of the other attributes.
After the user leaves this VC however I'd like it to go back to 'normal' ie what I have in the AppDelegate.
Do I have to reset each line in the viewWillDisappear? If so what would I use for the background image/shadow image as the default nav bar settings?
// Make Nav Bar Translucent and Set title font/color
self.navigationController?.navigationBar.setBackgroundImage(UIImage(), for: .default)
self.navigationController?.navigationBar.shadowImage = UIImage()
self.navigationController?.navigationBar.isTranslucent = true
self.navigationController?.view.backgroundColor = .clear
self.navigationController?.navigationBar.titleTextAttributes = [NSAttributedStringKey.foregroundColor: UIColor.white, NSAttributedStringKey.font: UIFont.systemFont(ofSize: 20, weight: .semibold)]
Yes you have to set the values in ViewWillApear and reset the values in viewWillDisappear function for having clear transparent navigation bar and normal color navigation bar.
You can use extension on UINavigationController which can set/reset values based on some enum value. Create extension on UIImage which can create image from color to apply as a background image on navigation bar and shadow image.
enum NavigationBarMode {
case normal
case clear
}
extension UINavigationController {
func themeNavigationBar(mode: NavigationBarMode) {
self.navigationBar.isTranslucent = true
switch mode {
case .normal:
let image = UIImage.fromColor(.white)
navigationBar.setBackgroundImage(image, for: .default)
navigationBar.shadowImage = UIImage.fromColor(.lightGray)
navigationBar.titleTextAttributes = [NSAttributedStringKey.foregroundColor: UIColor.black, NSAttributedStringKey.font: UIFont.systemFont(ofSize: 20, weight: .semibold)]
case .clear:
let image = UIImage()
navigationBar.setBackgroundImage(image, for: .default)
navigationBar.shadowImage = image
navigationBar.titleTextAttributes = [NSAttributedStringKey.foregroundColor: UIColor.white, NSAttributedStringKey.font: UIFont.systemFont(ofSize: 20, weight: .semibold)]
}
}
}
extension UIImage {
static func fromColor(_ color: UIColor) -> UIImage {
let rect = CGRect(x: 0, y: 0, width: 1, height: 1)
UIGraphicsBeginImageContextWithOptions(rect.size, false, 0)
let context = UIGraphicsGetCurrentContext()
context!.setFillColor(color.cgColor)
context!.fill(rect)
let img = UIGraphicsGetImageFromCurrentImageContext()
UIGraphicsEndImageContext()
return img!
}
}
now you can call themeNavigationBar(mode: .transparent) in viewWillApear and call themeNavigationBar(mode: .normal) in viewWillDisappear to reset. also you can call themeNavigationbar(mode: .normal) if you have common navigationbar settings from you other viewControllers.
There are some Third party cocoapods available which you can use
https://github.com/MoZhouqi/KMNavigationBarTransition
https://github.com/DanisFabric/RainbowNavigation

How to fix transparency of navigation bar in swift?

I have transparent navigation bar with a background image for view controller, But when I add a bar button item to navigation bar, it becomes like in the second picture. How do I have bar button items also fully transparent navigation bar.
I used these code below to make the navigation bar transparent;
extension UINavigationController {
public func presentTransparentNavigationBar() {
navigationBar.setBackgroundImage(UIImage(), forBarMetrics:UIBarMetrics.Default)
navigationBar.translucent = true
navigationBar.shadowImage = UIImage()
setNavigationBarHidden(false, animated:true)
}
public func hideTransparentNavigationBar() {
setNavigationBarHidden(true, animated:false)
navigationBar.setBackgroundImage(UINavigationBar.appearance().backgroundImageForBarMetrics(UIBarMetrics.Default), forBarMetrics:UIBarMetrics.Default)
navigationBar.translucent = UINavigationBar.appearance().translucent
navigationBar.shadowImage = UINavigationBar.appearance().shadowImage
}
}
This should create a transparent UINavigationBar with items in it. It's currently working fine for me.
let navigationBarAppearace = UINavigationBar.appearance()
navigationBarAppearace.tintColor = UIColor.whiteColor()
navigationBarAppearace.translucent = true
navigationBarAppearace.shadowImage = UIImage()
navigationBarAppearace.backgroundColor = UIColor(red: 0.0, green: 0.0, blue: 0.0, alpha: 0.0)
navigationBarAppearace.titleTextAttributes = [NSForegroundColorAttributeName : UIColor.whiteColor()]
navigationBarAppearace.setBackgroundImage(UIImage(), forBarMetrics: .Default)
Try:
if let navBar = self.navigationController?.navigationBar {
extendedLayoutIncludesOpaqueBars = true
navigationBar.translucent = true
navigationBar.backgroundColor = UIColor.clearColor()
navigationBar.setBackgroundImage(UIImage(), forBarMetrics: .Default)
navigationBar.shadowImage = UIImage()
}

remove black border from UISearchController search bar swift

I have a UISearchController in my tableView. Also note that there is a navigation item in the top.
My issue is that i have a black border in the top and bottom when I load the page, however, it is not present when I click the search bar.
Search bar on page load (with black border):
After clicking on search bar (no black border):
Here is the code related:
let searchController = UISearchController(searchResultsController: nil)
in viewDidLoad:
searchController.searchBar.barTintColor = UIColor.redColor()
searchController.searchBar.tintColor = UIColor.whiteColor()
I followed several similar questions and made the following changes after the above lines in viewDidLoad():
1) searchController.searchBar.backgroundImage = UIImage()
2) searchController.searchBar.searchBarStyle = UISearchBarStyle.Minimal
3) searchController.searchBar.layer.borderColor = UIColor.clearColor().CGColor
4)
searchBar.layer.borderWidth = 1
searchBar.layer.borderColor = UIColor.whiteColor().CGColor
None worked. Is this an issue with the order I am using the code, or how would I get rid of these lines?
Fixed this after a lot of search. Here's how i did it. In viewDidLoad, added the following lines:
self.searchController.searchBar.translucent = false
self.searchController.searchBar.backgroundImage = UIImage()
self.searchController.searchBar.barTintColor = UIColor.redColor()
self.searchController.searchBar.tintColor = UIColor.whiteColor()
After that in app.delegate file in didFinishLaunchingWithOptions added the following code:
let backgroundColor = UIColor.redColor()
let foregroundColor = UIColor.whiteColor()
UIApplication.sharedApplication().statusBarStyle = .LightContent
UINavigationBar.appearance().shadowImage = UIImage()
UINavigationBar.appearance().setBackgroundImage(backgroundColor.toImage(), forBarMetrics: UIBarMetrics.Default)
UINavigationBar.appearance().tintColor = foregroundColor
UINavigationBar.appearance().titleTextAttributes = [NSForegroundColorAttributeName: foregroundColor]
Also need this extension on the app.delegate file (place outside of the class)
extension UIColor{
func toImage() -> UIImage {
let rect = CGRectMake(0, 0, 1, 1)
UIGraphicsBeginImageContextWithOptions(rect.size, true, 0)
self.setFill()
UIRectFill(rect)
let image = UIGraphicsGetImageFromCurrentImageContext()
UIGraphicsEndImageContext()
return image
}
}
(Thanks to Noel for the extension taken from this answer)
And finally, the desired result:
I think it is the navigation bar you need to remove the border for.
How to hide iOS7 UINavigationBar 1px bottom line
For iOS 13 / Swift 5; the following line makes the trick:
UISearchBar.setBackgroundImage(UIImage(), for: .any, barMetrics: .default)
Cheers!

Transparent iOS navigation bar

I'm creating an app and i've browsed on the internet and i'm wondering how they make this transparent UINavigationBar like this:
I've added following like in my appdelegate:
UINavigationBar.appearance().translucent = true
but this just makes it look like following:
How can I make the navigation bar transparent like first image?
You can apply Navigation Bar Image like below for Translucent.
Objective-C:
[self.navigationController.navigationBar setBackgroundImage:[UIImage new]
forBarMetrics:UIBarMetricsDefault]; //UIImageNamed:#"transparent.png"
self.navigationController.navigationBar.shadowImage = [UIImage new];////UIImageNamed:#"transparent.png"
self.navigationController.navigationBar.translucent = YES;
self.navigationController.view.backgroundColor = [UIColor clearColor];
Swift 3:
self.navigationController?.navigationBar.setBackgroundImage(UIImage(), for: .default) //UIImage.init(named: "transparent.png")
self.navigationController?.navigationBar.shadowImage = UIImage()
self.navigationController?.navigationBar.isTranslucent = true
self.navigationController?.view.backgroundColor = .clear
Swift Solution
This is the best way that I've found. You can just paste it into your appDelegate's didFinishLaunchingWithOptions method:
Swift 3 / 4
func application(_ application: UIApplication, didFinishLaunchingWithOptions launchOptions: [UIApplicationLaunchOptionsKey: Any]?) -> Bool {
// Override point for customization after application launch.
// Sets background to a blank/empty image
UINavigationBar.appearance().setBackgroundImage(UIImage(), for: .default)
// Sets shadow (line below the bar) to a blank image
UINavigationBar.appearance().shadowImage = UIImage()
// Sets the translucent background color
UINavigationBar.appearance().backgroundColor = .clear
// Set translucent. (Default value is already true, so this can be removed if desired.)
UINavigationBar.appearance().isTranslucent = true
return true
}
Swift 2.0
func application(application: UIApplication, didFinishLaunchingWithOptions launchOptions: [NSObject: AnyObject]?) -> Bool {
// Override point for customization after application launch.
// Sets background to a blank/empty image
UINavigationBar.appearance().setBackgroundImage(UIImage(), forBarMetrics: .Default)
// Sets shadow (line below the bar) to a blank image
UINavigationBar.appearance().shadowImage = UIImage()
// Sets the translucent background color
UINavigationBar.appearance().backgroundColor = UIColor(red: 0.0, green: 0.0, blue: 0.0, alpha: 0.0)
// Set translucent. (Default value is already true, so this can be removed if desired.)
UINavigationBar.appearance().translucent = true
return true
}
source: Make navigation bar transparent regarding below image in iOS 8.1
Swift 5 applying only to the current view controller
override func viewWillAppear(_ animated: Bool) {
super.viewWillAppear(animated)
// Make the navigation bar background clear
navigationController?.navigationBar.setBackgroundImage(UIImage(), for: .default)
navigationController?.navigationBar.shadowImage = UIImage()
navigationController?.navigationBar.isTranslucent = true
}
override func viewWillDisappear(_ animated: Bool) {
super.viewWillDisappear(animated)
// Restore the navigation bar to default
navigationController?.navigationBar.setBackgroundImage(nil, for: .default)
navigationController?.navigationBar.shadowImage = nil
}
Swift 3 : extension for Transparent Navigation Bar
extension UINavigationBar {
func transparentNavigationBar() {
self.setBackgroundImage(UIImage(), for: .default)
self.shadowImage = UIImage()
self.isTranslucent = true
}
}
Swift 4.2 Solution: For transparent Background:
For General Approach:
override func viewDidLoad() {
super.viewDidLoad()
self.navigationController?.navigationBar.setBackgroundImage(UIImage(), for: UIBarMetrics.default)
self.navigationController?.navigationBar.shadowImage = UIImage()
self.navigationController?.navigationBar.isTranslucent = true
}
For Specific Object:
override func viewDidLoad() {
super.viewDidLoad()
navBar.setBackgroundImage(UIImage(), for: UIBarMetrics.default)
navBar.shadowImage = UIImage()
navBar.navigationBar.isTranslucent = true
}
Hope it's useful.
I had been working on this, and I was facing a problem using the responses provided here by different users. Problem was a white box behind my NavigationBar transparent image on iOS 13+
My solution is this one
if #available(iOS 13, *) {
navBar?.standardAppearance.backgroundColor = UIColor.clear
navBar?.standardAppearance.backgroundEffect = nil
navBar?.standardAppearance.shadowImage = UIImage()
navBar?.standardAppearance.shadowColor = .clear
navBar?.standardAppearance.backgroundImage = UIImage()
}
Update
thanks to #TMin
If you use a tableView/CollectionView with this you will notice a 1 point shadow appears when you scroll. Add navBar?.scrollEdgeAppearance = nil to get ride of this shadow.
Hope this helps anyone with same problem
I was able to accomplish this in swift this way:
let navBarAppearance = UINavigationBar.appearance()
let colorImage = UIImage.imageFromColor(UIColor.morselPink(), frame: CGRectMake(0, 0, 340, 64))
navBarAppearance.setBackgroundImage(colorImage, forBarMetrics: .Default)
where i created the following utility method in a UIColor category:
imageFromColor(color: UIColor, frame: CGRect) -> UIImage {
UIGraphicsBeginImageContextWithOptions(frame.size, false, 0)
color.setFill()
UIRectFill(frame)
let image = UIGraphicsGetImageFromCurrentImageContext()
UIGraphicsEndImageContext()
return image
}
What it worked for me:
let bar:UINavigationBar! = self.navigationController?.navigationBar
self.title = "Whatever..."
bar.setBackgroundImage(UIImage(), forBarMetrics: UIBarMetrics.Default)
bar.shadowImage = UIImage()
bar.alpha = 0.0
Set the background property of your navigationBar, e.g.
navigationController?.navigationBar.backgroundColor = UIColor(red: 1.0, green: 0.0, blue: 0.0, alpha: 0.5)
(You may have to change that a bit if you don't have a navigation controller, but that should give you an idea of what to do.)
Also make sure that the view below actually extends under the bar.
If you want to be able to do this programmatically in swift 4 while staying on the same view,
if change {
navigationController?.navigationBar.isTranslucent = false
self.navigationController?.navigationBar.backgroundColor = UIColor(displayP3Red: 255/255, green: 206/255, blue: 24/255, alpha: 1)
navigationController?.navigationBar.barTintColor = UIColor(displayP3Red: 255/255, green: 206/255, blue: 24/255, alpha: 1)
} else {
navigationController?.navigationBar.isTranslucent = true
navigationController?.navigationBar.setBackgroundImage(backgroundImage, for: .default)
navigationController?.navigationBar.backgroundColor = .clear
navigationController?.navigationBar.barTintColor = .clear
}
One important thing to remember though is to click this button in your storyboard. I had an issue with a jumping display for a long time. Make sureyou set this:
Then when you change the translucency of the navigation bar it will not cause the views to jump as the views extend all the way to the top, regardless of the visiblity of the navigation bar.
Add this in your did load
self.navigationController?.navigationBar.setBackgroundImage(UIImage(), for: .default)
self.navigationController?.navigationBar.shadowImage = UIImage()
self.navigationController?.navigationBar.backgroundColor = UIColor(red: 1, green: 1, blue: 1, alpha: 0.0)
//adjust alpha according to your need 0 is transparent 1 is solid
For those looking for OBJC solution, to be added in App Delegate didFinishLaunchingWithOptions method:
[[UINavigationBar appearance] setBackgroundImage:[UIImage new] forBarMetrics:UIBarMetricsDefault];
[UINavigationBar appearance].shadowImage = [UIImage new];
[UINavigationBar appearance].backgroundColor = [UIColor clearColor];
[UINavigationBar appearance].translucent = YES;
Try this, it works for me if you also need to support ios7, it is based on the transparency of UItoolBar:
[self.navigationController.navigationBar setBackgroundImage:[UIImage new]
forBarMetrics:UIBarMetricsDefault];
self.navigationController.navigationBar.shadowImage = [UIImage new];
self.navigationController.navigationBar.translucent = YES;
self.navigationController.view.backgroundColor = [UIColor clearColor];
UIToolbar* blurredView = [[UIToolbar alloc] initWithFrame:self.navigationController.navigationBar.bounds];
[blurredView setBarStyle:UIBarStyleBlack];
[blurredView setBarTintColor:[UIColor redColor]];
[self.navigationController.navigationBar insertSubview:blurredView atIndex:0];
iOS 13.0+ introduced UINavigationBarAppearance because of which, this problem occurs on iOS 13.0+
Use this to solve.
Change Navigation Bar Appearance
Use UINavigationBarAppearance and UIBarButtonItemAppearance to change the appearance of the navigation bar.
// Make the navigation bar's title with red text.
if #available(iOS 13, *) {
let appearance = UINavigationBarAppearance()
appearance.configureWithOpaqueBackground()
appearance.backgroundColor = UIColor.systemRed
appearance.titleTextAttributes = [.foregroundColor: UIColor.lightText] // With a red background, make the title more readable.
navigationItem.standardAppearance = appearance
navigationItem.scrollEdgeAppearance = appearance
navigationItem.compactAppearance = appearance // For iPhone small navigation bar in landscape.
}
Utility method which you call by passing navigationController and color which you like to set on navigation bar. For transparent you can use clearColor of UIColor class.
For objective c -
+ (void)setNavigationBarColor:(UINavigationController *)navigationController
color:(UIColor*) color {
[navigationController setNavigationBarHidden:false animated:false];
[navigationController.navigationBar setBackgroundImage:[UIImage new] forBarMetrics:UIBarMetricsDefault];
[navigationController.navigationBar setShadowImage:[UIImage new]];
[navigationController.navigationBar setTranslucent:true];
[navigationController.view setBackgroundColor:color];
[navigationController.navigationBar setBackgroundColor:color];
}
For Swift 3.0 -
class func setNavigationBarColor(navigationController : UINavigationController?,
color : UIColor) {
navigationController?.setNavigationBarHidden(false, animated: false)
navigationController?.navigationBar .setBackgroundImage(UIImage(), forBarMetrics: UIBarMetrics.Default)
navigationController?.navigationBar.shadowImage = UIImage()
navigationController?.navigationBar.translucent = true
navigationController?.view.backgroundColor = color
navigationController?.navigationBar.backgroundColor = color
}
Write these two lines:
navigationController?.navigationBar.isTranslucent = true
navigationController?.navigationBar.backgroundColor = .clear
Worked for me in iOS 13
None of the answers here fully worked for me. This makes the navigation bar fully transparent - tested on iOS 14 and iOS 11 (Objective C):
[self.navigationController.navigationBar setBackgroundImage:[UIImage new] forBarMetrics:UIBarMetricsDefault];
self.navigationController.navigationBar.shadowImage = [UIImage new];
self.navigationController.navigationBar.translucent = YES;
self.navigationController.navigationBar.backgroundColor = [UIColor clearColor];
Anyone looking for a iOS 15+ working version, this is what worked for me, as the old techniques with setBackgroundImage/shadowImage were not working anymore.
To se it transparent:
func setTransparent() {
backgroundColor = .clear
isTranslucent = true
standardAppearance.shadowColor = .clear
standardAppearance.backgroundColor = .clear
standardAppearance.backgroundEffect = nil
scrollEdgeAppearance = standardAppearance
}
To remove transparency:
func removeTransparent() {
setBackgroundImage(nil, for: .default)
shadowImage = nil
backgroundColor = .white
isTranslucent = false
let appearance = UINavigationBarAppearance()
appearance.configureWithOpaqueBackground()
standardAppearance = appearance
scrollEdgeAppearance = standardAppearance
}
My implementation of navigation bar configuration as translucent and switching to default state for iOS 15 and older versions:
extension UINavigationBar {
static let defaultBackgroundColor = UIColor.red
static let defaultTintColor = UIColor.white
func setTranslucent(tintColor: UIColor, titleColor: UIColor) {
if #available(iOS 15, *) {
let appearance = UINavigationBarAppearance()
appearance.configureWithTransparentBackground()
appearance.titleTextAttributes = [.foregroundColor: titleColor]
standardAppearance = appearance
scrollEdgeAppearance = appearance
} else {
titleTextAttributes = [.foregroundColor: titleColor]
setBackgroundImage(UIImage(), for: UIBarMetrics.default)
shadowImage = UIImage()
}
isTranslucent = true
self.tintColor = tintColor
}
func setDefaultState() {
isTranslucent = false
clipsToBounds = false
if #available(iOS 15, *) {
let appearance = UINavigationBarAppearance()
appearance.configureWithOpaqueBackground()
appearance.backgroundColor = UINavigationBar.defaultBackgroundColor
appearance.titleTextAttributes = [.foregroundColor: UINavigationBar.defaultTintColor]
UINavigationBar.appearance().standardAppearance = appearance
UINavigationBar.appearance().scrollEdgeAppearance = appearance
} else {
setBackgroundImage(UIImage(), for: UIBarPosition.any, barMetrics: UIBarMetrics.defaultPrompt)
shadowImage = UIImage()
barTintColor = UINavigationBar.defaultBackgroundColor
titleTextAttributes = [.foregroundColor: UINavigationBar.defaultTintColor]
}
tintColor = UINavigationBar.defaultTintColor
}
}
This will defiantly work for swift 4/5 users.
func setUpNavBar(){
navigationItem.title = "Flick"
navigationController?.navigationBar.shadowImage = UIImage()
self.navigationController?.navigationBar.setBackgroundImage(UIImage(), for: UIBarMetrics.default)
self.navigationController?.navigationBar.shadowImage = UIImage()
self.navigationController?.navigationBar.isTranslucent = true
self.navigationController?.view.backgroundColor = UIColor.clear
navigationController?.navigationBar.titleTextAttributes = [.foregroundColor: UIColor.white]
}
IOS15 Version
extension UIViewController {
func clearNavigationBar(clear: Bool) {
if clear {
let appearance = UINavigationBarAppearance()
appearance.configureWithTransparentBackground()
self.navigationController?.navigationBar.standardAppearance = appearance
self.navigationController?.navigationBar.scrollEdgeAppearance = appearance
} else {
let appearance = UINavigationBarAppearance()
appearance.configureWithOpaqueBackground()
self.navigationController?.navigationBar.standardAppearance = appearance
self.navigationController?.navigationBar.scrollEdgeAppearance = appearance
}
}
}
class ViewController: UIViewController {
override func viewWillAppear(_ animated: Bool) {
super.viewWillAppear(animated)
clearNavigationBar(clear: true)
}
override func viewWillDisappear(_ animated: Bool) {
super.viewWillDisappear(animated)
clearNavigationBar(clear: false)
}
}
For above all iOS version
if #available(iOS 15.0, *) {
let appearance = UINavigationBarAppearance()
appearance.configureWithOpaqueBackground()
appearance.backgroundImage = UIColor.clear.imageWithColor(width: UIScreen.main.bounds.size.width, height: 84)
appearance.shadowImage = UIImage()
appearance.titleTextAttributes = [NSAttributedString.Key.foregroundColor : UIColor.black ,NSAttributedString.Key.font : UIFont(name: "SF UI Display Semibold", size: 18) ?? UIFont()]
appearance.titlePositionAdjustment = UIOffset(horizontal: 0, vertical: 2)
self.navigationBar.standardAppearance = appearance
} else {
self.navigationBar.setBackgroundImage(UIImage(), for: UIBarMetrics.default)
self.navigationBar.shadowImage = UIImage()
self.navigationBar.titleTextAttributes = [NSAttributedString.Key.foregroundColor : UIColor.black ,NSAttributedString.Key.font : UIFont(name: "SF UI Display Semibold", size: 18) ?? UIFont()]
self.navigationBar.setTitleVerticalPositionAdjustment(2, for: UIBarMetrics.default)
}
func imageWithColor(width: CGFloat, height: CGFloat) -> UIImage {
let size = CGSize(width: width, height: height)
return UIGraphicsImageRenderer(size: size).image { rendererContext in
self.setFill()
rendererContext.fill(CGRect(origin: .zero, size: size))
}
}
Just add bellow code line inside your application delegate
UINavigationBar.appearance().setBackgroundImage(UIImage(), for: .default)
// Sets shadow (line below the bar) to a blank image
UINavigationBar.appearance().shadowImage = UIImage()
// Sets the translucent background color
UINavigationBar.appearance().backgroundColor = .clear
// Set translucent. (Default value is already true, so this can be removed if desired.)
UINavigationBar.appearance().isTranslucent = true
then override your custom nav bar inside your view controller and make sure to reset once it disappear

Resources