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?
Join Stack Overflow to learn, share knowledge, and build your career.
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?
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
.
self.navigationController?.setNavigationBarHidden(velocity.y > 0, animated: true)
as I had only nav bars to take care of !
– GoodSp33d
Nov 8 '17 at 9:57
Easily to do this:
navigationController?.hidesBarsOnSwipe = true
you can try self.navigationController?.hidesBarsOnTap = true
in viewDidAppear also you can use hide on swipe.
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)
}
}
Thanks everyone, the way I went with was using AMScrollingController.
https://github.com/andreamazz/AMScrollingNavbar
It's updated for Swift 3
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
}
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
}
...
}
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)
}
Swift UI
extension UINavigationController {
override open func viewDidLoad() {
super.viewDidLoad()
hidesBarsOnSwipe = true
// other customizations
navigationBar.tintColor = .white
}
}
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;
}
}