How to hide the navigation bar and toolbar as scroll down? Swift (like myBridge app)

Question

I want to hide a toolbar and nav bar as I scroll down a page. And return it as I scroll up. How is this possible?

How would I go about detecting the drag? Do I use pan gesture or is this down with the scrollview?

Answer 1

Try this simple approach: Tested in Swift 3

    func scrollViewWillEndDragging(_ scrollView: UIScrollView, withVelocity velocity: CGPoint, targetContentOffset: UnsafeMutablePointer<CGPoint>) {

    if(velocity.y>0) {
        //Code will work without the animation block.I am using animation block incase if you want to set any delay to it.
        UIView.animate(withDuration: 2.5, delay: 0, options: UIViewAnimationOptions(), animations: { 
            self.navigationController?.setNavigationBarHidden(true, animated: true) 
            self.navigationController?.setToolbarHidden(true, animated: true)
            print("Hide")
        }, completion: nil)

    } else {
        UIView.animate(withDuration: 2.5, delay: 0, options: UIViewAnimationOptions(), animations: { 
            self.navigationController?.setNavigationBarHidden(false, animated: true)
            self.navigationController?.setToolbarHidden(false, animated: true)
            print("Unhide")
        }, completion: nil)    
      }
   }

Output: Updated

Note: If you passing any data from this VC to another VC that embedded with navigationController.You may need to unhide the NavigationBar.

Answer 2

Easily to do this:

navigationController?.hidesBarsOnSwipe = true

Answer 3

In my opinion the proper way to handle navigation bar in Tableview as follows. This would applicable if we have section header in Tableview.

func scrollViewWillBeginDecelerating(_ scrollView: UIScrollView) {
   if scrollView.panGestureRecognizer.translation(in: scrollView).y < 0 {
      navigationController?.setNavigationBarHidden(true, animated: true)

   } else {
      navigationController?.setNavigationBarHidden(false, animated: true)
   }
}

Answer 4

you can try self.navigationController?.hidesBarsOnTap = true in viewDidAppear also you can use hide on swipe.

Answer 5

Thanks everyone, the way I went with was using AMScrollingController.

https://github.com/andreamazz/AMScrollingNavbar

It's updated for Swift 3

Answer 6

Swift 5 Xcode 10.3

override func viewWillAppear(_ animated: Bool) {
    super.viewWillAppear(animated)
    navigationController?.hidesBarsOnSwipe = true
  }
override func viewWillDisappear(_ animated: Bool) {
    super.viewWillDisappear(animated)
    navigationController?.hidesBarsOnSwipe = false
  }

Answer 7

Here is very good option for that

Easily hide and show a view controller's navigationBar/tabBar as a user scrolls https://github.com/tristanhimmelman/HidingNavigationBar

import HidingNavigationBar

class MyViewController: UIViewController, UITableViewDataSource, UITableViewDelegate {

    var hidingNavBarManager: HidingNavigationBarManager?
    @IBOutlet weak var tableView: UITableView!

    override func viewDidLoad() {
        super.viewDidLoad()

        hidingNavBarManager = HidingNavigationBarManager(viewController: self, scrollView: tableView)
    }

    override func viewWillAppear(animated: Bool) {
        super.viewWillAppear(animated)

        hidingNavBarManager?.viewWillAppear(animated)
    }

    override func viewDidLayoutSubviews() {
        super.viewDidLayoutSubviews()

        hidingNavBarManager?.viewDidLayoutSubviews()
    }

    override func viewWillDisappear(animated: Bool) {
        super.viewWillDisappear(animated)

        hidingNavBarManager?.viewWillDisappear(animated)
    }

    //// TableView datasoure and delegate

    func scrollViewShouldScrollToTop(scrollView: UIScrollView) -> Bool {
        hidingNavBarManager?.shouldScrollToTop()

        return true
    }

    ...
}

Answer 8

Swift UI

extension UINavigationController {
    override open func viewDidLoad() {
        super.viewDidLoad()
    hidesBarsOnSwipe = true
    // other customizations
    navigationBar.tintColor = .white
 }
}

Answer 9

I implemented this in my scrollview, as I was using components other than UITableView or UICollectionView, not sure if it works for you, but it's working perfectly for me:

func scrollViewDidScroll(_ scrollView: UIScrollView) {
    let totalTop = (UIApplication.shared.statusBarFrame.size.height ?? 0) + (self.navigationController?.navigationBar.frame.height ?? 0)
    let shouldHideNavBar = scrollView.contentOffset.y > -(totalTop - 20) // 20 is an arbitrary number I added to compensate for some of scrolling
    navigationController?.setNavigationBarHidden(shouldHideNavBar, animated: true)
}

Answer 10

You can use these lines of code :

- (void)scrollViewDidScroll: (UIScrollView *)scroll {
    // UITableView only moves in one direction, y axis
    CGFloat currentOffset = scroll.contentOffset.y;
    CGFloat maximumOffset = scroll.contentSize.height - scroll.frame.size.height;

    // Change 10.0 to adjust the distance from bottom
    if (maximumOffset - currentOffset <= 10.0) {
        self.navigationController?.hidden = YES;
    }
    else{
        self.navigationController?.hidden = NO;
    }
}