According to BindingX Doc,
In particular, the cubicBezier function is used to customize the Bessel curve, which is defined as follows:
- cubicBezier(t, begin, changeBy, duration, controlX1, controlY1, controlX2, controlY2)
- input parameter:
t: time of animation execution
begin: attribute starting value
changeBy: attribute change value (end - start)
duration: duration of animation
controlX1: x coordinates of The first control point
controlY1: y coordinates of The first control point
controlX2: x coordinates of The second control point
controlY2: y coordinates of The second control point
- return:
the cubicBezier function's last 4 parameters are controlX1, controlY1, controlX2, controlY2.
In this animation implementation, we get the return value of formatBezier function, and join the result with ',' so that we pass it as the last 4 parameters for the cubicBezier function.
|
let bezier = formatBezier(prop.easing || easing); |
|
let expression = bezier && bezier.length === 4 ? |
|
`cubicBezier(t-${prop.delay},${start},${prop.end - start},${prop.duration},${bezier.join(',')})` |
|
: `${prop.easing || easing}(t-${prop.delay},${start},${prop.end - start},${prop.duration})`; |
However, the formatBezier function returns [m[1], m[4], m[3], m[4]] -- in my opinion, it means controlX1, controlY2, controlX2, controlY2.
|
export default function formatBezier(easing) { |
|
if (easing) { |
|
let m = easing.match(/cubicBezier\((.+),(.+),(.+),(.+)\)/); |
|
return m && [m[1], m[4], m[3], m[4]]; |
|
} |
|
} |
Should it return [m[1], m[2], m[3], m[4]] rather than [m[1], m[4], m[3], m[4]]?
According to BindingX Doc,
the
cubicBezierfunction's last 4 parameters arecontrolX1, controlY1, controlX2, controlY2.In this animation implementation, we get the return value of
formatBezierfunction, and join the result with ',' so that we pass it as the last 4 parameters for thecubicBezierfunction.universal-api/packages/animation/src/index.js
Lines 85 to 88 in 2692aaf
However, the
formatBezierfunction returns[m[1], m[4], m[3], m[4]]-- in my opinion, it meanscontrolX1, controlY2, controlX2, controlY2.universal-api/packages/animation/src/formatBezier.js
Lines 1 to 6 in 7424381
Should it return
[m[1], m[2], m[3], m[4]]rather than[m[1], m[4], m[3], m[4]]?