Animate UIImage in UIImageView Up & Down (Like it&

问题:

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 thanks so much!!!

回答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.

回答2:

For Swift 3 and Swift 4:

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")

回答3:

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
];

回答4:

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