如何创buildiphone的摇摆图标效果？
我想在我的应用程序中来回晃动图像，类似于iPhone图标在按下时摆动的方式。 什么是最好的方式来做到这一点？
这是我第一次尝试不使用animationGIF的animation。 我认为这个想法是稍微旋转图像来创造摇摆的效果。 我看过使用CABasicAnimation和CAKeyframeAnimation。 CABasicAnimation每次重复都会产生一个抖动，因为它跳转到from位置，并且不会内插回来。 CAKeyframeAnimation似乎是解决scheme，除了我不能得到它的工作。 我一定会错过一些东西。 这是我的代码使用CAKeyframeAnimation（不起作用）：
NSString *keypath = @"wobbleImage"; CAKeyframeAnimation *animation = [CAKeyframeAnimation animationWithKeyPath:keypath]; animation.duration = 1.0f; animation.delegate = self; animation.repeatCount = 5; CGFloat wobbleAngle = 0.0872664626f; NSValue *initial = [NSValue valueWithCATransform3D:CATransform3DMakeRotation(0.0f, 0.0f, 0.0f, 1.0f)]; NSValue *middle = [NSValue valueWithCATransform3D:CATransform3DMakeRotation(wobbleAngle, 0.0f, 0.0f, 1.0f)]; NSValue *final = [NSValue valueWithCATransform3D:CATransform3DMakeRotation(-wobbleAngle, 0.0f, 0.0f, 1.0f)]; animation.values = [NSArray arrayWithObjects:initial, middle, final, nil]; [imageView.layer addAnimation:animation forKey:keypath]; 或者可能有一个完全简单的解决scheme，我只是想念。 欣赏任何指针。 谢谢！
简单的方法来做到这一点：
#define RADIANS(degrees) (((degrees) * M_PI) / 180.0) CGAffineTransform leftWobble = CGAffineTransformRotate(CGAffineTransformIdentity, RADIANS(-5.0)); CGAffineTransform rightWobble = CGAffineTransformRotate(CGAffineTransformIdentity, RADIANS(5.0)); itemView.transform = leftWobble; // starting point [UIView beginAnimations:@"wobble" context:itemView]; [UIView setAnimationRepeatAutoreverses:YES]; // important [UIView setAnimationRepeatCount:10]; [UIView setAnimationDuration:0.25]; [UIView setAnimationDelegate:self]; [UIView setAnimationDidStopSelector:@selector(wobbleEnded:finished:context:)]; itemView.transform = rightWobble; // end here & auto-reverse [UIView commitAnimations]; ... - (void) wobbleEnded:(NSString *)animationID finished:(NSNumber *)finished context:(void *)context { if ([finished boolValue]) { UIView* item = (UIView *)context; item.transform = CGAffineTransformIdentity; } }
可能要玩的时间和angular度，但这应该让你开始。
编辑：我编辑的响应添加代码，把项目回到原来的状态时完成。 另外，请注意，您可以使用beginAnimations上下文值将任何内容传递给start / stop方法。 在这种情况下，它是摇摆的对象本身，所以你不必依赖特定的Ivars，并且该方法可以用于任何通用的基于UIView的对象（即文本标签，图像等）
Ramin的答案非常好，但是从OS4开始，在一个简单的函数中使用animateWithDuration也可以达到同样的效果。
（改编他的未来谷歌的例子）
#define RADIANS(degrees) (((degrees) * M_PI) / 180.0) - (void)startWobble { itemView.transform = CGAffineTransformRotate(CGAffineTransformIdentity, RADIANS(-5)); [UIView animateWithDuration:0.25 delay:0.0 options:(UIViewAnimationOptionAllowUserInteraction | UIViewAnimationOptionRepeat | UIViewAnimationOptionAutoreverse) animations:^ { itemView.transform = CGAffineTransformRotate(CGAffineTransformIdentity, RADIANS(5)); } completion:NULL ]; } - (void)stopWobble { [UIView animateWithDuration:0.25 delay:0.0 options:(UIViewAnimationOptionAllowUserInteraction | UIViewAnimationOptionBeginFromCurrentState | UIViewAnimationOptionCurveLinear) animations:^ { itemView.transform = CGAffineTransformIdentity; } completion:NULL ]; }
你应该使用CAKeyframeAnimation来制作更stream畅的animation。
+ (void) animationKeyFramed: (CALayer *) layer delegate: (id) object forKey: (NSString *) key { CAKeyframeAnimation *animation; animation = [CAKeyframeAnimation animationWithKeyPath:@"transform.rotation.z"]; animation.duration = 0.4; animation.cumulative = YES; animation.repeatCount = 2; animation.values = [NSArray arrayWithObjects: [NSNumber numberWithFloat: 0.0], [NSNumber numberWithFloat: RADIANS(-9.0)], [NSNumber numberWithFloat: 0.0], [NSNumber numberWithFloat: RADIANS(9.0)], [NSNumber numberWithFloat: 0.0], nil]; animation.fillMode = kCAFillModeForwards; animation.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionLinear]; animation.removedOnCompletion = NO; animation.delegate = object; [layer addAnimation:animation forKey:key]; }
我写了一个示例应用程序，试图复制主屏幕摆动和图标移动： iPhone示例代码：瓷砖
我知道的最简单的方法是使用核心animation。 基本上，你创build一个核心animation块，然后做一个旋转变换和设置和重复计数。 核心animation然后照顾一切需要做这个摇摆的效果。
要启动一个核心animation块，只需要：
[UIView beginAnimations:@"any string as animationID" context:self]; [UIView setAnimationRepeatCount:10]; // rotate [UIView commitAnimations];
未经testing。 但是，也可能是你也必须这样做：
[UIView setAnimationBeginsFromCurrentState:YES];
AFAIK setAnimationRepeatCount将具有animation完成，撤消，完成，撤消，完成，撤消，完成…的次数，如您指定的次数。 所以你可能要先旋转到左边没有重复计数，然后从这一点开始摇摆重复计数。 完成后，您可能需要旋转回身份转换（=不应用旋转和缩放）。
您可以通过设置animation委托来链接animation
[UIView setAnimationDelegate:self]
接着
[UIView setAnimationDidStopSelector:@selector(myMethod:finished:context:)];
一旦animation停止，该方法将被调用。 有关如何实现在animation停止时将被调用的方法，请参阅UIView类文档。 基本上，在该方法中，您将执行下一步（即回旋或其他任何操作），并使用新的animation块，但具有相同的上下文和animationID，然后（如果需要）指定另一个didStopSelector。
更新：
你可能想看看：
[UIView setAnimationRepeatAutoreverses:YES];
这会自动地来回摆动。
您可以使用CAKeyframeAnimation创build一个没有无限的摆动效果，如下所示：
CGFloat degrees = 8.0; CAKeyframeAnimation *animation = [CAKeyframeAnimation animationWithKeyPath:@"transform.rotation.z"]; animation.duration = 0.6; animation.cumulative = YES; animation.repeatCount = 1; animation.values = @[@0.0, @RADIANS(-degrees) * 0.25, @0.0, @RADIANS(degrees) * 0.5, @0.0, @RADIANS(-degrees), @0.0, @RADIANS(degrees), @0.0, @RADIANS(-degrees) * 0.5, @0.0, @RADIANS(degrees) * 0.25, @0.0]; animation.fillMode = kCAFillModeForwards; animation.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionLinear]; animation.removedOnCompletion = YES; [self.layer addAnimation:animation forKey:@"wobble"];
对于最近遇到这个post的人，并希望在Swift中也这样做，这是我的翻译：
func smoothJiggle() { let degrees: CGFloat = 5.0 let animation = CAKeyframeAnimation(keyPath: "transform.rotation.z") animation.duration = 0.6 animation.cumulative = true animation.repeatCount = Float.infinity animation.values = [0.0, degreesToRadians(-degrees) * 0.25, 0.0, degreesToRadians(degrees) * 0.5, 0.0, degreesToRadians(-degrees), 0.0, degreesToRadians(degrees), 0.0, degreesToRadians(-degrees) * 0.5, 0.0, degreesToRadians(degrees) * 0.25, 0.0] animation.fillMode = kCAFillModeForwards; animation.timingFunction = CAMediaTimingFunction(name: kCAMediaTimingFunctionLinear) animation.removedOnCompletion = true layer.addAnimation(animation, forKey: "wobble") } func stopJiggling() { jiggling = false self.layer.removeAllAnimations() self.transform = CGAffineTransformIdentity self.layer.anchorPoint = CGPointMake(0.5, 0.5) }
晚会到了晚会 我通常使用阻尼弹簧（iOS7和更新版本）。 在迅速它看起来像：
sender.transform = CGAffineTransformMakeScale(1.2, 1.2) UIView.animateWithDuration(0.30, delay: 0.0, usingSpringWithDamping: 0.3, initialSpringVelocity: 0.3, options: UIViewAnimationOptions.CurveEaseInOut, animations: { () -> Void in sender.transform = CGAffineTransformMakeScale(1, 1) }) { (Bool) -> Void in //Do stuff when animation is finished }
您可以通过调整initialSpringVelocity和SpringWithDamping来调整效果
基于EsbenB的回答，但更新了Swift 3和轮换：
sender.transform = CGAffineTransform(rotationAngle: 12.0 * .pi / 180.0) UIView.animate(withDuration: 0.60, delay: 0.0, usingSpringWithDamping: 0.3, initialSpringVelocity: 0.3, options: .curveEaseInOut, animations: { () -> Void in sender.transform = CGAffineTransform(rotationAngle: 0.0) }, completion: nil)
那么Ramin给出的代码工作的很好。但是，如果你使用tabbar应用程序，并移动到下一个标签项目，然后再回到以前的标签项目，你会看到你的看法已经移动到左侧，每次。所以最好的做法是你使用ViewWillAppear方法。
- (void)viewWillAppear:(BOOL)animated { UIView* item = self.view; item.transform = CGAffineTransformIdentity; }
所以每次加载视图，你都会在正确的位置find你的animation，并且也使用这个方法。
[UIView setAnimationDidStopSelector:@selector(myMethod:finished:context:)];
Swift 3
func startWiggling() { deleteButton.isHidden = false guard contentView.layer.animation(forKey: "wiggle") == nil else { return } guard contentView.layer.animation(forKey: "bounce") == nil else { return } let angle = 0.04 let wiggle = CAKeyframeAnimation(keyPath: "transform.rotation.z") wiggle.values = [-angle, angle] wiggle.autoreverses = true wiggle.duration = randomInterval(0.1, variance: 0.025) wiggle.repeatCount = Float.infinity contentView.layer.add(wiggle, forKey: "wiggle") let bounce = CAKeyframeAnimation(keyPath: "transform.translation.y") bounce.values = [4.0, 0.0] bounce.autoreverses = true bounce.duration = randomInterval(0.12, variance: 0.025) bounce.repeatCount = Float.infinity contentView.layer.add(bounce, forKey: "bounce") } func stopWiggling() { deleteButton.isHidden = true contentView.layer.removeAllAnimations() }
