dromara / newcar

🪢A modern animation engine for JavaScript ecosystem based on Skia (canvaskit-wasm)
https://newcarjs.org
Apache License 2.0
696 stars 35 forks source link

Refactor: refactor `changeProperty` and delete `changeStyle` #43

Closed sheepbox8646 closed 5 months ago

sheepbox8646 commented 5 months ago

In most of case, you can use changeProperty API to custom your attributes animation, but in recent using, i find many bug and unexpected points.

Bugs

If you use move animation and only provide a parameter to (like following codes, and the origin of move are also changeProperty without from and to), the animation will be loaded no longer correct, the time will get into wrong.

circle.animate(move, 0, 30, {
  to: [400, 400] // The animation will loaded wrong duration but it will not throw any error
})

Features

Usage

changeProperty('style.xxx', 0, 100)
changeProperty(['from[0]', 'to[0]'], [111, 222], [222, 333])
changeProperty(['style.attr1', 'attr2'], [0, 0], [100, 100])

Usage On Widget

circle.animate(changeProperty<Circle>(['x', 'style.x']), 0, 30, {
  to: [100, 200] // You can doesn't provide the parameter `from`, but if you want, that is allowed ^_^
})

And if changeProperty support like style.xxx grammar, changeStyle is no longer needed.

Who can implement this issue? Please comment under this issue and I'll assign to you to finish this work.

wgxh-cli commented 5 months ago

BUG LOCATED: The unit system just added, who set elapsed wrongly in app.ts:121, caused this issue. I'll consider replace the unit system with a new one.

wgxh-cli commented 5 months ago

Feature Request:

/// move.ts
export const move = changeProperty(['x', 'y'])
/// myOwnAnim.ts
// `override` method aims to override the `defaultFrom`, `defaultTo` and `by`
// which is already determined in original declaration
widget.animate(move.override({ to: [1000, 500] }))
sheepbox8646 commented 5 months ago

okay