如何解决如何为动画创建自己的三次贝塞尔曲线?就像CSS的“动画计时功能:三次贝塞尔曲线x1,y1,x2,y2”,
我正在学习三次方贝塞尔曲线,并尝试编写自己的三次方贝塞尔曲线函数以用于动画,这与css的用法类似。
根据wikipedia,三次贝塞尔曲线可以定义为
所以我创建了自己的函数 cubicBezier ,其中P0为(0,0),P1为(x1,y1),P2为(x2,y2),P3为(1,1) 。 我下面的函数根据输入的t在[0,1]之间的时间返回曲线上的一个点。
function cubicBezier(t,x1,y1,x2,y2)
return Vector2f(0,0) * (1 - t) * (1 - t) * (1 - t) + Vector2f(x1,y1) * 3 * (1 - t) * (1 - t) * t + Vector2f(x2,y2) * 3 * (1 - t) * t * t + Vector2f(1,1) * t * t * t
我对应该用于动画的三次贝塞尔函数的返回值的哪一部分感到困惑。
例如,如果要在转换X上设置“ myObj”动画,输入参数t是系统时间,则返回值是[0,1]内任意给定t处的vector2 point 我应该将哪个值插入translateX?
是基于t返回的 point.y 吗?我应该忽略返回的 point.x 吗? 如果是这样,您能给我解释 point.x 值何时对动画有用以及我应该如何使用它吗?
谢谢!
编辑:
在帖子中 When exactly does an ease animation reach its midpoint?
批准的答案解释了x和y的含义。
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。