10.3_设置keyTimes控制每帧节奏

关键帧动画中，keyTimes 属性允许你精确控制动画每一帧的播放节奏。通过设置 keyTimes，你可以让动画在某些关键帧之间快速播放，而在另一些关键帧之间缓慢播放，从而实现更复杂、更生动的动画效果。🎉

理解 keyTimes 属性

keyTimes 是一个 NSNumber 对象的数组，每个 NSNumber 对象代表一个关键帧的时间点，取值范围是 0.0 到 1.0。数组中的元素必须按升序排列。keyTimes 的数量应该与 values 或 path 属性中定义的关键帧数量相同。

• 时间点: 每个 keyTime 值表示动画总时长的一个百分比。例如，0.0 表示动画的开始，1.0 表示动画的结束，0.5 表示动画的中间点。
• 节奏控制: 通过调整 keyTimes 的值，你可以控制动画在不同关键帧之间的速度。如果两个相邻的 keyTime 值之间的差值较小，动画在该段时间内播放速度较快；反之，如果差值较大，动画播放速度较慢。

如何使用 keyTimes

1. 创建 CAKeyframeAnimation 实例: 首先，你需要创建一个 CAKeyframeAnimation 实例，并设置其 keyPath 属性，指定要动画的属性。
2. 设置 values 或 path 属性: 接下来，你需要设置 values 属性（用于属性动画）或 path 属性（用于路径动画），定义动画的关键帧。
3. 设置 keyTimes 属性: 创建一个 NSNumber 对象的数组，并将其赋值给 keyTimes 属性。确保 keyTimes 的数量与 values 或 path 中定义的关键帧数量相同。
4. 添加到图层: 最后，将动画添加到图层上，动画就会按照你设置的节奏播放。

示例：自定义动画节奏

假设你想要创建一个颜色变化的动画，从红色变为绿色，再变为蓝色。你希望动画在红色到绿色之间快速变化，而在绿色到蓝色之间缓慢变化。你可以这样设置 keyTimes：

let animation = CAKeyframeAnimation(keyPath: "backgroundColor")
animation.values = [UIColor.red.cgColor, UIColor.green.cgColor, UIColor.blue.cgColor]
animation.keyTimes = [0.0, 0.2, 1.0] // 红色到绿色快速，绿色到蓝色缓慢
animation.duration = 2.0
layer.add(animation, forKey: "backgroundColorAnimation")

在这个例子中，keyTimes 的值为 [0.0, 0.2, 1.0]。这意味着：

• 动画在 0% 到 20% 的时间内，颜色从红色变为绿色。
• 动画在 20% 到 100% 的时间内，颜色从绿色变为蓝色。

由于红色到绿色之间的时间间隔较短 (0.2 - 0.0 = 0.2)，因此颜色变化速度较快。而绿色到蓝色之间的时间间隔较长 (1.0 - 0.2 = 0.8)，因此颜色变化速度较慢。

注意事项

• keyTimes 数组中的元素必须按升序排列，否则动画可能无法正常播放。
• keyTimes 的数量必须与 values 或 path 中定义的关键帧数量相同，否则动画的行为将是未定义的。
• 如果你没有设置 keyTimes 属性，动画将以匀速播放。

通过灵活运用 keyTimes 属性，你可以创建出各种各样具有节奏感的动画效果，让你的应用更加生动有趣。🚀 记住，实践是最好的老师，多尝试不同的 keyTimes 值，你就能掌握动画节奏控制的精髓！