Custom NavigationBar change NavigationBar Size in iOS

Mazen Qp
2 min readFeb 3, 2022
BigNav

To use UIView as NavigationBar we need UINavigationController, and what we Will do is to Hide the UINavigationController Bar, in the ViewController that we want to change the NavigationBar Height to and Make it appear in the next viewController, this is the shortest explanation For what we About to do here, We are not going to go deep in how to create UINavigationController, So let’s do it.

First.

Create UIView

let navView: UIView = {
let view = UIView()
view.backgroundColor = .white
view.translatesAutoresizingMaskIntoConstraints = false
return view
}()
// this is a Shadow for our navView same one as you see in an normal // UINavigationController Barlet navshadow: UIView = {
let view = UIView()
view.backgroundColor = UIColor(red: 229, green: 229, blue: 229, a: 1.0)
view.translatesAutoresizingMaskIntoConstraints = false
return view
}()

Then add this View as a Subview and set its Constraint in viewDidLoad()

override func viewDidLoad() {
super.viewDidLoad()
// And if you want to use your thump to go back rather than pressing // UINavigationController back button use this hereself.navigationController?.interactivePopGestureRecognizer?.delegate = selfview.addSubview(navView)
view.addSubview(navshadow)
setupLayout()}func setupLayout() {navView.topAnchor.constraint(equalTo: view.safeAreaLayoutGuide.topAnchor).isActive = truenavView.leadingAnchor.constraint(equalTo: view.leadingAnchor).isActive = truenavView.trailingAnchor.constraint(equalTo: view.trailingAnchor).isActive = true// Here we Are Changing the hight of the NavViewnavView.heightAnchor.constraint(equalToConstant: 70).isActive = truenavshadow.topAnchor.constraint(equalTo: navView.bottomAnchor).isActive = truenavshadow.leadingAnchor.constraint(equalTo: view.leadingAnchor).isActive = truenavshadow.trailingAnchor.constraint(equalTo: view.trailingAnchor).isActive = truenavshadow.heightAnchor.constraint(equalToConstant: 1).isActive = true}

And then we need to Hide the NavigationBar as i Mentioned before, and we are going to do that in viewWillAppear Method, and also we have to Hide it again when ever we went back to the First ViewController.

In your First ViewController Write these Two Lines of code

override func viewWillAppear(_ animated: Bool) {
super.viewWillAppear(animated)
self.navigationController?.setNavigationBarHidden(true, animated: animated)}override func viewWillDisappear(_ animated: Bool) {
super.viewWillDisappear(animated)
self.navigationController?.setNavigationBarHidden(false, animated: animated)}

Note: you have to call (self) otherwise this Hiding will effect all your navbars throgh your app if you are using tabbar for example

that’s it, now every thing else that you need to add to the New NavBar that we have now just call this.

navView.addSubview()

--

--