UIView appereance from bottom to top and vice versa(Core Animation)

XTL picture XTL · Feb 19, 2017 · Viewed 32.5k times · Source

My goal is to understand and implement feature via Core Animation.
I think it's not so hard,but unfortunately i don't know swift/Obj C and it's hard to understand native examples.


Visual implementation

So what exactly i want to do(few steps as shown on images):
1. Source
2. enter image description here
3. enter image description here
4. enter image description here

And the same steps to hide view(vice versa,from top to bottom) until this :

enter image description here

Also,i want to make this UIView more generic,i mean to put this UIView on my StoryBoard and put so constraints on AutoLayout(to support different device screens).

Any ideas? Thanks!

Answer

Gowtham Sooryaraj picture Gowtham Sooryaraj · Mar 27, 2018

You can use like this Extension

extension UIView{
    func animShow(){
        UIView.animate(withDuration: 2, delay: 0, options: [.curveEaseIn],
                       animations: {
                        self.center.y -= self.bounds.height
                        self.layoutIfNeeded()
        }, completion: nil)
        self.isHidden = false
    }
    func animHide(){
        UIView.animate(withDuration: 2, delay: 0, options: [.curveLinear],
                       animations: {
                        self.center.y += self.bounds.height
                        self.layoutIfNeeded()

        },  completion: {(_ completed: Bool) -> Void in
        self.isHidden = true
            })
    }
}