Rahul Rawat
Rahul Rawat

Reputation: 11

How to animate a Custom View Right to Left and Left to Right using Swift

I have designed a view. Normally when I click on a button, this view will Show and Hide. Now I am trying to animate that View with Left to right and right to left. Below is my code but it is not working. kindly check it.

if(self.openedView) {
        self.openedView = false;
        UIView.animate(withDuration: 0.3, delay: 0.0, options: .curveEaseIn, animations: {() -> Void in



        }, completion: {(_ finished: Bool) -> Void in
        })

         shareMainView.isHidden = true;
    } else {
         self.openedView = true;
        UIView.animate(withDuration: 0.3, delay: 0.0, options: .curveEaseOut, animations: {() -> Void in
        }, completion: {(_ finished: Bool) -> Void in
            /*done*/
        })

        shareMainView.isHidden = false;
    }

shareMainView.isHidden = false; this is my view which will be opened and hidden with the animation.

Upvotes: 0

Views: 6349

Answers (3)

Rana Latifullah
Rana Latifullah

Reputation: 61

extension UIView {
  func comingFromRight(containerView: UIView) {
    let offset = CGPoint(x: containerView.frame.maxX, y: 0)
    let x: CGFloat = 0, y: CGFloat = 0
    self.transform = CGAffineTransform(translationX: offset.x + x, y: offset.y + y)
    self.isHidden = false
    UIView.animate(
        withDuration: 1, delay: 0, usingSpringWithDamping: 0.47, initialSpringVelocity: 3,
        options: .curveEaseOut, animations: {
            self.transform = .identity
            self.alpha = 1
    })

} } 

You can use it like:

anyView.comingFromRight(containerView: anyView.superview)

Upvotes: 3

Garima Saini
Garima Saini

Reputation: 173

In view did load :

shareMainView.frame = CGRectMake(_aview.frame.origin.x, _aview.frame.origin.y, 0, _aview.frame.size.height);

on button click :

if(self.openedView) {
        self.openedView = false;
        UIView.animate(withDuration: 0.3, delay: 0.0, options: .curveEaseIn, animations: {() -> Void in
        shareMainView.layoutIfNeeded()
        shareMainView.frame = CGRectMake(_aview.frame.origin.x, _aview.frame.origin.y, 200, _aview.frame.size.height);


        }, completion: {(_ finished: Bool) -> Void in
        })

         shareMainView.isHidden = true;
    } else {
         self.openedView = true;
        UIView.animate(withDuration: 0.3, delay: 0.0, options: .curveEaseOut, animations: {() -> Void in
        shareMainView.layoutIfNeeded()
        shareMainView.frame = CGRectMake(_aview.frame.origin.x, _aview.frame.origin.y, 0, _aview.frame.size.height);

        }, completion: {(_ finished: Bool) -> Void in
            /*done*/
        })

        shareMainView.isHidden = false;
    }

Width can be as much as you want to expand.For example i have user 200.In view did load it is 0 and then 200 while expanding and again 0 while collapsing. Hope it will help.

Upvotes: 0

Pramod Kumar
Pramod Kumar

Reputation: 2652

Brother according to your posted code you're neither changing the frame of your shareMainView nor any constraint of it. So try playing with frame of constraint like for open state set some width (like 150) and for close set width to 0.0 in animation block.

Don't forget to use shareMainView.layoutIfNeeded() at the last of code in animation and shareMainView.isHidden = false in completion block. It'll help to show the animation properly.

Upvotes: 0

Related Questions