Animate UIImage in UIImageView Up & Down (Like it's hovering) Loop

Question

Hello I have an image that I\'d like to move up and down (Up 10 pixels and down 10 pixels) so that my image appears to be hovering. How can I do this with simple animation thank

Answer 1

You could use Core Animation to animate the position of the views layer. If you configure the animation to be additive you won't have to bother calculating the new absolute position, just the change (relative position).

CABasicAnimation *hover = [CABasicAnimation animationWithKeyPath:@"position"];
hover.additive = YES; // fromValue and toValue will be relative instead of absolute values
hover.fromValue = [NSValue valueWithCGPoint:CGPointZero];
hover.toValue = [NSValue valueWithCGPoint:CGPointMake(0.0, -10.0)]; // y increases downwards on iOS
hover.autoreverses = YES; // Animate back to normal afterwards
hover.duration = 0.2; // The duration for one part of the animation (0.2 up and 0.2 down)
hover.repeatCount = INFINITY; // The number of times the animation should repeat
[myView.layer addAnimation:hover forKey:@"myHoverAnimation"];

Since this is using Core Animation you will need to add QuartzCore.framework and #import <QuartzCore/QuartzCore.h> into your code.

Answer 2

Try this:

CGRect frm_up = imageView.frame;
frm_up.origin.y -= 10;

[UIView animateWithDuration:0.5
    delay:0.0
    options:UIViewAnimationOptionAutoreverse | UIViewAnimationOptionRepeats
    animations:^{
        imageView.frame = frm_up;
    }
    completion:NULL
];

Answer 3

For such a task, it will be better to place an image in a sublayer of UIView, and then animate that sublayer frame. This tutorial could give you some idea: http://www.raywenderlich.com/2502/introduction-to-calayers-tutorial

Answer 4

For Swift 3, Swift 4 and Swift 5:

let hover = CABasicAnimation(keyPath: "position")
    
hover.isAdditive = true
hover.fromValue = NSValue(cgPoint: CGPoint.zero)
hover.toValue = NSValue(cgPoint: CGPoint(x: 0.0, y: 100.0))
hover.autoreverses = true
hover.duration = 2
hover.repeatCount = Float.infinity
    
myView.layer.add(hover, forKey: "myHoverAnimation")