I'm trying to create a translucent tab and navigation bar using my custom colors however nothing I try enables the transparency. I've looked online and most of them say the translucent boolean is set to true by default however even when I set it as well the bars still stay opaque.
UINavigationBar.appearance().barTintColor = UIColor.blueColor()
UINavigationBar.appearance().tintColor = UIColor.yellowColor()
UINavigationBar.appearance().translucent = true
UITabBar.appearance().tintColor = UIColor.yellowColor()
UITabBar.appearance().barTintColor = UIColor.blueColor()
UITabBar.appearance().translucent = true
Yes I've also tried using alpha values.
Try setting the background colour on the window in applicationDidFinishLaunching
application.window.backgroundColor = [UIColor redColor];
Related
I'm trying to use the new navigationBar's large title feature on iOS 11.
However, after I added the following line:
self.navigationController?.navigationBar.prefersLargeTitles = true
I found that the navigationBar background color changed to black.
So I set background color again manually:
self.navigationController?.setBackgroundColor(UIColor(hexString: 0xFF7E79))
However, I found that the statusBar background color didn't change:
After I set up the background color of statusBar through this code:
guard let statusBar = UIApplication.shared.value(forKeyPath: "statusBarWindow.statusBar") as? UIView else { return
statusBar.backgroundColor = UIColor(hexString: 0xFF7E79)
It gives me an ugly 1px black line like this between the statusBar and the navigationBar:
So what is the correct way to set the background color of navigationBar?
The correct way to set the background color of the UINavigationBar is to use the barTintColor property.
self.navigationController?.navigationBar.barTintColor = .red
You may notice that the color you set can be a little faded. As noted in the documentation:
This color is made translucent by default unless you set the isTranslucent property to false.
See the barTintColor reference on developer.apple.com
I have a very specific issue. When I set the background barTintColor to my blue, it's too light. Nothing I do seems to make it 100% accurate.
So I changed the code to set the nav bar background to 100% black. Using the OS X app SIP to analyze the color, or just setting the view to black as well, it's pretty obvious the color is very dark gray, but not black.
What is making the tint color screw up? As it stands, the blue I need and what the nav bar is showing are not the same.
navigationController?.navigationBar.setBackgroundImage(UIImage.imageFromColor(UIColor.black), for: .default)
navigationController?.navigationBar.shadowImage = UIImage()
navigationController?.navigationBar.barStyle = .blackOpaque
navigationController?.navigationBar.isOpaque = true
navigationController?.navigationBar.barTintColor = UIColor.black
Also in a blank project, fresh, same issue.
The key is to set isTranslucent to false.
let navigationBar = navigationController?.navigationBar
navigationBar?.barTintColor = .black
navigationBar?.isTranslucent = false
I want to remove the bottom border from UINavigationBar, but I don't know how to remove it.
Actually, that is the shadow of the navigation bar.
To get rid of it, just set it to an empty image:
navigationController.navigationBar.shadowImage = UIImage()
Note: You must set it to an empty UIImage(); nil won't work for some reason.
You need to set a custom shadow image to show instead of the default one. Note: a custom background image must also be set.
navController.navigationBar.barTintColor = .blue //set your color
navController.navigationBar.isTranslucent = false
navController.navigationBar.setBackgroundImage(UIImage(), for: .default)
navController.navigationBar.shadowImage = UIImage()
you can do this
self.navigationController.navigationBar.layer.borderWidth = 0.0;
OR
you can give border color same as navigation bar background color
self.navigationController.navigationBar.layer.borderColor = [UIColor colorWithRed:<#(CGFloat)#> green:<#(CGFloat)#> blue:<#(CGFloat)#> alpha:<#(CGFloat)#>];
For iOS 11 you can use the (deprecated) Black Translucent Navigation bar style with a custom bar tint.
First of all,
I've seen all the answers at How to make UINavigationBar Transparent in IOS 8? Transparent UINavigationBar and Make UINavigationBar transparent.
They just don't seem to work for me.
My regular view controller (before trying to make the navigation bar transparent) doesn't have any issues:
I'm using (tried both in viewDidLoad and viewWillAppear:):
[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];
I'm getting this:
Gray status bar background, completely white navigation bar which doesn't blend with the status bar, and then the view starts. All the 'solutions' at the other questions' answers' yield the same result for me.
I've also tried setting self.edgesForExtendedLayout = UIRectEdgeNone; or self.edgesForExtendedLayout = UIRectEdgeAll; but that also didn't have any impact.
How can I make my navigation bar transparent without messing up everything?
UPDATE: Following Warif Akhand Rishi's answer, I've changed self.navigationController.view.backgroundColor = [UIColor clearColor]; to self.navigationController.navigationBar.backgroundColor = [UIColor clearColor];, now I'm getting a gray, unified status/navbar, but still not transparent:
UPDATE 2: I've hooked up the view debugger, and that gray background seems to come from deep down from the roots of view hierarchy, and my view's content is not extending up. I've tried self.edgesForExtendedLayout = UIRectEdgeAll; again with the latest code but still no avail:
swift 4 transparent nav bar:
(be sure view extends behind nav bar to show through, otherwise will just be black)
navigationController?.navigationBar.isTranslucent = true
navigationController?.navigationBar.setBackgroundImage(UIImage(), for: .default)
navigationController?.navigationBar.shadowImage = UIImage() //remove pesky 1 pixel line
or just match navbar color to color of your current vc, but keep it opaque. with translucent set to false child views will line up with navbar instead of going under it.
navigationController?.navigationBar.isTranslucent = false
navigationController?.navigationBar.barTintColor = UIColor.yourColor
navigationController?.navigationBar.shadowImage = UIImage() //remove pesky 1 pixel line
Change your
self.navigationController.view.backgroundColor = [UIColor clearColor];
to this
self.navigationController.navigationBar.backgroundColor = [UIColor clearColor];
Okay, after struggling, I've solved the problem on my own. There was more than one problem. It wasn't about the extended edges, it was about the line self.navigationController.view.backgroundColor = [UIColor clearColor]; (which had to be self.navigationController.navigationBar.backgroundColor = [UIColor clearColor]; as Warif Akhand Rishi suggested) and also my table view's clip subviews property. I've changed that line and also turned off clipping of my table view and now it works as expected.
For iOS 13 and the UINavigationBarAppearance API:
let navAppearance = UINavigationBarAppearance()
navAppearance.configureWithTransparentBackground()
self.navigationItem.standardAppearance = navAppearance
Eliminate 5+ lines of shadow/background/color code!
I'm a little late to the party, but I recently needed to do the same thing and I found the following actually works best (because it removes all shadows and bleed-throughs you may have from something lower in the stack):
guard let navBar = navigationController?.navigationBar else { return }
navBar.barStyle = .black
navBar.setBackgroundImage(UIImage(), for: .default)
navBar.shadowImage = UIImage()
navBar.isTranslucent = true
navBar.isHidden = false
1.Your NavigationBar is white,not black.So you must have a view (a white view) under NavigationBar,which is the superview of your greyView.The transparent setting works,but you cann't see it ,because the fontcolor is white too.
2.So you have to update your greyView's constraints,so it can extends under navigationbar .And then you can see your white title.
3.Maybe you have to Change your statusBar's UIStatusBarStyle to default or lightcontent,I noticed the font color of statusBar is white too.
The below code works for me
self.navigationController?.navigationBar.setBackgroundImage(UIImage(), for: UIBarMetrics.default)
self.navigationController?.navigationBar.shadowImage = UIImage()
self.navigationController?.navigationBar.isTranslucent = true
self.navigationController?.view.backgroundColor = .clear
self.navigationController?.navigationBar.backgroundColor = .clear
Upgraded from Xcode 5 to 6 and now my search bar tint is black.
Tried to change it through storyboard right pane > "Bar Tint" to clear color, but it's still black.
Also tried programmatically:
[self.searchBar setTintColor:[UIColor clearColor]];
Still black :(
Any ideas?
The tintColor property on search bars, much like UINavigationBar, changes the color of the buttons, as well as changes the color of the blinking cursor, not the actual search bar background. What you want to use is the barTintColor property.
searchbar.barTintColor = [UIColor orangeColor];
searchbar.tintColor = [UIColor greenColor];
Produces the following ugly, yet informative, result:
If you want to have a completely transparent search bar, you need to set the background image as well:
searchbar.barTintColor = [UIColor clearColor];
searchbar.backgroundImage = [UIImage new];
EDIT: I would strongly advise against traversing and modifying the subviews of any UIKit object, as has been proposed in other answers. From Apple's documentation:
For complex views declared in UIKit and other system frameworks, any
subviews of the view are generally considered private and subject to
change at any time. Therefore, you should not attempt to retrieve or
modify subviews for these types of system-supplied views. If you do,
your code may break during a future system update.
https://developer.apple.com/documentation/uikit/uiview/1622614-subviews
I got to change it on iOS 9 using Swift 2.0 this way:
let image = UIImage()
searchBar.setBackgroundImage(image, forBarPosition: .Any, barMetrics: .Default)
searchBar.scopeBarBackgroundImage = image
On Swift 3:
Setting up the background of the searchBar to an empty image:
searchBar.setBackgroundImage(image, for: .any, barMetrics: .default)
searchBar.scopeBarBackgroundImage = image
for programmatically change search bar tint color :
if let textfield = searchBar.value(forKey: "searchField") as? UITextField {
textfield.textColor = #colorLiteral(red: 0.3921568627, green: 0.3921568627, blue: 0.3921568627, alpha: 1)
textfield.backgroundColor = #colorLiteral(red: 1, green: 1, blue: 1, alpha: 1)
}
for storyboard :
I've been seeing this problem as well on iOS8 / XCode 6. I did not get the search bar translucent. searchbar.barTintColor or searchbar.tintColor setting to clear color did not help or shows a black searchbar.
The only workaround i found was to set a translucent background png image (alpha=0.0) and setting searchbar.barTintColor to clear color.