Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

pop out animation of UIView in swift

I am learning swift, I was successfully able to do popup animation of an UIView as below code but now i want to do reverse of it. i.e the way the UIView was animated should go back on a button click, Like the view is shrinking and then disappears.

popupView.isHidden = false
popupInnerView.isHidden = false
popupInnerView.transform = CGAffineTransform(scaleX: 0, y: 0)
UIView.animate(withDuration: 1, delay: 0, options: .curveLinear, animations: {
        self.popupView.alpha = 1.0;
        self.popupInnerView.transform = .identity
}, completion: nil)
like image 422
Uzair Dhada Avatar asked Dec 08 '22 15:12

Uzair Dhada


1 Answers

Check if this one works for you. I have bound the showing and hiding of popup to buttons but you can bind them to anything.

Popup showing and hiding

For this to work

  • Drag and drop a uiview(your popup) into dock of view controller (see picture) Popup inside dock
  • Make outlet of your uiview(popup) in your view controller. I am calling it popupView

For showing popup with Animation use the code

 @IBAction func btnShowPopupTapped(_ sender: UIButton) {

 popupView.center = view.center
 popupView.alpha = 1
 popupView.transform = CGAffineTransform(scaleX: 0.8, y: 1.2)

 self.view.addSubview(popupView)
 UIView.animate(withDuration: 0.5, delay: 0, usingSpringWithDamping: 0.5, initialSpringVelocity: 0, options: [],  animations: {
 //use if you want to darken the background
   //self.viewDim.alpha = 0.8
   //go back to original form
   self.popupView.transform = .identity
 })

}

And for hiding the popup

@IBAction func btnHideMeTapped(_ sender: Any) {

 UIView.animate(withDuration: 0.3, delay: 0, usingSpringWithDamping: 0.5, initialSpringVelocity: 0, options: [], animations: {
 //use if you wish to darken the background
   //self.viewDim.alpha = 0
   self.popupView.transform = CGAffineTransform(scaleX: 0.2, y: 0.2)

 }) { (success) in
   self.popupView.removeFromSuperview()

 }



}

Note: If you want to darken the background as in gif.

  • Drag and drop a uiview into your view heirarchy (view dim). see the picview Dim
  • pin to 0, 0 , 0 ,0 to the main view
  • set its background color to black
  • set is alpha to 0
  • uncomment the line (self.viewDim.alpha = 0.8) in "btnShowPopupTapped" Action
  • uncomment the line (self.viewDim.alpha = 0) in "btnHideMeTapped" Action

Let me know if this helps.

like image 79
Awais Fayyaz Avatar answered Jan 03 '23 13:01

Awais Fayyaz