Ios UIView动画曲线减速使用UIViewAnimationOptionCurveEaseOut

我试图找出在动画发生时如何改变动画的速度。 非常感谢您的帮助

例如，我有一个对象（image1），我想从一端移动到另一端。我已经实现了

UIViewAnimationOptionCurveEaseOut

以使动画快速开始，然后在结束时变慢，问题是速度从快到慢的变化几乎不明显，有人能帮我弄清楚如何使动画的结尾比默认的

UIViewAnimationOptionCurveEaseOut慢得多吗这里是我正在使用的代码示例

UIImageView *image1 = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"theImage.png"]];

image1.frame = CGRectMake(0, 300, 50, 50);

[UIView animateWithDuration:1.0f
                      delay:0.0f
                    options:  UIViewAnimationOptionCurveEaseOut
                 animations:^(void) {
                     image1.frame = CGRectMake(700, 300, 50, 50);
                 }
                 completion:NULL];



通过在图像视图的图层特性（CALayer）上使用自定义计时功能（CAMediaTimingFunction）以及关键帧（CAKeyframeAnimation），可以实现这一点。



您需要知道的其他重要概念是贝塞尔曲线、值、关键时间和控制点。


您要做的第一件事是配置动画。本例将使图像视图快速上升，然后在离开屏幕时减慢

CAKeyframeAnimation *animation = [CAKeyframeAnimation animationWithKeyPath:@"position.y"];
animation.duration             = 2;
animation.repeatCount          = 0;
animation.removedOnCompletion  = NO;
animation.autoreverses         = NO;
animation.fillMode             = kCAFillModeForwards;

NSMutableArray *values = [[NSMutableArray alloc] init];
NSMutableArray *timings = [[NSMutableArray alloc] init];
NSMutableArray *keytimes = [[NSMutableArray alloc] init];

这是现在最棘手的部分。这三个阵列稍后将添加到动画中，并一起形成速度曲线！进入值的第一个值将表示开始位置。请记住，Calayer是从1到1的网格系统。所以我想把imageView放在中心线上

[values addObject:[NSNumber numberWithFloat:self.imageView.center.y]];

时间安排是最难理解的部分。它与贝塞尔曲线中的控制点有关。你可以进入photoshop获取精确的点或估计点。但我发现这几点有助于更好地缓解

[timings addObject:[CAMediaTimingFunction functionWithControlPoints:0.1 :0.34 :0.0 :0.0]];
[keytimes addObject:[NSNumber numberWithFloat:0]];

这是目的地。（您需要n-1个计时函数。n是值或键时间的数量。应该有n个值和键时间）。我只是选择了屏幕外的某个地方

[values addObject:[NSNumber numberWithFloat:-self.view.bounds.size.height]];
[keytimes addObject:[NSNumber numberWithFloat:2]];

animation.values = values;
animation.timingFunctions = timings;
animation.keyTimes = keytimes;

[self.imageView.layer addAnimation:animation forKey@"Animate"];