I am using Navigation controller in my app. For my view controller, I used UINavigationItem and added UIBarButton items and title views.
I need to implement transparency to my Navigation Bar.
I have added the below code.
self.navigationController?.navigationBar.isTranslucent = true
let navAlpha = 0.7// Your appropriate calculation
let image = UIImage.imageFromColor(color: UIColor.red.withAlphaComponent(CGFloat(navAlpha)))
self.navigationController?.navigationBar.setBackgroundImage(image, for: UIBarMetrics.default)
self.navigationController?.navigationBar.barStyle = .default
The output of this is:
How do I make whole navigation bar including UINavigationItem transparent?
Add this code in first view Controller.
var navigationBarAppearace = UINavigationBar.appearance()
navigationBarAppearace.isTranslucent = true
let navAlpha = 0.7// Your appropriate calculation
let image = UIImage.imageFromColor(color:
UIColor.red.withAlphaComponent(CGFloat(navAlpha)))
navigationBarAppearace.setBackgroundImage(image, for: UIBarMetrics.default)
navigationBarAppearace.barStyle = .default
I think you could do this in storyboard. Set your Top Bar to be inferred navigation controller. and do this for navigation bar.
Try this
AppDelegate
UINavigationBar.appearance().setBackgroundImage(UIImage(), for: .default)
UINavigationBar.appearance().shadowImage = UIImage()
UINavigationBar.appearance().barTintColor = UIColor(red: 0.0, green: 0.0, blue: 0.0, alpha: 0.0)
UINavigationBar.appearance().titleTextAttributes = [
NSForegroundColorAttributeName: WHITE_COLOR]
UINavigationBar.appearance().tintColor = WHITE_COLOR
UINavigationBar.appearance().isTranslucent = true
To make the navigation bar completely transparent:
self.navigationController?.navigationBar.isTranslucent = true
self.navigationController?.navigationBar.setBackgroundImage(UIImage(), for: .default)
self.navigationController?.navigationBar.shadowImage = UIImage()
self.navigationController?.navigationBar.backgroundColor = UIColor.clear
I don't understand why did you add red image as the navigation bar's backgroundImage if you want to make it transparent.
Related
Dashboard is a UINavigationController as root view controller. I put some lines in AppDelegate to make it transparent:
let barAppearace = UIBarButtonItem.appearance()
barAppearace.setBackButtonTitlePositionAdjustment(UIOffsetMake(0, -400), forBarMetrics:UIBarMetrics.Default)
barAppearace.setTitleTextAttributes(["NSFontAttributeName":UIFont.customFontOfSize(14, style: FontName.kHelveticaNeue)], forState: .Normal)
barAppearace.tintColor = UIColor.whiteColor()
UINavigationBar.appearance().backgroundColor = UIColor.clearColor()
UINavigationBar.appearance().barTintColor = UIColor.clearColor()
UINavigationBar.appearance().titleTextAttributes = [NSForegroundColorAttributeName: UIColor.whiteColor()]
UINavigationBar.appearance().tintColor = UIColor.whiteColor()
UINavigationBar.appearance().shadowImage = UIImage()
UINavigationBar.appearance().setBackgroundImage(UIImage(), forBarMetrics: .Default)
when I push a view controller from Dashboard, pushed view controller navigation bar color changes to black.
I want same appearance as Dashboard navigationbar. I have gone through already answered question. But still no luck.
For complete transparent Navigation bar
self.navigationController.navigationBar.setBackgroundImage(UIImage(), for: .default)
self.navigationController.navigationBar.shadowImage = UIImage()
self.navigationController.navigationBar.isTranslucent = true
self.navigationController.navigationBar.backgroundColor = .clear
self.navigationController.view.backgroundColor = .clear
You can even use this code for a base class and inherit it for transparent navigation bar.
let barAppearace = UIBarButtonItem.appearance()
barAppearace.setBackButtonTitlePositionAdjustment(UIOffsetMake(0, -400), forBarMetrics:UIBarMetrics.Default)
barAppearace.setTitleTextAttributes(["NSFontAttributeName":UIFont.customFontOfSize(14, style: FontName.kHelveticaNeue)], forState: .Normal)
barAppearace.tintColor = UIColor.whiteColor()
UINavigationBar.appearance().backgroundColor = UIColor.clearColor()
UINavigationBar.appearance().barTintColor = UIColor.clearColor()
UINavigationBar.appearance().titleTextAttributes = [NSForegroundColorAttributeName: UIColor.whiteColor()]
UINavigationBar.appearance().tintColor = UIColor.whiteColor()
UINavigationBar.appearance().shadowImage = UIImage()
UINavigationBar.appearance().setBackgroundImage(UIImage(), forBarMetrics: .Default)
I put a background image in view controller and applied below constraints to it. I achieved the desired result:
backgroundImage.centerX = view.CenterX
backgroundImage.centerY = view.CenterY
backgroundImage.height = view.height
backgroundImage.width = view.width
* view: Managed by viewcontroller property view.
* backgroundImage: subview added to view with above constraints.
I have default preferences for uinavigationbar:
UINavigationBar.appearance().barTintColor = .red
UINavigationBar.appearance().titleTextAttributes = [ NSAttributedStringKey.foregroundColor:#colorLiteral(red: 1, green: 0.99997437, blue: 0.9999912977, alpha: 1)]
if #available(iOS 11.0, *) {
UINavigationBar.appearance().largeTitleTextAttributes = [ NSAttributedStringKey.foregroundColor:#colorLiteral(red: 1, green: 0.99997437, blue: 0.9999912977, alpha: 1)]
}
UINavigationBar.appearance().isTranslucent = false
UINavigationBar.appearance().tintColor = #colorLiteral(red: 1, green: 0.99997437, blue: 0.9999912977, alpha: 1)
Structure: UINaviagtionController -> PostsTableViewController -> PostTableViewController.
I want to have large navigation bar on PostsViewController (with opaque background color) and transparent navigation bar on PostViewController.
In PostTableViewController i add:
self.navigationController?.navigationBar.backgroundColor = UIColor.clear
self.navigationController?.navigationBar.barTintColor = .clear
self.automaticallyAdjustsScrollViewInsets = false
//self.navigationController?.navigationBar.setBackgroundImage(UIImage(), for: UIBarMetrics.default)
//self.navigationController?.navigationBar.shadowImage = UIImage()
if #available(iOS 11.0, *) {
print("asd")
self.tableView.insetsContentViewsToSafeArea = false
self.tableView.contentInsetAdjustmentBehavior = .never
} else {
self.automaticallyAdjustsScrollViewInsets = false
}
Navigation bar is BLACK. I dont understand how make it transparent...
UPDATE:
git hub repository: https://github.com/Mazorati/testnavbar
i set isTranslucent = true, but large navigation becomes also transparent. Only default navigation is ok.
But i want navigationbar color to be opaque, so:
self.navigationController?.view.backgroundColor = .red
self.navigationController?.navigationBar.isTranslucent = false
self.navigationController?.navigationBar.setBackgroundImage(UIImage(), for: UIBarMetrics.default)
self.navigationController?.navigationBar.shadowImage = UIImage()
self.navigationController?.navigationBar.prefersLargeTitles = true
self.navigationItem.largeTitleDisplayMode = .automatic
As the result:
3D layers:
have you tried changing it to translucent?
self.navigationController?.navigationBar.isTranslucent = true
UPDATE:
You must remember that the navigation bar belongs to the UINavigationController which holds the views inside it, so that when you change it in one it changes for all.
The solution would be to change it to translucent in the second view controller's viewWillAppear method and change it to not translucent in the viewDidDissapear method. Play with the viewWill and viewDid appear methods until you find the right one for your needs.
Try this, this make your navigation bar transparent.
let img = UIImage()
navigationController?.navigationBar.shadowImage = img
navigationController?.navigationBar.setBackgroundImage(img, for: .default)
Completely stumped. I've looked all over and implemented every solution I could find. I can't seem to get the navigation bar to become transparent.
When trying to set the background color, I just get a black bar at the top. Same as if I try to set the background images. I've tried all of these and all of there many variations.
self.navigationController?.navigationBar.setBackgroundImage(UIImage(), for: .default)
self.navigationController?.navigationBar.shadowImage = UIImage()
self.navigationController?.navigationBar.backgroundColor = UIColor.clear
I'm using it in
viewWillAppear() and in an animation when scrolling. The navigation bar is transparent, and then as you scroll navigation bar gets a white background with gray text.
func scrollViewDidScroll(_ scrollView: UIScrollView) {
self.navigationController?.navigationBar.barStyle = .default
let offset = self.tableView.contentOffset.y
if offset > 250.0 {
self.navigationController?.navigationBar.titleTextAttributes = [NSForegroundColorAttributeName: UIColor.darkGray]
self.navigationController?.navigationBar.topItem?.title = spot!.Name
self.navigationController?.navigationBar.isTranslucent = false
self.navigationController?.navigationBar.tintColor = UIColor.darkGray
self.navigationController?.isNavigationBarHidden = false
self.navigationController?.navigationBar.barTintColor = UIColor.white
}
else {
self.navigationController?.navigationBar.topItem?.title = nil
self.navigationController?.navigationBar.isTranslucent = true
self.navigationController?.isNavigationBarHidden = false
self.navigationController?.navigationBar.tintColor = UIColor.white
self.navigationController?.navigationBar.barTintColor = UIColor.white
self.navigationController?.navigationBar.shadowImage = UIImage()
}
}
I've also tried setting the background color to white, and changing the alpha = 0, but that doesn't work either.
Any help greatly appreciated.
This is because the window's background color is black and
You should set window?.backgroundColor = UIColor.white
in the AppDelegate application didFinishLauchingWithOptions method
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()
}
I try to set my navigation bar transparent regarding a image below this, something like the following image :
I tried the solution in transparent navigation bar ios but I don't get the above result, I get only the icon on the left but without any color in the navigation bar, completely transparent. But if I set a background color the transparency disappears at all.
There is any way to set a color in the navigation bar and make it transparent??
Thanks in advance.
just checked on the 8.1 simulator and got very similar result to your picture
let bar:UINavigationBar! = self.navigationController?.navigationBar
bar.setBackgroundImage(UIImage(), forBarMetrics: UIBarMetrics.Default)
bar.shadowImage = UIImage()
bar.backgroundColor = UIColor(red: 0.0, green: 0.3, blue: 0.5, alpha: 0.3)
main point here is background color with alpha.
Check attached image, maybe I missed something?
To set this style globally, use the UIAppearance APIs. In AppDelegate's application:didFinishLaunchingWithOptions: add the following code:
// 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.3, blue: 0.5, alpha: 0.3)
// Set translucent. (Default value is already true, so this can be removed if desired.)
UINavigationBar.appearance().translucent = true
Have you tried setting the navigationBar's alpha property? In your root view controller to the navigation controller...
[self.navigationController.navigationBar setBackgroundColor:[UIColor greenColor]];
[self.navigationController.navigationBar setAlpha:0.3f];
self.navigationController?.navigationBar.setBackgroundImage(UIImage(), for: .default)
self.navigationController?.navigationBar.shadowImage = UIImage()
self.navigationController?.navigationBar.backgroundColor = UIColor.clear
self.navigationController?.navigationBar.isTranslucent = true
If the above code is not working then set edgesForExtendedLayout to all.
self.edgesForExtendedLayout = .all