内置动画对象
Bezier-贝塞尔曲线插值
贝塞尔曲线插值对象及其函数
不相信自己的人总是在说谎
Bezier是一个基于三次贝塞尔曲线的插值对象,通过控制点可以创建自定义的动画曲线。
实例化方式
Bezier
含参实例化
- 描述:创建一个贝塞尔曲线插值实例。
- 参数:
start
:数值类型,起始值end
:数值类型,结束值x1
:数值类型,第一个控制点的x坐标(0-1)y1
:数值类型,第一个控制点的y坐标(0-1)x2
:数值类型,第二个控制点的x坐标(0-1)y2
:数值类型,第二个控制点的y坐标(0-1)transferTime
:长整型,过渡时间(毫秒)
- 调用示例:
预设曲线参数
常用的贝塞尔曲线预设值:
- ease: (0.25, 0.1, 0.25, 1.0)
- easeIn: (0.42, 0, 1.0, 1.0)
- easeOut: (0, 0, 0.58, 1.0)
- easeInOut: (0.42, 0, 0.58, 1.0)
函数
get()
- 获取当前插值计算的结果
- 参数:无
- 返回值:数值类型
- 说明:根据当前时间计算贝塞尔曲线上的对应值
- 调用示例:
reset()
- 重置插值器状态
- 参数:无
- 返回值:无
- 说明:重置计时器并清除反向状态,重新开始动画
- 调用示例:
reverse()
- 反转动画方向
- 参数:无
- 返回值:无
- 说明:将动画方向反转,从当前位置开始向起始值过渡
- 调用示例:
类型转换
Bezier对象支持以下类型转换:
- 数值:返回当前插值计算的结果
- 布尔值:当前值大于0时返回true,否则返回false
- 字符串:返回当前插值计算结果的字符串表示
Bezier对象支持数学运算,可以直接参与计算表达式。