UIView Animation in Swift3

Question

I'm trying to move a UIImageView to top, bottom, left and right. Animation should be 4 four times. Center image move towards top, then left position and right position. How can I achieve this using UIAnimation swift 3?

UIView.animate(withDuration: 0.1, 
               delay:0, 
               animations: {}, 
               completion: {completion in})

How to move image to top, left, right and bottom using animation?

You can animate the center of UIImageView to your preferred place — Mannopson, Mar 03 '17 at 07:20

score 2 · Answer 1 · answered Mar 03 '17 at 07:42

You should use a keyframe animation for this, as it allows you to specify the order for the animations. Below is a basic example:

let animationDuration = 2.0
let position: CGFloat = 50.0
let viewToAnimate = UIImageView()

UIView.animateKeyframes(withDuration: animationDuration, delay: 0.0, options: .calculationModeLinear, animations: {
    UIView.addKeyframe(withRelativeStartTime: 0, relativeDuration: 1/3, animations: {
        viewToAnimate.frame.origin.y = viewToAnimate.frame.origin.y + position
    })
    UIView.addKeyframe(withRelativeStartTime: 1/4, relativeDuration: 1/4, animations: {
        viewToAnimate.frame.origin.y = viewToAnimate.frame.origin.y - (position * 2)
    })
    UIView.addKeyframe(withRelativeStartTime: 2/4, relativeDuration: 1/4, animations: {
        viewToAnimate.frame.origin.x = viewToAnimate.frame.origin.x - position
    })
    UIView.addKeyframe(withRelativeStartTime: 3/4, relativeDuration: 1/4, animations: {
        viewToAnimate.frame.origin.x = viewToAnimate.frame.origin.x + (position * 2)
    })
}, completion: { completed in

})

score 0 · Answer 2 · answered Mar 03 '17 at 07:20

UIView.animate(withDuration: 1, delay:0, animations: {
        //top
        self.imageView.frame.origin.y = self.imageView.frame.origin.y - 100
    }, completion: {completion in
        UIView.animate(withDuration: 1, delay:0, animations: {
            //bottom
            self.imageView.frame.origin.y = self.imageView.frame.origin.y + 100
        }, completion: {completion in
            UIView.animate(withDuration: 1, delay:0, animations: {
                //left
                self.imageView.frame.origin.x = self.imageView.frame.origin.x - 100

            }, completion: {completion in
                UIView.animate(withDuration: 1, delay:0, animations: {

                }, completion: {completion in
                    //right
                    self.imageView.frame.origin.x = self.imageView.frame.origin.x + 100
                })
            })
        })

    })

score 0 · Answer 3 · answered Mar 03 '17 at 07:28

UIView.animate(withDuration: 1, delay:0, animations: {
        //top
        self.tempVW.frame.origin.y = self.tempVW.frame.origin.y - 100
    }, completion: {completion in
        UIView.animate(withDuration: 1, delay:0, animations: {
            //left
            self.tempVW.frame.origin.x = self.tempVW.frame.origin.x - 100

        }, completion: {completion in
            UIView.animate(withDuration: 1, delay:0, animations: {
                //bottom
                self.tempVW.frame.origin.y = self.tempVW.frame.origin.y + 100

            }, completion: {completion in
                UIView.animate(withDuration: 1, delay:0, animations: {                        //right
                     self.tempVW.frame.origin.x = self.tempVW.frame.origin.x + 100
                }, completion: {completion in


                })
            })
        })

    })

UIView Animation in Swift3

3 Answers3