madone11
madone11

Reputation: 31

How to show navigation bar on scroll iOS

I find a lot of resources on how to hide the navigation bar on scroll, but I would like to have the navigation bar hidden on start, and then appear when starting to scroll. Like this animation from Design+Code app: https://i.sstatic.net/qMSLl.jpg

Upvotes: 1

Views: 4202

Answers (2)

nikano
nikano

Reputation: 1248

Using the willBeginDragging and didEndDragging you can accomplish what you want. Here there is a simplified version of it, you may need to modify it a little bit to obtain the desired effect you want, but it is an starting point.

import UIKit

class ViewController: UIViewController {

    override func viewDidLoad() {
        super.viewDidLoad()

        navigationController?.setNavigationBarHidden(true, animated: false)

    }
}

extension ViewController: UIScrollViewDelegate {
    func scrollViewWillBeginDragging(_ scrollView: UIScrollView) {
        navigationController?.setNavigationBarHidden(false, animated: true)
    }

    func scrollViewDidEndDragging(_ scrollView: UIScrollView, willDecelerate decelerate: Bool) {
        navigationController?.setNavigationBarHidden(true, animated: true)
    }
}

Upvotes: 0

Rashed
Rashed

Reputation: 2425

You can use UIScrollViewDelegate for that.

Here is example code for hide navigation bar and tool bar with scroll:

import UIKit

class ViewController: UIViewController, UIScrollViewDelegate {

    @IBOutlet weak var toolBar: UIToolbar!
    @IBOutlet weak var webV: UIWebView!
    var lastOffsetY :CGFloat = 0
    override func viewDidLoad() {
        super.viewDidLoad()

        webV.scrollView.delegate = self
        let url = "http://apple.com"
        let requestURL = NSURL(string:url)
        let request = NSURLRequest(URL: requestURL!)
        webV.loadRequest(request)
    }

    //Delegate Methods
    func scrollViewWillBeginDragging(scrollView: UIScrollView){
        lastOffsetY = scrollView.contentOffset.y
    }

    func scrollViewWillBeginDecelerating(scrollView: UIScrollView){

        let hide = scrollView.contentOffset.y > self.lastOffsetY
        self.navigationController?.setNavigationBarHidden(hide, animated: true)
        toolBar.hidden = hide
    }
}

Upvotes: 1

Related Questions