UINavigationBar基础的使用总结

FrQi3.png
  • 设置导航栏字体属性
    func application(_ application: UIApplication, didFinishLaunchingWithOptions launchOptions: [UIApplicationLaunchOptionsKey: Any]?) -> Bool设置导航栏标题的文字属性:
        let nav = UINavigationBar.appearance()
        
        let shadow = NSShadow()
        shadow.shadowOffset = CGSize(width: 0, height: 0)
        let attributes = [NSForegroundColorAttributeName: UIColor.white,
                          NSFontAttributeName: UIFont.systemFont(ofSize: 16),
                          NSShadowAttributeName: shadow]
        nav.titleTextAttributes = attributes
  • 设置导航栏的背景色
 self.navigationController?.navigationBar.barTintColor = UIColor.red
屏幕快照 2017-08-18 上午10.35.00.png
  • 设置导航栏背景图片
self.navigationController?.navigationBar.setBackgroundImage(UIImage(named: "personalBackgroundImage"), for: .default)
屏幕快照 2017-08-18 上午10.44.26.png
  • 修改顶部状态栏的颜色

    效果图看, 设置背景色或者背景图之后, 状态栏依然是默认的黑色, 系统提供给了UIStatusBarStyleDefault和UIStatusBarStyleLightContent两种样式可供选择.

    (1)UIStatusBarStyleDefaul, 系统默认样式, 黑色内容用于浅色背景如黑色

    (2) UIStatusBarStyleLightContent, 白色内容, 用于系统深色背景.

    设置状态栏透明:

    (1)设置plist

    plist

    (2)在viewDidLoad中设置self.setNeedsStatusBarAppearanceUpdate()

    (3)添加代码:

    override var preferredStatusBarStyle: UIStatusBarStyle {
        return .lightContent
    }
    

    这段代码可能没有效果, 如果你的viewController在UINavigationController, 你需要在UINavigationController添加下面的代码:
    override var preferredStatusBarStyle: UIStatusBarStyle { return .lightContent }

    最终效果如图:


    屏幕快照 2017-08-18 上午11.09.30.png

    通过以上设置后, 同一个navigation里面的viewController的statusbar的颜色是一样的要想每一个viewController里面的都不一样, 我们可以在自定义的navigationController里面重写下面方法:

    • 1
    override var preferredStatusBarStyle: UIStatusBarStyle {
        let topVC = self.topViewController
        return (topVC?.preferredStatusBarStyle)!
    }
    
    • 2 在改变状态栏的viewController里面重写这个方法
    override var preferredStatusBarStyle: UIStatusBarStyle {
        return .lightContent
    }
    
  • 设置返回按钮的图标及字体的颜色

    self.navigationController?.navigationBar.tintColor = UIColor.white

    屏幕快照 2017-08-18 上午11.20.47.png

    然而实际开发中返回按钮往往是我们自定义的所以我们会重写UINavigationControllerfunc pushViewController(_ viewController: UIViewController, animated: Bool)如下:

    override func pushViewController(_ viewController: UIViewController, animated: Bool) {
        if self.childViewControllers.count > 0 {
            let backBtn = UIButton()
            backBtn.setImage(UIImage(named: "back_white"), for: .normal)
            backBtn.sizeToFit()
            backBtn.addTarget(self, action: #selector(back), for: .touchUpInside)
            viewController.navigationItem.leftBarButtonItem = UIBarButtonItem(customView: backBtn)
            viewController.hidesBottomBarWhenPushed = true
        }
        super.pushViewController(viewController, animated: true)
    }
    
    屏幕快照 2017-08-18 上午11.24.07.png
  • 设置导航栏底部的线条

    //隐藏掉底部线条
    self.navigationController?.navigationBar.setBackgroundImage(UIImage(named: "personalBackgroundImage"), for: .any, barMetrics: .default)
    self.navigationController?.navigationBar.shadowImage = UIImage()
    

    也可以通过扩展的方式隐藏掉底部线:

extension UINavigationBar {
    func hideBottomHairline() {
        self.hairlineImageView?.isHidden = true
    }
    func showBottomHairline() {
        self.hairlineImageView?.isHidden = false
    }
}
extension UIView {
    fileprivate var hairlineImageView: UIImageView? {
        return hairlineImageView(in: self)
    }
    fileprivate func hairlineImageView(in view: UIView) -> UIImageView? {
        if let imageView = view as? UIImageView, imageView.bounds.height <= 1.0 {
            return imageView
        }
        
        for subview in view.subviews {
            if let imageView = self.hairlineImageView(in: subview) { return imageView }
        }
        
        return nil
    }
}

推荐阅读更多精彩内容