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

  然而实际开发中返回按钮往往是我们自定义的所以我们会重写UINavigationController的func 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    }}

原著是一个有趣的人,若有侵权,请通知删除