transparent navigation bar ios

Question

I m creating an app and i ve browsed on the internet and i m wondering how they make this transparent navigationBar 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 navigationBar transparent like first image

User · Answer

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

User · Answer

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

User · Answer

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

User · Answer

Swift 3   extension for Transparent Navigation Bar  extension UINavigationBar       func transparentNavigationBar         self setBackgroundImage UIImage    for   default      self shadowImage   UIImage       self isTranslucent   true

User · Answer

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

User · Answer

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      Hope this helps anyone with same problem

User · Answer

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

User · Answer

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

User · Answer

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  - gt  UIImage     UIGraphicsBeginImageContextWithOptions frame size  false  0    color setFill     UIRectFill frame    let image   UIGraphicsGetImageFromCurrentImageContext     UIGraphicsEndImageContext     return image

User · Answer

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

User · Answer

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

User · Answer

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

User · Answer

You can apply Navigation Bar Image like below for Translucent  Objective-C   self navigationController navigationBar setBackgroundImage  UIImage new                       forBarMetrics UIBarMetricsDefault     UIImageNamed   quot transparent png quot  self navigationController navigationBar shadowImage    UIImage new      UIImageNamed   quot transparent png quot  self navigationController navigationBar translucent   YES  self navigationController view backgroundColor    UIColor clearColor    Swift 3  self navigationController  navigationBar setBackgroundImage UIImage    for   default    UIImage init named   quot transparent png quot   self navigationController  navigationBar shadowImage   UIImage   self navigationController  navigationBar isTranslucent   true self navigationController  view backgroundColor    clear

User · Answer

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

[ios] transparent navigation bar ios

Swift Solution

Examples related to ios

Examples related to iphone

Examples related to swift

Examples related to uinavigationbar