SwiftUI Animation 的时序曲线创建

Question

连同预定义的动画曲线，这些是使用 timingcurve(::::duration:) 设置时序曲线的选项。 .
它的参数( c0x 、 c0y 、 c1x 、 c1y )的含义是什么？曲线是如何建立的？缺乏文档。

Answer 1

我只是根据我们得到的信息尽可能多地猜测。
从文档...static func timingCurve(_ c0x: Double, _ c0y: Double, _ c1x: Double, _ c1y: Double, duration: Double = 0.35) -> Animation看起来这四个数字实际上是一对 x, y 坐标。

c0 = (c0x, c0y)
c1 = (c1x, c1y)

我们也知道这将生成一条缓动曲线，该曲线将从时间 0、动画 %age 0 开始并在时间 1、动画 %age 100 结束。
所以......我猜这些参数是三次贝塞尔曲线的控制点。
我们将有四个控制点。

起点 (0, 0)

第一个参数 c0

第二个参数 c1

终点 (1, 1)

因此，您需要提供控制点来生成三次曲线，以描述您想要使用的时序曲线。
您可以使用本网站https://cubic-bezier.com/#.17,.67,.82,.38看看这些属性如何改变曲线。
作为一个基本示例，像“缓入缓出”这样持续时间为 1 秒的时序曲线将使用诸如...timingCurve(0.42, 0, 0.58, 1, duration: 1.0)希望有帮助。