使UINavigationBar透明

如何创建UINavigationBar透明?虽然我希望它的栏项仍然可见。

140929 次浏览

你的意思是完全透明,还是使用照片应用程序中看到的半透明黑色?后者可以通过将其barStyle属性设置为UIBarStyleBlackTranslucent来实现。前……我不太确定。如果您希望其中的项仍然可见,您可能必须在栏的视图层次结构中进行一些挖掘,并删除包含其背景的视图。

这似乎很有效:

@implementation UINavigationBar (custom)
- (void)drawRect:(CGRect)rect {}
@end


navigationController.navigationBar.backgroundColor = [UIColor clearColor];

试试下面这段代码:

self.navigationController.navigationBar.translucent = YES;

我知道这个话题是旧的,但如果人们想知道如何在不重载drawRect方法的情况下完成。

这是你需要的:

self.navigationController.navigationBar.translucent = YES;
self.navigationController.navigationBar.opaque = YES;
self.navigationController.navigationBar.tintColor = [UIColor clearColor];
self.navigationController.navigationBar.backgroundColor = [UIColor clearColor];

在iOS5中,你可以这样做,使导航栏透明:

nav.navigationBar.translucent = YES; // Setting this slides the view up, underneath the nav bar (otherwise it'll appear black)
const float colorMask[6] = {222, 255, 222, 255, 222, 255};
UIImage *img = [[UIImage alloc] init];
UIImage *maskedImage = [UIImage imageWithCGImage: CGImageCreateWithMaskingColors(img.CGImage, colorMask)];


[nav.navigationBar setBackgroundImage:maskedImage forBarMetrics:UIBarMetricsDefault];
[img release];

如果有人想知道如何在iOS 7+中实现这一点,这里有一个解决方案(iOS 6也兼容)

在objective - c中

[self.navigationBar setBackgroundImage:[UIImage new]
forBarMetrics:UIBarMetricsDefault];
self.navigationBar.shadowImage = [UIImage new];
self.navigationBar.translucent = YES;

swift 3 (iOS 10)

self.navigationBar.setBackgroundImage(UIImage(), for: .default)
self.navigationBar.shadowImage = UIImage()
self.navigationBar.isTranslucent = true

在swift 2中

self.navigationBar.setBackgroundImage(UIImage(), forBarMetrics: .Default)
self.navigationBar.shadowImage = UIImage()
self.navigationBar.translucent = true

讨论

在导航栏上将translucent设置为YES就可以了,这是由于UINavigationBar文档中讨论的行为。我将在这里报告相关片段:

如果你在一个自定义背景图像不透明的导航栏上设置此属性为YES,导航栏将对该图像应用小于1.0的系统不透明度。

对于任何想在Swift 2.x中这样做的人:

self.navigationController?.navigationBar.setBackgroundImage(UIImage(), forBarMetrics: .Default)
self.navigationController?.navigationBar.shadowImage = UIImage()
self.navigationController?.navigationBar.translucent = true

或Swift 3.x:

self.navigationController?.navigationBar.setBackgroundImage(UIImage(), for: .default)
self.navigationController?.navigationBar.shadowImage = UIImage()
self.navigationController?.navigationBar.isTranslucent = true

IOS7:

self.navigationController.navigationBar.translucent = YES;
self.navigationController.navigationBar.shadowImage = [UIImage new];
self.navigationController.view.backgroundColor = [UIColor clearColor];
[self.navigationController.navigationBar setBackgroundImage:[UIImage new] forBarMetrics:UIBarMetricsDefault];
self.navigationController.navigationBar.backgroundColor = [UIColor clearColor];

下面的代码扩展了为这个线程选择的顶部答案,以消除底部边框并设置文本颜色:

  1. 这段代码的最后两行代码设置了透明度。我借用了这个线程的代码,它完美地工作!

  2. “clipsToBounds”属性是我发现的代码,它摆脱了底部边界或不透明设置(所以如果你决定使用纯白色/黑色/等。背景,仍然没有边境线)。

  3. “tintColor”行(第2编码行)设置我的后退按钮为浅灰色

  4. 我保留了barTintColor作为备份。我不知道为什么透明度不工作,但如果它不,我想我的bg白,因为我曾经有过它

    let navigationBarAppearace = UINavigationBar.appearance()
    navigationBarAppearace.tintColor = UIColor.lightGray
    navigationBarAppearace.barTintColor = UIColor.white
    navigationBarAppearace.clipsToBounds = true
    navigationBarAppearace.isTranslucent = true
    navigationBarAppearace.setBackgroundImage(UIImage(), for: .default)
    navigationBarAppearace.shadowImage = UIImage()
    

这适用于Swift 2.0。

navigationController!.navigationBar.setBackgroundImage(UIImage(), forBarMetrics: UIBarMetrics.Default)
navigationController!.navigationBar.shadowImage = UIImage()
navigationController!.navigationBar.translucent = true

另一种方式,为我工作是子类UINavigationBar和留下drawRect方法空!!

@IBDesignable class MONavigationBar: UINavigationBar {




// Only override drawRect: if you perform custom drawing.
// An empty implementation adversely affects performance during animation.
override func drawRect(rect: CGRect) {
// Drawing code
}}

c# / Xamarin解决方案

NavigationController.NavigationBar.SetBackgroundImage(new UIImage(), UIBarMetrics.Default);
NavigationController.NavigationBar.ShadowImage = new UIImage();
NavigationController.NavigationBar.Translucent = true;

对于Swift 3.0:

override func viewDidLoad() {
super.viewDidLoad()


navigationController?.navigationBar.setBackgroundImage(UIImage(), for: .default)
navigationController?.navigationBar.shadowImage = UIImage()
navigationController?.navigationBar.isTranslucent = true
}

在按照上面大家说的去做之后,也就是:

navigationController?.navigationBar.setBackgroundImage(UIImage(), forBarMetrics: .default)
navigationController?.navigationBar.shadowImage = UIImage()
navigationController!.navigationBar.isTranslucent = true

... 我的导航栏还是白色的。所以我加了这一行:

navigationController?.navigationBar.backgroundColor = .clear

... 果不其然!这似乎奏效了。

检查RRViewControllerExtension,它专门用于导航栏外观管理。

在你的项目中使用RRViewControllerExtension,你只需要覆盖

-(BOOL)prefersNavigationBarTransparent;

在你的视图控制器中。

导航栏透明

extension UINavigationBar {
var isTransperent: Bool {
get {
return false // Just to satisfy property
}
set {
if newValue {
self.shadowImage = UIImage()
self.isTranslucent = true
self.setBackgroundImage(UIImage(), for: .default)
} else {
self.shadowImage = UIImage()
self.isTranslucent = false
self.setBackgroundImage(nil, for: .default)
}
}
}
}

在Swift 4.2中

self.navigationController?.navigationBar.setBackgroundImage(UIImage(), for: .default)
self.navigationController?.navigationBar.shadowImage = UIImage()
self.navigationController?.navigationBar.isTranslucent = true

(在viewWillAppear中)然后在viewWillDisappear中,撤销它,put

self.navigationController?.navigationBar.shadowImage = nil
self.navigationController?.navigationBar.isTranslucent = false
如果你使用最新的测试版iOS 13.4和Xcode 11.4构建,接受的答案将不再有效。 我找到了另一种方法,也许这只是测试版软件中的一个错误,但我把它写在这里,以防

(5)迅速

import UIKit


class TransparentNavBar :UINavigationBar {
override func awakeFromNib() {
super.awakeFromNib()
self.setBackgroundImage(UIImage(), for: .default)
self.shadowImage = UIImage()
self.isTranslucent = true
self.backgroundColor = .clear
if #available(iOS 13.0, *) {
self.standardAppearance.backgroundColor = .clear
self.standardAppearance.backgroundEffect = .none
self.standardAppearance.shadowColor = .clear
}
}
}

这适用于Swift 5。

// Clear the background image.
navigationController?.navigationBar.setBackgroundImage(UIImage(), for: .default)


// Clear the shadow image.
navigationController?.navigationBar.shadowImage = UIImage()


// Ensure the navigation bar is translucent.
navigationController?.navigationBar.isTranslucent = true

解决方案- Swift 5 - iOS 13+

根据文档,在你的UIViewController子类中:

override func viewDidLoad()
{
super.viewDidLoad()
    

let appearance = UINavigationBarAppearance()
appearance.configureWithTransparentBackground()
//appearance.backgroundColor = UIColor.clear
    

navigationItem.compactAppearance = appearance
navigationItem.scrollEdgeAppearance = appearance
navigationItem.standardAppearance = appearance
    

//...
}

只是为了澄清,这使得UINavigationBar 完全透明的. c。栏按钮项仍然可见,并正常工作。

什么不起作用

override func viewDidLoad()
{
super.viewDidLoad()
    

navigationController?.navigationBar.isTranslucent = true
navigationController?.navigationBar.isOpaque = false


//...
}

这让我意识到我实际上不知道透明的半透明的 RIP之间的区别。

参考文献

https://developer.apple.com/documentation/uikit/uinavigationcontroller/customizing_your_app_s_navigation_bar

https://www.lexico.com/en/definition/transparent

https://www.lexico.com/en/definition/translucent

更新08/10/2021

在以我提供的方式设置外观后更改navigationItem栏按钮将重置外观,您必须再次执行此操作。