为啥要在 CAKeyframeAnimation 上使用 `keyTimes`、`timingFunctions` 或 `timingFunction`？

Posted 2023-03-13

【中文标题】为啥要在 CAKeyframeAnimation 上使用 `keyTimes`、`timingFunctions` 或 `timingFunction`？

【英文标题】：Why ever use `keyTimes`, `timingFunctions` or `timingFunction` on CAKeyframeAnimation?为什么要在 CAKeyframeAnimation 上使用 `keyTimes`、`timingFunctions` 或 `timingFunction`？

【发布时间】：2013-12-09 14:00:35

【问题描述】：

使用自定义函数对值进行插值非常容易。但这是不好的做法吗？我应该（或另外）使用keyTimes、timingFunctions 或timingFunction 来向框架解释动画曲线吗？使用自定义动画曲线时，我真的不明白为什么要使用这些属性。我想把这件事做好。

这很好用。正如预期的那样，它使用自定义三次缓出动画曲线为视图位置设置动画：

CAKeyframeAnimation *anim = [CAKeyframeAnimation animationWithKeyPath:@"position.x"];
anim.duration = 5;
NSUInteger numberOfFrames = anim.duration * 60;

NSMutableArray *values = [NSMutableArray new];

for (int i = 0; i < numberOfFrames; i++)

    CGFloat linearProgress = (double) i / (double) numberOfFrames;
    CGPoint position = view.layer.position;
    position.x = 10 + (300 * CubicEaseOut(linearProgress));
    [values addObject:[NSValue valueWithCGPoint:position]];


anim.values = values;

[view.layer addAnimation:anim forKey:@"position"];

【问题讨论】：

我猜如果你不计算所有中间值并希望CAAnimation 类来处理插值，那么这有点意义吗？

【参考方案1】：

您的方法为动画添加了 300 个关键帧，以便 Core Animation 线性插值。有两个原因可能不会比使用更少的非线性插值关键帧来获得相同的结果更糟糕：（1）更多数据要发送到 CA，即更多数据要存储和读取每个动画帧； (2) 如果您想放慢动画速度，以便从中渲染超过 300 帧，则线性插值伪影可能会变得可见。

如果您只有一个 3s 动画，那么这些原因可能都不重要，但是例如如果您同时运行 100 个 10 秒动画，您可能会看到比使用更少关键帧时更差的性能。

【讨论】：

哇。这真的帮助我理解了。