Hide navigation bar without moving scrollView

Question

I have a viewController where am showing image for adding the zooming functionality I added the scrollView in viewController and inside of ScrollView I added ImageView everything is working fine expect of one thing, am hiding, and showing the bars (navigation bar + tab bar) on tap but when hiding them my imageView moves upside see the below images

See here's the image and the bars.

Here I just tapped on the view and bars got hidden but as you can see my imageView is also moved from its previous place, this is what I want to solve I don't want to move my imageView.

This is how am hiding my navigation bar:

     func tabBarIsVisible() ->Bool {
    return self.tabBarController?.tabBar.frame.origin.y < CGRectGetMaxY(self.view.frame)
}


func toggle(sender: AnyObject) {
    navigationController?.setNavigationBarHidden(navigationController?.navigationBarHidden == false, animated: true)
         setTabBarVisible(!tabBarIsVisible(), animated: true)

 }

any idea how can I hide and show the bars without affecting my other Views?

Answer 1

The problem is that you need to set the constraint of your imageView to your superView, not TopLayoutGuide or BottomLayoutGuide.

like so:

Then you can do something like this to make the it smootly with animation:

import UIKit

class ViewController: UIViewController {

    @IBOutlet var imageView: UIImageView!
    var barIsHidden = false
    var navigationBarHeight: CGFloat = 0
    var tabBarHeight: CGFloat = 0

    override func viewDidLoad() {
        super.viewDidLoad()
        let tapGesture = UITapGestureRecognizer(target: self, action: #selector(ViewController.hideAndShowBar))
        view.addGestureRecognizer(tapGesture)
        navigationBarHeight = (self.navigationController?.navigationBar.frame.size.height)!
        tabBarHeight = (self.tabBarController?.tabBar.frame.size.height)!
    }

    override func didReceiveMemoryWarning() {
        super.didReceiveMemoryWarning()
    }

    func hideAndShowBar() {
        print("tap!!")
        if barIsHidden == false {
            UIView.animateWithDuration(0.5, delay: 0.0, options: .CurveEaseOut, animations: {
                // fade animation
                self.navigationController?.navigationBar.alpha = 0.0
                self.tabBarController?.tabBar.alpha = 0.0
                // set height animation
                self.navigationController?.navigationBar.frame.size.height = 0.0
                self.tabBarController?.tabBar.frame.size.height = 0.0
                }, completion: { (_) in
                    self.barIsHidden = true
            })
        } else {
            UIView.animateWithDuration(0.5, delay: 0.0, options: .CurveEaseOut, animations: {
                // fade animation
                self.navigationController?.navigationBar.alpha = 1.0
                self.tabBarController?.tabBar.alpha = 1.0
                // set height animation
                self.navigationController?.navigationBar.frame.size.height = self.navigationBarHeight
                self.tabBarController?.tabBar.frame.size.height = self.tabBarHeight
                }, completion: { (_) in
                    self.barIsHidden = false
            })
        }
    }

}

Here is the result:

I have created an example project for you at: https://github.com/khuong291/Swift_Example_Series

You can see it at project 37

Hope this will help you.