@visactor/vrender-animate 0.22.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +177 -0
- package/cjs/animate-extension.d.ts +15 -0
- package/cjs/animate-extension.js +46 -0
- package/cjs/animate-extension.js.map +1 -0
- package/cjs/animate.d.ts +71 -0
- package/cjs/animate.js +210 -0
- package/cjs/animate.js.map +1 -0
- package/cjs/custom/clip-graphic.d.ts +53 -0
- package/cjs/custom/clip-graphic.js +146 -0
- package/cjs/custom/clip-graphic.js.map +1 -0
- package/cjs/custom/clip.d.ts +13 -0
- package/cjs/custom/clip.js +24 -0
- package/cjs/custom/clip.js.map +1 -0
- package/cjs/custom/common.d.ts +22 -0
- package/cjs/custom/common.js +58 -0
- package/cjs/custom/common.js.map +1 -0
- package/cjs/custom/custom-animate.d.ts +15 -0
- package/cjs/custom/custom-animate.js +25 -0
- package/cjs/custom/custom-animate.js.map +1 -0
- package/cjs/custom/fade.d.ts +13 -0
- package/cjs/custom/fade.js +24 -0
- package/cjs/custom/fade.js.map +1 -0
- package/cjs/custom/group-fade.d.ts +16 -0
- package/cjs/custom/group-fade.js +66 -0
- package/cjs/custom/group-fade.js.map +1 -0
- package/cjs/custom/growAngle.d.ts +37 -0
- package/cjs/custom/growAngle.js +140 -0
- package/cjs/custom/growAngle.js.map +1 -0
- package/cjs/custom/growCenter.d.ts +17 -0
- package/cjs/custom/growCenter.js +161 -0
- package/cjs/custom/growCenter.js.map +1 -0
- package/cjs/custom/growHeight.d.ts +36 -0
- package/cjs/custom/growHeight.js +154 -0
- package/cjs/custom/growHeight.js.map +1 -0
- package/cjs/custom/growPoints.d.ts +52 -0
- package/cjs/custom/growPoints.js +227 -0
- package/cjs/custom/growPoints.js.map +1 -0
- package/cjs/custom/growRadius.d.ts +41 -0
- package/cjs/custom/growRadius.js +113 -0
- package/cjs/custom/growRadius.js.map +1 -0
- package/cjs/custom/growWidth.d.ts +36 -0
- package/cjs/custom/growWidth.js +154 -0
- package/cjs/custom/growWidth.js.map +1 -0
- package/cjs/custom/input-text.d.ts +29 -0
- package/cjs/custom/input-text.js +45 -0
- package/cjs/custom/input-text.js.map +1 -0
- package/cjs/custom/number.d.ts +25 -0
- package/cjs/custom/number.js +102 -0
- package/cjs/custom/number.js.map +1 -0
- package/cjs/custom/register.d.ts +1 -0
- package/cjs/custom/register.js +35 -0
- package/cjs/custom/register.js.map +1 -0
- package/cjs/custom/scale-in.d.ts +13 -0
- package/cjs/custom/scale-in.js +57 -0
- package/cjs/custom/scale-in.js.map +1 -0
- package/cjs/custom/scale.d.ts +20 -0
- package/cjs/custom/scale.js +106 -0
- package/cjs/custom/scale.js.map +1 -0
- package/cjs/custom/sphere.d.ts +20 -0
- package/cjs/custom/sphere.js +26 -0
- package/cjs/custom/sphere.js.map +1 -0
- package/cjs/custom/state.d.ts +13 -0
- package/cjs/custom/state.js +25 -0
- package/cjs/custom/state.js.map +1 -0
- package/cjs/custom/tag-points.d.ts +26 -0
- package/cjs/custom/tag-points.js +81 -0
- package/cjs/custom/tag-points.js.map +1 -0
- package/cjs/custom/update.d.ts +14 -0
- package/cjs/custom/update.js +26 -0
- package/cjs/custom/update.js.map +1 -0
- package/cjs/executor/animate-executor.d.ts +36 -0
- package/cjs/executor/animate-executor.js +177 -0
- package/cjs/executor/animate-executor.js.map +1 -0
- package/cjs/executor/executor.d.ts +69 -0
- package/cjs/executor/executor.js +6 -0
- package/cjs/executor/executor.js.map +1 -0
- package/cjs/index.d.ts +25 -0
- package/cjs/index.js +214 -0
- package/cjs/index.js.map +1 -0
- package/cjs/interpolate/executor.d.ts +66 -0
- package/cjs/interpolate/executor.js +6 -0
- package/cjs/interpolate/executor.js.map +1 -0
- package/cjs/interpolate/number.d.ts +1 -0
- package/cjs/interpolate/number.js +10 -0
- package/cjs/interpolate/number.js.map +1 -0
- package/cjs/interpolate/store.d.ts +32 -0
- package/cjs/interpolate/store.js +96 -0
- package/cjs/interpolate/store.js.map +1 -0
- package/cjs/intreface/animate.d.ts +91 -0
- package/cjs/intreface/animate.js +10 -0
- package/cjs/intreface/animate.js.map +1 -0
- package/cjs/intreface/easing.d.ts +3 -0
- package/cjs/intreface/easing.js +6 -0
- package/cjs/intreface/easing.js.map +1 -0
- package/cjs/intreface/state.d.ts +35 -0
- package/cjs/intreface/state.js +6 -0
- package/cjs/intreface/state.js.map +1 -0
- package/cjs/intreface/ticker.d.ts +37 -0
- package/cjs/intreface/ticker.js +10 -0
- package/cjs/intreface/ticker.js.map +1 -0
- package/cjs/intreface/timeline.d.ts +17 -0
- package/cjs/intreface/timeline.js +6 -0
- package/cjs/intreface/timeline.js.map +1 -0
- package/cjs/intreface/type.d.ts +13 -0
- package/cjs/intreface/type.js +15 -0
- package/cjs/intreface/type.js.map +1 -0
- package/cjs/register.d.ts +1 -0
- package/cjs/register.js +19 -0
- package/cjs/register.js.map +1 -0
- package/cjs/state/animation-state-machine.d.ts +22 -0
- package/cjs/state/animation-state-machine.js +53 -0
- package/cjs/state/animation-state-machine.js.map +1 -0
- package/cjs/state/animation-state-queue.d.ts +24 -0
- package/cjs/state/animation-state-queue.js +66 -0
- package/cjs/state/animation-state-queue.js.map +1 -0
- package/cjs/state/animation-state-registry.d.ts +14 -0
- package/cjs/state/animation-state-registry.js +53 -0
- package/cjs/state/animation-state-registry.js.map +1 -0
- package/cjs/state/animation-state.d.ts +25 -0
- package/cjs/state/animation-state.js +80 -0
- package/cjs/state/animation-state.js.map +1 -0
- package/cjs/state/animation-states-registry.d.ts +17 -0
- package/cjs/state/animation-states-registry.js +95 -0
- package/cjs/state/animation-states-registry.js.map +1 -0
- package/cjs/state/graphic-extension.d.ts +12 -0
- package/cjs/state/graphic-extension.js +37 -0
- package/cjs/state/graphic-extension.js.map +1 -0
- package/cjs/state/index.d.ts +3 -0
- package/cjs/state/index.js +22 -0
- package/cjs/state/index.js.map +1 -0
- package/cjs/state/types.d.ts +11 -0
- package/cjs/state/types.js +6 -0
- package/cjs/state/types.js.map +1 -0
- package/cjs/step.d.ts +49 -0
- package/cjs/step.js +124 -0
- package/cjs/step.js.map +1 -0
- package/cjs/ticker/default-ticker.d.ts +39 -0
- package/cjs/ticker/default-ticker.js +133 -0
- package/cjs/ticker/default-ticker.js.map +1 -0
- package/cjs/ticker/manual-ticker.d.ts +6 -0
- package/cjs/ticker/manual-ticker.js +37 -0
- package/cjs/ticker/manual-ticker.js.map +1 -0
- package/cjs/timeline.d.ts +34 -0
- package/cjs/timeline.js +84 -0
- package/cjs/timeline.js.map +1 -0
- package/cjs/utils/easing-func.d.ts +1 -0
- package/cjs/utils/easing-func.js +16 -0
- package/cjs/utils/easing-func.js.map +1 -0
- package/cjs/utils/easing.d.ts +49 -0
- package/cjs/utils/easing.js +141 -0
- package/cjs/utils/easing.js.map +1 -0
- package/dist/index.es.js +3824 -0
- package/es/animate-extension.d.ts +15 -0
- package/es/animate-extension.js +42 -0
- package/es/animate-extension.js.map +1 -0
- package/es/animate.d.ts +71 -0
- package/es/animate.js +207 -0
- package/es/animate.js.map +1 -0
- package/es/custom/clip-graphic.d.ts +53 -0
- package/es/custom/clip-graphic.js +134 -0
- package/es/custom/clip-graphic.js.map +1 -0
- package/es/custom/clip.d.ts +13 -0
- package/es/custom/clip.js +14 -0
- package/es/custom/clip.js.map +1 -0
- package/es/custom/common.d.ts +22 -0
- package/es/custom/common.js +48 -0
- package/es/custom/common.js.map +1 -0
- package/es/custom/custom-animate.d.ts +15 -0
- package/es/custom/custom-animate.js +17 -0
- package/es/custom/custom-animate.js.map +1 -0
- package/es/custom/fade.d.ts +13 -0
- package/es/custom/fade.js +14 -0
- package/es/custom/fade.js.map +1 -0
- package/es/custom/group-fade.d.ts +16 -0
- package/es/custom/group-fade.js +56 -0
- package/es/custom/group-fade.js.map +1 -0
- package/es/custom/growAngle.d.ts +37 -0
- package/es/custom/growAngle.js +132 -0
- package/es/custom/growAngle.js.map +1 -0
- package/es/custom/growCenter.d.ts +17 -0
- package/es/custom/growCenter.js +155 -0
- package/es/custom/growCenter.js.map +1 -0
- package/es/custom/growHeight.d.ts +36 -0
- package/es/custom/growHeight.js +144 -0
- package/es/custom/growHeight.js.map +1 -0
- package/es/custom/growPoints.d.ts +52 -0
- package/es/custom/growPoints.js +219 -0
- package/es/custom/growPoints.js.map +1 -0
- package/es/custom/growRadius.d.ts +41 -0
- package/es/custom/growRadius.js +105 -0
- package/es/custom/growRadius.js.map +1 -0
- package/es/custom/growWidth.d.ts +36 -0
- package/es/custom/growWidth.js +144 -0
- package/es/custom/growWidth.js.map +1 -0
- package/es/custom/input-text.d.ts +29 -0
- package/es/custom/input-text.js +37 -0
- package/es/custom/input-text.js.map +1 -0
- package/es/custom/number.d.ts +25 -0
- package/es/custom/number.js +94 -0
- package/es/custom/number.js.map +1 -0
- package/es/custom/register.d.ts +1 -0
- package/es/custom/register.js +39 -0
- package/es/custom/register.js.map +1 -0
- package/es/custom/scale-in.d.ts +13 -0
- package/es/custom/scale-in.js +49 -0
- package/es/custom/scale-in.js.map +1 -0
- package/es/custom/scale.d.ts +20 -0
- package/es/custom/scale.js +96 -0
- package/es/custom/scale.js.map +1 -0
- package/es/custom/sphere.d.ts +20 -0
- package/es/custom/sphere.js +20 -0
- package/es/custom/sphere.js.map +1 -0
- package/es/custom/state.d.ts +13 -0
- package/es/custom/state.js +17 -0
- package/es/custom/state.js.map +1 -0
- package/es/custom/tag-points.d.ts +26 -0
- package/es/custom/tag-points.js +77 -0
- package/es/custom/tag-points.js.map +1 -0
- package/es/custom/update.d.ts +14 -0
- package/es/custom/update.js +18 -0
- package/es/custom/update.js.map +1 -0
- package/es/executor/animate-executor.d.ts +36 -0
- package/es/executor/animate-executor.js +169 -0
- package/es/executor/animate-executor.js.map +1 -0
- package/es/executor/executor.d.ts +69 -0
- package/es/executor/executor.js +2 -0
- package/es/executor/executor.js.map +1 -0
- package/es/index.d.ts +25 -0
- package/es/index.js +50 -0
- package/es/index.js.map +1 -0
- package/es/interpolate/executor.d.ts +66 -0
- package/es/interpolate/executor.js +2 -0
- package/es/interpolate/executor.js.map +1 -0
- package/es/interpolate/number.d.ts +1 -0
- package/es/interpolate/number.js +4 -0
- package/es/interpolate/number.js.map +1 -0
- package/es/interpolate/store.d.ts +32 -0
- package/es/interpolate/store.js +88 -0
- package/es/interpolate/store.js.map +1 -0
- package/es/intreface/animate.d.ts +91 -0
- package/es/intreface/animate.js +6 -0
- package/es/intreface/animate.js.map +1 -0
- package/es/intreface/easing.d.ts +3 -0
- package/es/intreface/easing.js +2 -0
- package/es/intreface/easing.js.map +1 -0
- package/es/intreface/state.d.ts +35 -0
- package/es/intreface/state.js +2 -0
- package/es/intreface/state.js.map +1 -0
- package/es/intreface/ticker.d.ts +37 -0
- package/es/intreface/ticker.js +6 -0
- package/es/intreface/ticker.js.map +1 -0
- package/es/intreface/timeline.d.ts +17 -0
- package/es/intreface/timeline.js +2 -0
- package/es/intreface/timeline.js.map +1 -0
- package/es/intreface/type.d.ts +13 -0
- package/es/intreface/type.js +14 -0
- package/es/intreface/type.js.map +1 -0
- package/es/register.d.ts +1 -0
- package/es/register.js +20 -0
- package/es/register.js.map +1 -0
- package/es/state/animation-state-machine.d.ts +22 -0
- package/es/state/animation-state-machine.js +47 -0
- package/es/state/animation-state-machine.js.map +1 -0
- package/es/state/animation-state-queue.d.ts +24 -0
- package/es/state/animation-state-queue.js +58 -0
- package/es/state/animation-state-queue.js.map +1 -0
- package/es/state/animation-state-registry.d.ts +14 -0
- package/es/state/animation-state-registry.js +45 -0
- package/es/state/animation-state-registry.js.map +1 -0
- package/es/state/animation-state.d.ts +25 -0
- package/es/state/animation-state.js +72 -0
- package/es/state/animation-state.js.map +1 -0
- package/es/state/animation-states-registry.d.ts +17 -0
- package/es/state/animation-states-registry.js +87 -0
- package/es/state/animation-states-registry.js.map +1 -0
- package/es/state/graphic-extension.d.ts +12 -0
- package/es/state/graphic-extension.js +29 -0
- package/es/state/graphic-extension.js.map +1 -0
- package/es/state/index.d.ts +3 -0
- package/es/state/index.js +6 -0
- package/es/state/index.js.map +1 -0
- package/es/state/types.d.ts +11 -0
- package/es/state/types.js +2 -0
- package/es/state/types.js.map +1 -0
- package/es/step.d.ts +49 -0
- package/es/step.js +120 -0
- package/es/step.js.map +1 -0
- package/es/ticker/default-ticker.d.ts +39 -0
- package/es/ticker/default-ticker.js +129 -0
- package/es/ticker/default-ticker.js.map +1 -0
- package/es/ticker/manual-ticker.d.ts +6 -0
- package/es/ticker/manual-ticker.js +29 -0
- package/es/ticker/manual-ticker.js.map +1 -0
- package/es/timeline.d.ts +34 -0
- package/es/timeline.js +79 -0
- package/es/timeline.js.map +1 -0
- package/es/utils/easing-func.d.ts +1 -0
- package/es/utils/easing-func.js +8 -0
- package/es/utils/easing-func.js.map +1 -0
- package/es/utils/easing.d.ts +49 -0
- package/es/utils/easing.js +134 -0
- package/es/utils/easing.js.map +1 -0
- package/package.json +72 -0
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import type { IGraphicAnimateParams } from '@visactor/vrender-core';
|
|
2
|
+
import type { IAnimate } from './intreface/animate';
|
|
3
|
+
import { Animate } from './animate';
|
|
4
|
+
import { DefaultTimeline } from './timeline';
|
|
5
|
+
import { DefaultTicker } from './ticker/default-ticker';
|
|
6
|
+
export declare class AnimateExtension {
|
|
7
|
+
animatedAttribute: Record<string, any> | null;
|
|
8
|
+
animates: Map<string | number, IAnimate>;
|
|
9
|
+
getAttributes(final?: boolean): any;
|
|
10
|
+
animate(params?: IGraphicAnimateParams): Animate;
|
|
11
|
+
protected computeAnimatedAttribute(): void;
|
|
12
|
+
createTimeline(): DefaultTimeline;
|
|
13
|
+
createTicker(stage: any): DefaultTicker;
|
|
14
|
+
protected getFinalAttribute(): {};
|
|
15
|
+
}
|
|
@@ -0,0 +1,42 @@
|
|
|
1
|
+
import { Animate } from "./animate";
|
|
2
|
+
|
|
3
|
+
import { DefaultTimeline, defaultTimeline } from "./timeline";
|
|
4
|
+
|
|
5
|
+
import { DefaultTicker } from "./ticker/default-ticker";
|
|
6
|
+
|
|
7
|
+
export class AnimateExtension {
|
|
8
|
+
constructor() {
|
|
9
|
+
this.animatedAttribute = null;
|
|
10
|
+
}
|
|
11
|
+
getAttributes(final = !1) {
|
|
12
|
+
return final ? (this.computeAnimatedAttribute(), this.getFinalAttribute()) : this.attribute;
|
|
13
|
+
}
|
|
14
|
+
animate(params) {
|
|
15
|
+
var _a, _b, _c;
|
|
16
|
+
this.animates || (this.animates = new Map);
|
|
17
|
+
const animate = new Animate(null == params ? void 0 : params.id, null !== (_b = null !== (_a = null == params ? void 0 : params.timeline) && void 0 !== _a ? _a : this.stage && this.stage.getTimeline()) && void 0 !== _b ? _b : defaultTimeline, null == params ? void 0 : params.slience);
|
|
18
|
+
if (animate.bind(this), params) {
|
|
19
|
+
const {onStart: onStart, onEnd: onEnd, onRemove: onRemove} = params;
|
|
20
|
+
null != onStart && animate.onStart(onStart), null != onEnd && animate.onEnd(onEnd),
|
|
21
|
+
null != onRemove && animate.onRemove(onRemove);
|
|
22
|
+
}
|
|
23
|
+
return this.animates.set(animate.id, animate), animate.onRemove((() => {
|
|
24
|
+
animate.stop(), this.animates.delete(animate.id);
|
|
25
|
+
})), null === (_c = this.stage) || void 0 === _c || _c.ticker.start(), animate;
|
|
26
|
+
}
|
|
27
|
+
computeAnimatedAttribute() {
|
|
28
|
+
this.animatedAttribute || (this.animatedAttribute = {}, this.animates.forEach((animate => {
|
|
29
|
+
animate.getLoop() !== 1 / 0 && Object.assign(this.animatedAttribute, animate.getEndProps());
|
|
30
|
+
})));
|
|
31
|
+
}
|
|
32
|
+
createTimeline() {
|
|
33
|
+
return new DefaultTimeline;
|
|
34
|
+
}
|
|
35
|
+
createTicker(stage) {
|
|
36
|
+
return new DefaultTicker(stage);
|
|
37
|
+
}
|
|
38
|
+
getFinalAttribute() {
|
|
39
|
+
const finalAttribute = {};
|
|
40
|
+
return Object.assign(finalAttribute, this.attribute, this.animatedAttribute), finalAttribute;
|
|
41
|
+
}
|
|
42
|
+
}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/animate-extension.ts"],"names":[],"mappings":"AASA,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AACpC,OAAO,EAAE,eAAe,EAAE,eAAe,EAAE,MAAM,YAAY,CAAC;AAC9D,OAAO,EAAE,aAAa,EAAE,MAAM,yBAAyB,CAAC;AAGxD,MAAM,OAAO,gBAAgB;IAA7B;QACE,sBAAiB,GAA+B,IAAI,CAAC;IAkEvD,CAAC;IA9DC,aAAa,CAAC,QAAiB,KAAK;QAClC,IAAI,KAAK,EAAE;YACT,IAAI,CAAC,wBAAwB,EAAE,CAAC;YAChC,OAAO,IAAI,CAAC,iBAAiB,EAAE,CAAC;SACjC;QACD,OAAQ,IAAY,CAAC,SAAS,CAAC;IACjC,CAAC;IAED,OAAO,CAAC,MAA8B;;QACpC,IAAI,CAAC,IAAI,CAAC,QAAQ,EAAE;YAClB,IAAI,CAAC,QAAQ,GAAG,IAAI,GAAG,EAAE,CAAC;SAC3B;QACD,MAAM,OAAO,GAAG,IAAI,OAAO,CACzB,MAAM,aAAN,MAAM,uBAAN,MAAM,CAAE,EAAE,EACV,MAAA,MAAA,MAAM,aAAN,MAAM,uBAAN,MAAM,CAAE,QAAQ,mCAAI,CAAE,IAAY,CAAC,KAAK,IAAK,IAAY,CAAC,KAAK,CAAC,WAAW,EAAE,CAAC,mCAAI,eAAe,EACjG,MAAM,aAAN,MAAM,uBAAN,MAAM,CAAE,OAAO,CAChB,CAAC;QAEF,OAAO,CAAC,IAAI,CAAC,IAAW,CAAC,CAAC;QAC1B,IAAI,MAAM,EAAE;YACV,MAAM,EAAE,OAAO,EAAE,KAAK,EAAE,QAAQ,EAAE,GAAG,MAAM,CAAC;YAC5C,OAAO,IAAI,IAAI,IAAI,OAAO,CAAC,OAAO,CAAC,OAAO,CAAC,CAAC;YAC5C,KAAK,IAAI,IAAI,IAAI,OAAO,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC;YACtC,QAAQ,IAAI,IAAI,IAAI,OAAO,CAAC,QAAQ,CAAC,QAAQ,CAAC,CAAC;SAChD;QACD,IAAI,CAAC,QAAQ,CAAC,GAAG,CAAC,OAAO,CAAC,EAAE,EAAE,OAAO,CAAC,CAAC;QACvC,OAAO,CAAC,QAAQ,CAAC,GAAG,EAAE;YACpB,OAAO,CAAC,IAAI,EAAE,CAAC;YACf,IAAI,CAAC,QAAQ,CAAC,MAAM,CAAC,OAAO,CAAC,EAAE,CAAC,CAAC;QACnC,CAAC,CAAC,CAAC;QAGH,MAAC,IAAY,CAAC,KAAK,0CAAE,MAAM,CAAC,KAAK,EAAE,CAAC;QAEpC,OAAO,OAAO,CAAC;IACjB,CAAC;IAES,wBAAwB;QAChC,IAAI,CAAC,IAAI,CAAC,iBAAiB,EAAE;YAC3B,IAAI,CAAC,iBAAiB,GAAG,EAAE,CAAC;YAE5B,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,OAAO,CAAC,EAAE;gBAC9B,IAAI,OAAO,CAAC,OAAO,EAAE,KAAK,QAAQ,EAAE;oBAClC,MAAM,CAAC,MAAM,CAAC,IAAI,CAAC,iBAAiB,EAAE,OAAO,CAAC,WAAW,EAAE,CAAC,CAAC;iBAC9D;YACH,CAAC,CAAC,CAAC;SACJ;IACH,CAAC;IAED,cAAc;QACZ,OAAO,IAAI,eAAe,EAAE,CAAC;IAC/B,CAAC;IAED,YAAY,CAAC,KAAU;QACrB,OAAO,IAAI,aAAa,CAAC,KAAK,CAAC,CAAC;IAClC,CAAC;IAES,iBAAiB;QACzB,MAAM,cAAc,GAAG,EAAE,CAAC;QAC1B,MAAM,CAAC,MAAM,CAAC,cAAc,EAAG,IAAY,CAAC,SAAS,EAAE,IAAI,CAAC,iBAAiB,CAAC,CAAC;QAC/E,OAAO,cAAc,CAAC;IACxB,CAAC;CACF","file":"animate-extension.js","sourcesContent":["// 1. 支持animate函数\n// 2. 支持animates map\n// 2. 支持animatedAttribute 为所有动画的最终结果(loop为INFINITY的动画不算)\n// 3. 支持finalAttribute 为所有动画的最终结果(animatedAttribute 合并了 graphic.attribute之后的最终结果)\n// 3. 重载Graphic的getAttributes方法,根据参数getAttributes(final = true)返回finalAttribute = {}; merge(finalAttribute, graphic.attribute, animatedAttribute),\n// animatedAttribute为所有动画的最终结果(loop为INFINITY的动画不算)\n\nimport type { IGraphicAnimateParams } from '@visactor/vrender-core';\nimport type { IAnimate } from './intreface/animate';\nimport { Animate } from './animate';\nimport { DefaultTimeline, defaultTimeline } from './timeline';\nimport { DefaultTicker } from './ticker/default-ticker';\n\n// 基于性能考虑,每次调用animate函数,都会设置animatedAttribute为null,每次getAttributes(true)会根据animatedAttribute属性判断是否需要重新计算animatedAttribute。\nexport class AnimateExtension {\n animatedAttribute: Record<string, any> | null = null;\n\n declare animates: Map<string | number, IAnimate>;\n\n getAttributes(final: boolean = false) {\n if (final) {\n this.computeAnimatedAttribute();\n return this.getFinalAttribute();\n }\n return (this as any).attribute;\n }\n\n animate(params?: IGraphicAnimateParams) {\n if (!this.animates) {\n this.animates = new Map();\n }\n const animate = new Animate(\n params?.id,\n params?.timeline ?? ((this as any).stage && (this as any).stage.getTimeline()) ?? defaultTimeline,\n params?.slience\n );\n\n animate.bind(this as any);\n if (params) {\n const { onStart, onEnd, onRemove } = params;\n onStart != null && animate.onStart(onStart);\n onEnd != null && animate.onEnd(onEnd);\n onRemove != null && animate.onRemove(onRemove);\n }\n this.animates.set(animate.id, animate);\n animate.onRemove(() => {\n animate.stop();\n this.animates.delete(animate.id);\n });\n\n // TODO 考虑性能问题\n (this as any).stage?.ticker.start();\n\n return animate;\n }\n\n protected computeAnimatedAttribute() {\n if (!this.animatedAttribute) {\n this.animatedAttribute = {};\n\n this.animates.forEach(animate => {\n if (animate.getLoop() !== Infinity) {\n Object.assign(this.animatedAttribute, animate.getEndProps());\n }\n });\n }\n }\n\n createTimeline() {\n return new DefaultTimeline();\n }\n\n createTicker(stage: any) {\n return new DefaultTicker(stage);\n }\n\n protected getFinalAttribute() {\n const finalAttribute = {};\n Object.assign(finalAttribute, (this as any).attribute, this.animatedAttribute);\n return finalAttribute;\n }\n}\n"]}
|
package/es/animate.d.ts
ADDED
|
@@ -0,0 +1,71 @@
|
|
|
1
|
+
import type { IAnimate, IStep, ICustomAnimate } from './intreface/animate';
|
|
2
|
+
import type { EasingType } from './intreface/easing';
|
|
3
|
+
import { AnimateStatus } from './intreface/type';
|
|
4
|
+
import type { ITimeline } from './intreface/timeline';
|
|
5
|
+
import { type IGraphic } from '@visactor/vrender-core';
|
|
6
|
+
export declare class Animate implements IAnimate {
|
|
7
|
+
readonly id: string | number;
|
|
8
|
+
status: AnimateStatus;
|
|
9
|
+
target: IGraphic;
|
|
10
|
+
_onStart?: (() => void)[];
|
|
11
|
+
_onFrame?: ((step: IStep, ratio: number) => void)[];
|
|
12
|
+
_onEnd?: (() => void)[];
|
|
13
|
+
_onRemove?: (() => void)[];
|
|
14
|
+
private _timeline;
|
|
15
|
+
private _startTime;
|
|
16
|
+
private _duration;
|
|
17
|
+
private _totalDuration;
|
|
18
|
+
private _loopCount;
|
|
19
|
+
private _currentLoop;
|
|
20
|
+
private _bounce;
|
|
21
|
+
private _firstStep;
|
|
22
|
+
private _lastStep;
|
|
23
|
+
private _startProps;
|
|
24
|
+
private _endProps;
|
|
25
|
+
private _preventAttrs;
|
|
26
|
+
priority: number;
|
|
27
|
+
protected currentTime: number;
|
|
28
|
+
slience?: boolean;
|
|
29
|
+
interpolateUpdateFunction: ((from: Record<string, any>, to: Record<string, any>, ratio: number, step: IStep, target: IGraphic) => void) | null;
|
|
30
|
+
constructor(id?: string | number, timeline?: ITimeline, slience?: boolean);
|
|
31
|
+
getStartProps(): Record<string, any>;
|
|
32
|
+
getEndProps(): Record<string, any>;
|
|
33
|
+
setTimeline(timeline: ITimeline): void;
|
|
34
|
+
getTimeline(): ITimeline;
|
|
35
|
+
get timeline(): ITimeline;
|
|
36
|
+
bind(target: IGraphic): this;
|
|
37
|
+
to(props: Record<string, any>, duration?: number, easing?: EasingType): this;
|
|
38
|
+
wait(delay: number): this;
|
|
39
|
+
protected updateStepAfterAppend(step: IStep): void;
|
|
40
|
+
parseStepProps(step: IStep): void;
|
|
41
|
+
reSyncProps(): void;
|
|
42
|
+
from(props: Record<string, any>, duration?: number, easing?: EasingType): this;
|
|
43
|
+
play(customAnimate: ICustomAnimate): this;
|
|
44
|
+
pause(): void;
|
|
45
|
+
resume(): void;
|
|
46
|
+
onStart(cb?: () => void): void;
|
|
47
|
+
onEnd(cb?: () => void): void;
|
|
48
|
+
onFrame(cb?: (step: IStep, ratio: number) => void): void;
|
|
49
|
+
onRemove(cb?: () => void): void;
|
|
50
|
+
preventAttr(key: string): void;
|
|
51
|
+
preventAttrs(keys: string[]): void;
|
|
52
|
+
validAttr(key: string): boolean;
|
|
53
|
+
runCb(cb: (a: IAnimate, step: IStep) => void): IAnimate;
|
|
54
|
+
startAt(t: number): this;
|
|
55
|
+
customInterpolate(key: string, ratio: number, from: any, to: any, target: IGraphic, ret: Record<string, any>): boolean;
|
|
56
|
+
getFromValue(): Record<string, any>;
|
|
57
|
+
getToValue(): Record<string, any>;
|
|
58
|
+
stop(type?: 'start' | 'end' | Record<string, any>): void;
|
|
59
|
+
release(): void;
|
|
60
|
+
getDuration(): number;
|
|
61
|
+
getStartTime(): number;
|
|
62
|
+
afterAll(list: IAnimate[]): this;
|
|
63
|
+
after(animate: IAnimate): this;
|
|
64
|
+
parallel(animate: IAnimate): this;
|
|
65
|
+
loop(n: number | boolean): this;
|
|
66
|
+
bounce(b: boolean): this;
|
|
67
|
+
advance(delta: number): void;
|
|
68
|
+
updateDuration(): void;
|
|
69
|
+
getTotalDuration(): number;
|
|
70
|
+
getLoop(): number;
|
|
71
|
+
}
|
package/es/animate.js
ADDED
|
@@ -0,0 +1,207 @@
|
|
|
1
|
+
import { AnimateStatus, AnimateStepType } from "./intreface/type";
|
|
2
|
+
|
|
3
|
+
import { Step, WaitStep } from "./step";
|
|
4
|
+
|
|
5
|
+
import { Generator } from "@visactor/vrender-core";
|
|
6
|
+
|
|
7
|
+
import { defaultTimeline } from "./timeline";
|
|
8
|
+
|
|
9
|
+
export class Animate {
|
|
10
|
+
constructor(id = Generator.GenAutoIncrementId(), timeline = defaultTimeline, slience) {
|
|
11
|
+
this.id = id, this.status = AnimateStatus.INITIAL, this._timeline = timeline, timeline.addAnimate(this),
|
|
12
|
+
this.slience = slience, this._startTime = 0, this._duration = 0, this._totalDuration = 0,
|
|
13
|
+
this._loopCount = 0, this._currentLoop = 0, this._bounce = !1, this._firstStep = null,
|
|
14
|
+
this._lastStep = null, this._startProps = {}, this._endProps = {}, this._preventAttrs = new Set,
|
|
15
|
+
this.currentTime = 0, this.interpolateUpdateFunction = null, this.priority = 0;
|
|
16
|
+
}
|
|
17
|
+
getStartProps() {
|
|
18
|
+
return this._startProps;
|
|
19
|
+
}
|
|
20
|
+
getEndProps() {
|
|
21
|
+
return this._endProps;
|
|
22
|
+
}
|
|
23
|
+
setTimeline(timeline) {
|
|
24
|
+
this._timeline = timeline;
|
|
25
|
+
}
|
|
26
|
+
getTimeline() {
|
|
27
|
+
return this._timeline;
|
|
28
|
+
}
|
|
29
|
+
get timeline() {
|
|
30
|
+
return this._timeline;
|
|
31
|
+
}
|
|
32
|
+
bind(target) {
|
|
33
|
+
return this.target = target, this.target.onAnimateBind && !this.slience && this.target.onAnimateBind(this),
|
|
34
|
+
this.target.animationAttribute || (this.target.animationAttribute = {}), this;
|
|
35
|
+
}
|
|
36
|
+
to(props, duration = 300, easing = "linear") {
|
|
37
|
+
const step = new Step(AnimateStepType.to, props, duration, easing);
|
|
38
|
+
return this.updateStepAfterAppend(step), step.bind(this.target, this), this;
|
|
39
|
+
}
|
|
40
|
+
wait(delay) {
|
|
41
|
+
const step = new WaitStep(AnimateStepType.wait, {}, delay, "linear");
|
|
42
|
+
return this.updateStepAfterAppend(step), step.bind(this.target, this), this;
|
|
43
|
+
}
|
|
44
|
+
updateStepAfterAppend(step) {
|
|
45
|
+
this._firstStep ? (this._lastStep.append(step), this._lastStep = step) : (this._firstStep = step,
|
|
46
|
+
this._lastStep = step), this.parseStepProps(step), this.updateDuration();
|
|
47
|
+
}
|
|
48
|
+
parseStepProps(step) {
|
|
49
|
+
this._lastStep && (step.propKeys = step.propKeys || Object.keys(step.props), Object.keys(this._endProps).forEach((key => {
|
|
50
|
+
var _a;
|
|
51
|
+
step.props[key] = null !== (_a = step.props[key]) && void 0 !== _a ? _a : this._endProps[key];
|
|
52
|
+
})), step.propKeys.forEach((key => {
|
|
53
|
+
this._endProps[key] = step.props[key];
|
|
54
|
+
})));
|
|
55
|
+
}
|
|
56
|
+
reSyncProps() {
|
|
57
|
+
if (!this._lastStep) return;
|
|
58
|
+
this._endProps = {};
|
|
59
|
+
let currentStep = this._firstStep;
|
|
60
|
+
for (;currentStep; ) Object.keys(this._endProps).forEach((key => {
|
|
61
|
+
var _a;
|
|
62
|
+
currentStep.props[key] = null !== (_a = currentStep.props[key]) && void 0 !== _a ? _a : this._endProps[key];
|
|
63
|
+
})), currentStep.propKeys.forEach((key => {
|
|
64
|
+
this._endProps[key] = currentStep.props[key];
|
|
65
|
+
})), currentStep = currentStep.next;
|
|
66
|
+
}
|
|
67
|
+
from(props, duration = 300, easing = "linear") {
|
|
68
|
+
const step = new Step(AnimateStepType.from, props, duration, easing);
|
|
69
|
+
return this._firstStep ? (this._lastStep.append(step), this._lastStep = step) : (this._firstStep = step,
|
|
70
|
+
this._lastStep = step), this.updateDuration(), this;
|
|
71
|
+
}
|
|
72
|
+
play(customAnimate) {
|
|
73
|
+
return this.updateStepAfterAppend(customAnimate), customAnimate.bind(this.target, this),
|
|
74
|
+
this;
|
|
75
|
+
}
|
|
76
|
+
pause() {
|
|
77
|
+
this.status === AnimateStatus.RUNNING && (this.status = AnimateStatus.PAUSED);
|
|
78
|
+
}
|
|
79
|
+
resume() {
|
|
80
|
+
this.status === AnimateStatus.PAUSED && (this.status = AnimateStatus.RUNNING);
|
|
81
|
+
}
|
|
82
|
+
onStart(cb) {
|
|
83
|
+
var _a;
|
|
84
|
+
cb ? (this._onStart || (this._onStart = []), this._onStart.push(cb)) : (null === (_a = this._onStart) || void 0 === _a || _a.forEach((cb => cb())),
|
|
85
|
+
Object.keys(this._endProps).forEach((key => {
|
|
86
|
+
this._startProps[key] = this.target.getComputedAttribute(key);
|
|
87
|
+
})));
|
|
88
|
+
}
|
|
89
|
+
onEnd(cb) {
|
|
90
|
+
var _a;
|
|
91
|
+
cb ? (this._onEnd || (this._onEnd = []), this._onEnd.push(cb)) : null === (_a = this._onEnd) || void 0 === _a || _a.forEach((cb => cb()));
|
|
92
|
+
}
|
|
93
|
+
onFrame(cb) {
|
|
94
|
+
cb && (this._onFrame || (this._onFrame = []), this._onFrame.push(cb));
|
|
95
|
+
}
|
|
96
|
+
onRemove(cb) {
|
|
97
|
+
var _a;
|
|
98
|
+
cb ? (this._onRemove || (this._onRemove = []), this._onRemove.push(cb)) : null === (_a = this._onRemove) || void 0 === _a || _a.forEach((cb => cb()));
|
|
99
|
+
}
|
|
100
|
+
preventAttr(key) {
|
|
101
|
+
this._preventAttrs.add(key), delete this._startProps[key], delete this._endProps[key];
|
|
102
|
+
let step = this._firstStep;
|
|
103
|
+
for (;step; ) step.deleteSelfAttr(key), step = step.next;
|
|
104
|
+
}
|
|
105
|
+
preventAttrs(keys) {
|
|
106
|
+
keys.forEach((key => this._preventAttrs.add(key)));
|
|
107
|
+
}
|
|
108
|
+
validAttr(key) {
|
|
109
|
+
return !this._preventAttrs.has(key);
|
|
110
|
+
}
|
|
111
|
+
runCb(cb) {
|
|
112
|
+
var _a;
|
|
113
|
+
return null === (_a = this._lastStep) || void 0 === _a || _a.onEnd(cb), this;
|
|
114
|
+
}
|
|
115
|
+
startAt(t) {
|
|
116
|
+
return this._startTime = t, this;
|
|
117
|
+
}
|
|
118
|
+
customInterpolate(key, ratio, from, to, target, ret) {
|
|
119
|
+
return !1;
|
|
120
|
+
}
|
|
121
|
+
getFromValue() {
|
|
122
|
+
return this._startProps;
|
|
123
|
+
}
|
|
124
|
+
getToValue() {
|
|
125
|
+
return this._endProps;
|
|
126
|
+
}
|
|
127
|
+
stop(type) {
|
|
128
|
+
this.status = AnimateStatus.END, this.onEnd(), this.target && ("start" === type ? this.target.setAttributes(this._startProps) : "end" === type ? this.target.setAttributes(this._endProps) : type && this.target.setAttributes(type));
|
|
129
|
+
}
|
|
130
|
+
release() {
|
|
131
|
+
this.status = AnimateStatus.END, this._onRemove && this._onRemove.forEach((cb => cb())),
|
|
132
|
+
this._onStart = [], this._onFrame = [], this._onEnd = [], this._onRemove = [];
|
|
133
|
+
}
|
|
134
|
+
getDuration() {
|
|
135
|
+
return this._duration;
|
|
136
|
+
}
|
|
137
|
+
getStartTime() {
|
|
138
|
+
return this._startTime;
|
|
139
|
+
}
|
|
140
|
+
afterAll(list) {
|
|
141
|
+
if (!list || 0 === list.length) return this;
|
|
142
|
+
let maxEndTime = 0;
|
|
143
|
+
return list.forEach((animate => {
|
|
144
|
+
const endTime = animate.getStartTime() + animate.getTotalDuration();
|
|
145
|
+
maxEndTime = Math.max(maxEndTime, endTime);
|
|
146
|
+
})), this.startAt(maxEndTime);
|
|
147
|
+
}
|
|
148
|
+
after(animate) {
|
|
149
|
+
if (!animate) return this;
|
|
150
|
+
const endTime = animate.getStartTime() + animate.getTotalDuration();
|
|
151
|
+
return this.startAt(endTime);
|
|
152
|
+
}
|
|
153
|
+
parallel(animate) {
|
|
154
|
+
return animate ? (this.startAt(animate.getStartTime()), this) : this;
|
|
155
|
+
}
|
|
156
|
+
loop(n) {
|
|
157
|
+
return !0 === n ? n = 1 / 0 : !1 === n && (n = 0), this._loopCount = n, this.updateDuration(),
|
|
158
|
+
this;
|
|
159
|
+
}
|
|
160
|
+
bounce(b) {
|
|
161
|
+
return this._bounce = b, this;
|
|
162
|
+
}
|
|
163
|
+
advance(delta) {
|
|
164
|
+
var _a;
|
|
165
|
+
if (this.status === AnimateStatus.END) return void console.warn("aaa 动画已经结束,不能推进");
|
|
166
|
+
const nextTime = this.currentTime + delta;
|
|
167
|
+
if (nextTime < this._startTime) return void (this.currentTime = nextTime);
|
|
168
|
+
if (nextTime >= this._startTime + this._totalDuration) return null === (_a = this._lastStep) || void 0 === _a || _a.onEnd(),
|
|
169
|
+
this.onEnd(), void (this.status = AnimateStatus.END);
|
|
170
|
+
this.status = AnimateStatus.RUNNING, this.currentTime <= this._startTime && this.onStart(),
|
|
171
|
+
this.currentTime = nextTime;
|
|
172
|
+
let cycleTime = nextTime - this._startTime, newLoop = !1, bounceTime = !1;
|
|
173
|
+
if (this._loopCount > 0) {
|
|
174
|
+
cycleTime = (nextTime - this._startTime) % this._duration;
|
|
175
|
+
const currentLoop = Math.floor((nextTime - this._startTime) / this._duration);
|
|
176
|
+
newLoop = currentLoop > this._currentLoop, this._currentLoop = currentLoop, bounceTime = this._bounce && currentLoop % 2 == 1,
|
|
177
|
+
bounceTime && (cycleTime = this._duration - cycleTime);
|
|
178
|
+
}
|
|
179
|
+
newLoop && !bounceTime && this.target.setAttributes(this._startProps);
|
|
180
|
+
let targetStep = null;
|
|
181
|
+
if (this._lastStep === this._firstStep) targetStep = this._firstStep; else {
|
|
182
|
+
let currentStep = this._firstStep;
|
|
183
|
+
for (;currentStep; ) {
|
|
184
|
+
const stepStartTime = currentStep.getStartTime(), stepDuration = currentStep.getDuration();
|
|
185
|
+
if (cycleTime >= stepStartTime && cycleTime <= stepStartTime + stepDuration) {
|
|
186
|
+
targetStep = currentStep;
|
|
187
|
+
break;
|
|
188
|
+
}
|
|
189
|
+
currentStep = currentStep.next;
|
|
190
|
+
}
|
|
191
|
+
}
|
|
192
|
+
if (!targetStep) return;
|
|
193
|
+
const ratio = (cycleTime - targetStep.getStartTime()) / targetStep.getDuration(), isEnd = ratio >= 1;
|
|
194
|
+
targetStep.update(isEnd, ratio, {}), isEnd && targetStep.onEnd();
|
|
195
|
+
}
|
|
196
|
+
updateDuration() {
|
|
197
|
+
this._lastStep ? (this._duration = this._lastStep.getStartTime() + this._lastStep.getDuration(),
|
|
198
|
+
this._totalDuration = this._duration * (this._loopCount + 1)) : this._duration = 0;
|
|
199
|
+
}
|
|
200
|
+
getTotalDuration() {
|
|
201
|
+
return this._totalDuration;
|
|
202
|
+
}
|
|
203
|
+
getLoop() {
|
|
204
|
+
return this._loopCount;
|
|
205
|
+
}
|
|
206
|
+
}
|
|
207
|
+
//# sourceMappingURL=animate.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/animate.ts"],"names":[],"mappings":"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","file":"animate.js","sourcesContent":["import type { IAnimate, IStep, ICustomAnimate } from './intreface/animate';\nimport type { EasingType } from './intreface/easing';\nimport { AnimateStatus, AnimateStepType } from './intreface/type';\nimport { Step, WaitStep } from './step';\nimport type { ITimeline } from './intreface/timeline';\nimport { Generator, type IGraphic } from '@visactor/vrender-core';\nimport { defaultTimeline } from './timeline';\n\nexport class Animate implements IAnimate {\n readonly id: string | number;\n status: AnimateStatus;\n target: IGraphic;\n\n // 回调函数列表\n _onStart?: (() => void)[];\n _onFrame?: ((step: IStep, ratio: number) => void)[];\n _onEnd?: (() => void)[];\n _onRemove?: (() => void)[];\n\n // 时间控制\n private _timeline: ITimeline;\n private _startTime: number;\n private _duration: number;\n private _totalDuration: number;\n\n // 动画控制\n // private _reversed: boolean;\n private _loopCount: number;\n private _currentLoop: number;\n private _bounce: boolean;\n\n // 链表头节点和尾节点\n private _firstStep: IStep | null;\n private _lastStep: IStep | null;\n\n // 初始属性和屏蔽的属性\n private _startProps: Record<string, any>;\n private _endProps: Record<string, any>;\n private _preventAttrs: Set<string>;\n // 优先级,用于判定是否能被后续的动画preventAttr\n declare priority: number;\n\n protected currentTime: number;\n slience?: boolean;\n\n interpolateUpdateFunction:\n | ((from: Record<string, any>, to: Record<string, any>, ratio: number, step: IStep, target: IGraphic) => void)\n | null;\n\n constructor(\n id: string | number = Generator.GenAutoIncrementId(),\n timeline: ITimeline = defaultTimeline,\n slience?: boolean\n ) {\n this.id = id;\n this.status = AnimateStatus.INITIAL;\n this._timeline = timeline;\n timeline.addAnimate(this);\n this.slience = slience;\n this._startTime = 0;\n this._duration = 0;\n this._totalDuration = 0;\n // this._reversed = false;\n this._loopCount = 0;\n this._currentLoop = 0;\n this._bounce = false;\n this._firstStep = null;\n this._lastStep = null;\n this._startProps = {};\n this._endProps = {};\n this._preventAttrs = new Set();\n this.currentTime = 0;\n this.interpolateUpdateFunction = null;\n this.priority = 0;\n }\n\n /**\n * 获取开始属性\n */\n getStartProps(): Record<string, any> {\n return this._startProps;\n }\n\n /**\n * 获取结束属性\n */\n getEndProps(): Record<string, any> {\n return this._endProps;\n }\n\n /**\n * 设置时间线\n */\n setTimeline(timeline: ITimeline): void {\n this._timeline = timeline;\n }\n\n /**\n * 获取时间线\n */\n getTimeline(): ITimeline {\n return this._timeline;\n }\n\n /**\n * 时间线属性访问器\n */\n get timeline(): ITimeline {\n return this._timeline;\n }\n\n /**\n * 绑定目标图形\n */\n bind(target: IGraphic): this {\n this.target = target;\n\n if (this.target.onAnimateBind && !this.slience) {\n this.target.onAnimateBind(this as any);\n }\n // 添加一个animationAttribute属性,用于存储动画过程中的属性\n if (!this.target.animationAttribute) {\n this.target.animationAttribute = {};\n }\n return this;\n }\n\n /**\n * 动画步骤:to\n * 添加一个to步骤,这会在当前状态到指定状态间进行插值\n */\n to(props: Record<string, any>, duration: number = 300, easing: EasingType = 'linear'): this {\n // 创建新的step\n const step = new Step(AnimateStepType.to, props, duration, easing);\n\n this.updateStepAfterAppend(step);\n\n step.bind(this.target, this);\n\n return this;\n }\n\n /**\n * 等待延迟\n */\n wait(delay: number): this {\n // 创建新的wait step\n const step = new WaitStep(AnimateStepType.wait, {}, delay, 'linear');\n\n // 如果是第一个step\n this.updateStepAfterAppend(step);\n\n step.bind(this.target, this);\n\n return this;\n }\n\n protected updateStepAfterAppend(step: IStep): void {\n // 如果是第一个step\n if (!this._firstStep) {\n this._firstStep = step;\n this._lastStep = step;\n } else {\n // 添加到链表末尾\n this._lastStep.append(step);\n this._lastStep = step;\n }\n\n this.parseStepProps(step);\n\n this.updateDuration();\n }\n\n /**\n * 解析step的props\n * 1. 预先获取step的propKeys并保存\n * 2. 将截止目前的最新props设置到step.props中,这样该props上的属性就是最终的属性了,跳帧时直接设置即可\n * 3. 同步到_endProps中,保存这个Animate实例的最终props\n * 4. 给step的props的原型链上绑定Animate的_startProps,这样在下一个step查找fromProps的时候,一定能拿得到值\n */\n parseStepProps(step: IStep) {\n if (!this._lastStep) {\n return;\n }\n\n /* 预设置step的属性,基于性能考虑,实现比较复杂 */\n // step.propKeys为真实的props属性的key\n step.propKeys = step.propKeys || Object.keys(step.props);\n // step.props为包含前序step的props的最终props,用于跳帧等场景,可以直接设置\n Object.keys(this._endProps).forEach(key => {\n step.props[key] = step.props[key] ?? this._endProps[key];\n });\n // 将最终的props设置到step.props中\n step.propKeys.forEach(key => {\n this._endProps[key] = step.props[key];\n });\n // 给step的props的原型链上绑定Animate的_startProps\n // 下一个step在查找上一个step.props(也就是找到它的fromProps)的时候,就能拿到初始的props了\n // 比如:\n // rect.animate().to({ x: 100 }, 1000, 'linear').to({ y: 100 }, 1000, 'linear');\n // 在第二个step查找fromProps的时候,就能拿到第一个step的endProps中的y值(在原型链上)\n // TODO 由于会有其他animate的干扰,所以不能直接设置原型链\n // Object.setPrototypeOf(step.props, this._startProps);\n }\n\n /**\n * 重新同步和计算props,用于内部某些step发生了变更后,重新计算自身\n * 性能较差,不要频繁调用\n * @returns\n */\n reSyncProps() {\n if (!this._lastStep) {\n return;\n }\n this._endProps = {};\n let currentStep: IStep = this._firstStep;\n // 从前向后寻找当前时间所在的step\n while (currentStep) {\n // step.props为包含前序step的props的最终props,用于跳帧等场景,可以直接设置\n // eslint-disable-next-line no-loop-func\n Object.keys(this._endProps).forEach(key => {\n currentStep.props[key] = currentStep.props[key] ?? this._endProps[key];\n });\n // 将最终的props设置到step.props中\n // eslint-disable-next-line no-loop-func\n currentStep.propKeys.forEach(key => {\n this._endProps[key] = currentStep.props[key];\n });\n // 给step的props的原型链上绑定Animate的_startProps\n // 下一个step在查找上一个step.props(也就是找到它的fromProps)的时候,就能拿到初始的props了\n // 比如:\n // rect.animate().to({ x: 100 }, 1000, 'linear').to({ y: 100 }, 1000, 'linear');\n // 在第二个step查找fromProps的时候,就能拿到第一个step的endProps中的y值(在原型链上)\n // TODO 由于会有其他animate的干扰,所以不能直接设置原型链\n // Object.setPrototypeOf(currentStep.props, this._startProps);\n currentStep = currentStep.next;\n }\n }\n\n /**\n * 动画步骤:from\n * 添加一个from步骤,这会将目标属性先设置为指定值,然后过渡到当前状态\n * 【注意】这可能会导致动画跳变,请谨慎使用\n */\n from(props: Record<string, any>, duration: number = 300, easing: EasingType = 'linear'): this {\n // 创建新的step\n const step = new Step(AnimateStepType.from, props, duration, easing);\n\n // 如果是第一个step\n if (!this._firstStep) {\n this._firstStep = step;\n this._lastStep = step;\n } else {\n // 添加到链表末尾\n this._lastStep.append(step);\n this._lastStep = step;\n }\n\n this.updateDuration();\n\n return this;\n }\n\n /**\n * 自定义动画\n */\n play(customAnimate: ICustomAnimate): this {\n this.updateStepAfterAppend(customAnimate);\n\n customAnimate.bind(this.target, this);\n\n return this;\n }\n\n /**\n * 暂停动画\n */\n pause(): void {\n if (this.status === AnimateStatus.RUNNING) {\n this.status = AnimateStatus.PAUSED;\n }\n }\n\n /**\n * 恢复动画\n */\n resume(): void {\n if (this.status === AnimateStatus.PAUSED) {\n this.status = AnimateStatus.RUNNING;\n }\n }\n\n /**\n * 注册开始回调\n */\n onStart(cb?: () => void): void {\n if (cb) {\n if (!this._onStart) {\n this._onStart = [];\n }\n this._onStart.push(cb);\n } else {\n this._onStart?.forEach(cb => cb());\n // 设置开始属性,Animate不会重复执行start所以不需要判断firstStart\n Object.keys(this._endProps).forEach(key => {\n this._startProps[key] = this.target.getComputedAttribute(key);\n });\n }\n }\n\n /**\n * 注册结束回调\n */\n onEnd(cb?: () => void): void {\n if (cb) {\n if (!this._onEnd) {\n this._onEnd = [];\n }\n this._onEnd.push(cb);\n } else {\n this._onEnd?.forEach(cb => cb());\n }\n }\n\n /**\n * 注册帧回调\n */\n onFrame(cb?: (step: IStep, ratio: number) => void): void {\n if (cb) {\n if (!this._onFrame) {\n this._onFrame = [];\n }\n this._onFrame.push(cb);\n }\n }\n\n /**\n * 注册移除回调\n */\n onRemove(cb?: () => void): void {\n if (cb) {\n if (!this._onRemove) {\n this._onRemove = [];\n }\n this._onRemove.push(cb);\n } else {\n this._onRemove?.forEach(cb => cb());\n }\n }\n\n /**\n * 屏蔽单个属性\n */\n preventAttr(key: string): void {\n this._preventAttrs.add(key);\n // 从所有step中移除该属性,并从自身的_startProps和_endProps中移除该属性\n delete this._startProps[key];\n delete this._endProps[key];\n let step = this._firstStep;\n while (step) {\n step.deleteSelfAttr(key);\n step = step.next;\n }\n }\n\n /**\n * 屏蔽多个属性\n */\n preventAttrs(keys: string[]): void {\n keys.forEach(key => this._preventAttrs.add(key));\n }\n\n /**\n * 检查属性是否合法(未被屏蔽)\n */\n validAttr(key: string): boolean {\n return !this._preventAttrs.has(key);\n }\n\n /**\n * 运行自定义回调\n */\n runCb(cb: (a: IAnimate, step: IStep) => void): IAnimate {\n this._lastStep?.onEnd(cb);\n return this;\n }\n\n /**\n * 设置动画开始时间\n */\n startAt(t: number): this {\n this._startTime = t;\n\n return this;\n }\n\n /**\n * 自定义插值函数,返回false表示没有匹配上\n */\n customInterpolate(\n key: string,\n ratio: number,\n from: any,\n to: any,\n target: IGraphic,\n ret: Record<string, any>\n ): boolean {\n // 默认无自定义插值,可由子类重写\n return false;\n }\n\n /**\n * 获取起始值,该起始值为animate的起始值,并不一定为step的起始值\n */\n getFromValue(): Record<string, any> {\n return this._startProps;\n }\n\n /**\n * 获取结束值\n */\n getToValue(): Record<string, any> {\n return this._endProps;\n }\n\n /**\n * 停止动画\n */\n stop(type?: 'start' | 'end' | Record<string, any>): void {\n // TODO 有些动画可能一添加就被删除\n // if (this.status === AnimateStatus.END) {\n // return;\n // }\n\n this.status = AnimateStatus.END;\n\n this.onEnd();\n\n if (!this.target) {\n return;\n }\n\n if (type === 'start') {\n // 设置为开始状态\n this.target.setAttributes(this._startProps);\n } else if (type === 'end') {\n // 设置为结束状态\n this.target.setAttributes(this._endProps);\n } else if (type) {\n // 设置为自定义状态\n this.target.setAttributes(type);\n }\n }\n\n /**\n * 释放动画资源\n */\n release(): void {\n this.status = AnimateStatus.END;\n\n // 触发移除回调\n if (this._onRemove) {\n this._onRemove.forEach(cb => cb());\n }\n\n // 清空回调\n this._onStart = [];\n this._onFrame = [];\n this._onEnd = [];\n this._onRemove = [];\n }\n\n /**\n * 获取动画持续时间\n */\n getDuration(): number {\n return this._duration;\n }\n\n /**\n * 获取动画开始时间\n */\n getStartTime(): number {\n return this._startTime;\n }\n\n /**\n * 在所有动画完成后执行\n */\n afterAll(list: IAnimate[]): this {\n if (!list || list.length === 0) {\n return this;\n }\n\n // 计算所有动画结束的最大时间点\n let maxEndTime = 0;\n list.forEach(animate => {\n const endTime = animate.getStartTime() + animate.getTotalDuration();\n maxEndTime = Math.max(maxEndTime, endTime);\n });\n\n // 设置当前动画的开始时间为最大结束时间\n return this.startAt(maxEndTime);\n }\n\n /**\n * 在指定动画完成后执行\n */\n after(animate: IAnimate): this {\n if (!animate) {\n return this;\n }\n\n // 计算指定动画结束的时间点\n const endTime = animate.getStartTime() + animate.getTotalDuration();\n\n // 设置当前动画的开始时间为结束时间\n return this.startAt(endTime);\n }\n\n /**\n * 并行执行动画\n */\n parallel(animate: IAnimate): this {\n if (!animate) {\n return this;\n }\n\n // 设置指定动画的开始时间为当前动画的开始时间\n this.startAt(animate.getStartTime());\n\n return this;\n }\n\n // /**\n // * 设置动画是否反转\n // */\n // reversed(r: boolean): this {\n // this._reversed = r;\n // return this;\n // }\n\n /**\n * 设置动画循环次数,如果传入true,则无限循环,如果传入false,则不循环\n */\n loop(n: number | boolean): this {\n if (n === true) {\n n = Infinity;\n } else if (n === false) {\n n = 0;\n }\n this._loopCount = n;\n this.updateDuration();\n return this;\n }\n\n /**\n * 设置动画是否反弹\n */\n bounce(b: boolean): this {\n this._bounce = b;\n return this;\n }\n\n /**\n * 推进动画\n */\n advance(delta: number): void {\n if (this.status === AnimateStatus.END) {\n console.warn('aaa 动画已经结束,不能推进');\n return;\n }\n const nextTime = this.currentTime + delta;\n // 如果还没开始,直接return\n if (nextTime < this._startTime) {\n this.currentTime = nextTime;\n return;\n }\n // 如果已经结束,设置状态后return\n if (nextTime >= this._startTime + this._totalDuration) {\n this._lastStep?.onEnd();\n this.onEnd();\n this.status = AnimateStatus.END;\n return;\n }\n\n this.status = AnimateStatus.RUNNING;\n\n // 如果是第一次运行,触发开始回调\n if (this.currentTime <= this._startTime) {\n this.onStart();\n }\n this.currentTime = nextTime;\n\n let cycleTime = nextTime - this._startTime;\n let newLoop = false;\n let bounceTime = false;\n if (this._loopCount > 0) {\n cycleTime = (nextTime - this._startTime) % this._duration;\n const currentLoop = Math.floor((nextTime - this._startTime) / this._duration);\n newLoop = currentLoop > this._currentLoop;\n this._currentLoop = currentLoop;\n\n bounceTime = this._bounce && currentLoop % 2 === 1;\n if (bounceTime) {\n cycleTime = this._duration - cycleTime;\n }\n }\n\n // 如果是新的循环,重置为初始状态\n if (newLoop && !bounceTime) {\n this.target.setAttributes(this._startProps);\n }\n\n // 选择起始步骤和遍历方向\n let targetStep: IStep | null = null;\n\n if (this._lastStep === this._firstStep) {\n targetStep = this._firstStep;\n } else {\n let currentStep: IStep = this._firstStep;\n // 从前向后寻找当前时间所在的step\n while (currentStep) {\n const stepStartTime = currentStep.getStartTime();\n const stepDuration = currentStep.getDuration();\n const stepEndTime = stepStartTime + stepDuration;\n\n // 找到当前周期时间所在的step\n if (cycleTime >= stepStartTime && cycleTime <= stepEndTime) {\n targetStep = currentStep;\n break;\n }\n\n currentStep = currentStep.next;\n }\n }\n\n // 如果没找到目标step(可能是所有step都执行完了,但整体动画还没结束,这正常是不存在的)\n if (!targetStep) {\n // this.currentTime = nextTime;\n // console.warn('动画出现问题');\n return;\n }\n\n // 计算当前step的进度比例(基于当前step内的相对时间)\n const stepStartTime = targetStep.getStartTime();\n const stepDuration = targetStep.getDuration();\n\n const ratio = (cycleTime - stepStartTime) / stepDuration;\n // // 限制ratio在0-1之间\n // ratio = Math.max(0, Math.min(1, ratio));\n\n const isEnd = ratio >= 1;\n targetStep.update(isEnd, ratio, {});\n\n // 如果step执行完毕\n if (isEnd) {\n targetStep.onEnd();\n // 不立即调用onFinish,让动画系统来决定何时结束\n }\n\n // 触发帧回调\n // if (this._onFrame) {\n // this._onFrame.forEach(cb => cb(targetStep, ratio));\n // }\n }\n\n updateDuration(): void {\n if (!this._lastStep) {\n this._duration = 0;\n return;\n }\n\n this._duration = this._lastStep.getStartTime() + this._lastStep.getDuration();\n this._totalDuration = this._duration * (this._loopCount + 1);\n }\n\n getTotalDuration(): number {\n return this._totalDuration;\n }\n\n getLoop(): number {\n return this._loopCount;\n }\n}\n"]}
|
|
@@ -0,0 +1,53 @@
|
|
|
1
|
+
import type { IGraphic, IGroup } from '@visactor/vrender-core';
|
|
2
|
+
import { ACustomAnimate } from './custom-animate';
|
|
3
|
+
import type { EasingType } from '../intreface/easing';
|
|
4
|
+
export declare class ClipGraphicAnimate extends ACustomAnimate<any> {
|
|
5
|
+
private _group?;
|
|
6
|
+
private _clipGraphic?;
|
|
7
|
+
protected clipFromAttribute?: any;
|
|
8
|
+
protected clipToAttribute?: any;
|
|
9
|
+
private _lastClip?;
|
|
10
|
+
private _lastPath?;
|
|
11
|
+
constructor(from: any, to: any, duration: number, easing: EasingType, params: {
|
|
12
|
+
group: IGroup;
|
|
13
|
+
clipGraphic: IGraphic;
|
|
14
|
+
});
|
|
15
|
+
onBind(): void;
|
|
16
|
+
onEnd(): void;
|
|
17
|
+
onUpdate(end: boolean, ratio: number, out: Record<string, any>): void;
|
|
18
|
+
}
|
|
19
|
+
export declare class ClipAngleAnimate extends ClipGraphicAnimate {
|
|
20
|
+
constructor(from: any, to: any, duration: number, easing: EasingType, params: {
|
|
21
|
+
group: IGroup;
|
|
22
|
+
center?: {
|
|
23
|
+
x: number;
|
|
24
|
+
y: number;
|
|
25
|
+
};
|
|
26
|
+
startAngle?: number;
|
|
27
|
+
radius?: number;
|
|
28
|
+
orient?: 'clockwise' | 'anticlockwise';
|
|
29
|
+
animationType?: 'in' | 'out';
|
|
30
|
+
});
|
|
31
|
+
}
|
|
32
|
+
export declare class ClipRadiusAnimate extends ClipGraphicAnimate {
|
|
33
|
+
constructor(from: any, to: any, duration: number, easing: EasingType, params: {
|
|
34
|
+
group: IGroup;
|
|
35
|
+
center?: {
|
|
36
|
+
x: number;
|
|
37
|
+
y: number;
|
|
38
|
+
};
|
|
39
|
+
startRadius?: number;
|
|
40
|
+
endRadius?: number;
|
|
41
|
+
animationType?: 'in' | 'out';
|
|
42
|
+
});
|
|
43
|
+
}
|
|
44
|
+
export declare class ClipDirectionAnimate extends ClipGraphicAnimate {
|
|
45
|
+
constructor(from: any, to: any, duration: number, easing: EasingType, params: {
|
|
46
|
+
group: IGroup;
|
|
47
|
+
direction?: 'x' | 'y';
|
|
48
|
+
orient?: 'positive' | 'negative';
|
|
49
|
+
width?: number;
|
|
50
|
+
height?: number;
|
|
51
|
+
animationType?: 'in' | 'out';
|
|
52
|
+
});
|
|
53
|
+
}
|
|
@@ -0,0 +1,134 @@
|
|
|
1
|
+
import { application, AttributeUpdateType } from "@visactor/vrender-core";
|
|
2
|
+
|
|
3
|
+
import { ACustomAnimate } from "./custom-animate";
|
|
4
|
+
|
|
5
|
+
export class ClipGraphicAnimate extends ACustomAnimate {
|
|
6
|
+
constructor(from, to, duration, easing, params) {
|
|
7
|
+
super(null, null, duration, easing, params), this.clipFromAttribute = from, this.clipToAttribute = to,
|
|
8
|
+
this._group = null == params ? void 0 : params.group, this._clipGraphic = null == params ? void 0 : params.clipGraphic;
|
|
9
|
+
}
|
|
10
|
+
onBind() {
|
|
11
|
+
this._group && this._clipGraphic && (this._lastClip = this._group.attribute.clip,
|
|
12
|
+
this._lastPath = this._group.attribute.path, this._group.setAttributes({
|
|
13
|
+
clip: !0,
|
|
14
|
+
path: [ this._clipGraphic ]
|
|
15
|
+
}, !1, {
|
|
16
|
+
type: AttributeUpdateType.ANIMATE_BIND
|
|
17
|
+
}));
|
|
18
|
+
}
|
|
19
|
+
onEnd() {
|
|
20
|
+
this._group && this._group.setAttributes({
|
|
21
|
+
clip: this._lastClip,
|
|
22
|
+
path: this._lastPath
|
|
23
|
+
}, !1, {
|
|
24
|
+
type: AttributeUpdateType.ANIMATE_END
|
|
25
|
+
});
|
|
26
|
+
}
|
|
27
|
+
onUpdate(end, ratio, out) {
|
|
28
|
+
if (!this._clipGraphic) return;
|
|
29
|
+
const res = {};
|
|
30
|
+
Object.keys(this.clipFromAttribute).forEach((k => {
|
|
31
|
+
res[k] = this.clipFromAttribute[k] + (this.clipToAttribute[k] - this.clipFromAttribute[k]) * ratio;
|
|
32
|
+
})), this._clipGraphic.setAttributes(res, !1, {
|
|
33
|
+
type: AttributeUpdateType.ANIMATE_UPDATE,
|
|
34
|
+
animationState: {
|
|
35
|
+
ratio: ratio,
|
|
36
|
+
end: end
|
|
37
|
+
}
|
|
38
|
+
});
|
|
39
|
+
}
|
|
40
|
+
}
|
|
41
|
+
|
|
42
|
+
export class ClipAngleAnimate extends ClipGraphicAnimate {
|
|
43
|
+
constructor(from, to, duration, easing, params) {
|
|
44
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m;
|
|
45
|
+
const groupAttribute = null !== (_b = null === (_a = null == params ? void 0 : params.group) || void 0 === _a ? void 0 : _a.attribute) && void 0 !== _b ? _b : {}, width = null !== (_c = groupAttribute.width) && void 0 !== _c ? _c : 0, height = null !== (_d = groupAttribute.height) && void 0 !== _d ? _d : 0, animationType = null !== (_e = null == params ? void 0 : params.animationType) && void 0 !== _e ? _e : "in", startAngle = null !== (_f = null == params ? void 0 : params.startAngle) && void 0 !== _f ? _f : 0, orient = null !== (_g = null == params ? void 0 : params.orient) && void 0 !== _g ? _g : "clockwise";
|
|
46
|
+
let arcStartAngle = 0, arcEndAngle = 0;
|
|
47
|
+
"anticlockwise" === orient ? (arcEndAngle = "in" === animationType ? startAngle + 2 * Math.PI : startAngle,
|
|
48
|
+
arcEndAngle = startAngle + 2 * Math.PI) : (arcStartAngle = startAngle, arcEndAngle = "out" === animationType ? startAngle + 2 * Math.PI : startAngle);
|
|
49
|
+
const arc = application.graphicService.creator.arc({
|
|
50
|
+
x: null !== (_j = null === (_h = null == params ? void 0 : params.center) || void 0 === _h ? void 0 : _h.x) && void 0 !== _j ? _j : width / 2,
|
|
51
|
+
y: null !== (_l = null === (_k = null == params ? void 0 : params.center) || void 0 === _k ? void 0 : _k.y) && void 0 !== _l ? _l : height / 2,
|
|
52
|
+
outerRadius: null !== (_m = null == params ? void 0 : params.radius) && void 0 !== _m ? _m : (width + height) / 2,
|
|
53
|
+
innerRadius: 0,
|
|
54
|
+
startAngle: arcStartAngle,
|
|
55
|
+
endAngle: arcEndAngle,
|
|
56
|
+
fill: !0
|
|
57
|
+
});
|
|
58
|
+
let fromAttributes, toAttributes;
|
|
59
|
+
"anticlockwise" === orient ? (fromAttributes = {
|
|
60
|
+
startAngle: startAngle + 2 * Math.PI
|
|
61
|
+
}, toAttributes = {
|
|
62
|
+
startAngle: startAngle
|
|
63
|
+
}) : (fromAttributes = {
|
|
64
|
+
endAngle: startAngle
|
|
65
|
+
}, toAttributes = {
|
|
66
|
+
endAngle: startAngle + 2 * Math.PI
|
|
67
|
+
}), super("in" === animationType ? fromAttributes : toAttributes, "in" === animationType ? toAttributes : fromAttributes, duration, easing, {
|
|
68
|
+
group: null == params ? void 0 : params.group,
|
|
69
|
+
clipGraphic: arc
|
|
70
|
+
});
|
|
71
|
+
}
|
|
72
|
+
}
|
|
73
|
+
|
|
74
|
+
export class ClipRadiusAnimate extends ClipGraphicAnimate {
|
|
75
|
+
constructor(from, to, duration, easing, params) {
|
|
76
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
|
|
77
|
+
const groupAttribute = null !== (_b = null === (_a = null == params ? void 0 : params.group) || void 0 === _a ? void 0 : _a.attribute) && void 0 !== _b ? _b : {}, width = null !== (_c = groupAttribute.width) && void 0 !== _c ? _c : 0, height = null !== (_d = groupAttribute.height) && void 0 !== _d ? _d : 0, animationType = null !== (_e = null == params ? void 0 : params.animationType) && void 0 !== _e ? _e : "in", startRadius = null !== (_f = null == params ? void 0 : params.startRadius) && void 0 !== _f ? _f : 0, endRadius = null !== (_g = null == params ? void 0 : params.endRadius) && void 0 !== _g ? _g : Math.sqrt((width / 2) ** 2 + (height / 2) ** 2), arc = application.graphicService.creator.arc({
|
|
78
|
+
x: null !== (_j = null === (_h = null == params ? void 0 : params.center) || void 0 === _h ? void 0 : _h.x) && void 0 !== _j ? _j : width / 2,
|
|
79
|
+
y: null !== (_l = null === (_k = null == params ? void 0 : params.center) || void 0 === _k ? void 0 : _k.y) && void 0 !== _l ? _l : height / 2,
|
|
80
|
+
outerRadius: "out" === animationType ? endRadius : startRadius,
|
|
81
|
+
innerRadius: 0,
|
|
82
|
+
startAngle: 0,
|
|
83
|
+
endAngle: 2 * Math.PI,
|
|
84
|
+
fill: !0
|
|
85
|
+
}), fromAttributes = {
|
|
86
|
+
outerRadius: startRadius
|
|
87
|
+
}, toAttributes = {
|
|
88
|
+
outerRadius: endRadius
|
|
89
|
+
};
|
|
90
|
+
super("in" === animationType ? fromAttributes : toAttributes, "in" === animationType ? toAttributes : fromAttributes, duration, easing, {
|
|
91
|
+
group: null == params ? void 0 : params.group,
|
|
92
|
+
clipGraphic: arc
|
|
93
|
+
});
|
|
94
|
+
}
|
|
95
|
+
}
|
|
96
|
+
|
|
97
|
+
export class ClipDirectionAnimate extends ClipGraphicAnimate {
|
|
98
|
+
constructor(from, to, duration, easing, params) {
|
|
99
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j;
|
|
100
|
+
const groupAttribute = null !== (_b = null === (_a = null == params ? void 0 : params.group) || void 0 === _a ? void 0 : _a.attribute) && void 0 !== _b ? _b : {}, width = null !== (_d = null !== (_c = null == params ? void 0 : params.width) && void 0 !== _c ? _c : groupAttribute.width) && void 0 !== _d ? _d : 0, height = null !== (_f = null !== (_e = null == params ? void 0 : params.height) && void 0 !== _e ? _e : groupAttribute.height) && void 0 !== _f ? _f : 0, animationType = null !== (_g = null == params ? void 0 : params.animationType) && void 0 !== _g ? _g : "in", direction = null !== (_h = null == params ? void 0 : params.direction) && void 0 !== _h ? _h : "x", orient = null !== (_j = null == params ? void 0 : params.orient) && void 0 !== _j ? _j : "positive", rect = application.graphicService.creator.rect({
|
|
101
|
+
x: 0,
|
|
102
|
+
y: 0,
|
|
103
|
+
width: "in" === animationType && "x" === direction ? 0 : width,
|
|
104
|
+
height: "in" === animationType && "y" === direction ? 0 : height,
|
|
105
|
+
fill: !0
|
|
106
|
+
});
|
|
107
|
+
let fromAttributes = {}, toAttributes = {};
|
|
108
|
+
"y" === direction ? "negative" === orient ? (fromAttributes = {
|
|
109
|
+
y: height,
|
|
110
|
+
height: 0
|
|
111
|
+
}, toAttributes = {
|
|
112
|
+
y: 0,
|
|
113
|
+
height: height
|
|
114
|
+
}) : (fromAttributes = {
|
|
115
|
+
height: 0
|
|
116
|
+
}, toAttributes = {
|
|
117
|
+
height: height
|
|
118
|
+
}) : "negative" === orient ? (fromAttributes = {
|
|
119
|
+
x: width,
|
|
120
|
+
width: 0
|
|
121
|
+
}, toAttributes = {
|
|
122
|
+
x: 0,
|
|
123
|
+
width: width
|
|
124
|
+
}) : (fromAttributes = {
|
|
125
|
+
width: 0
|
|
126
|
+
}, toAttributes = {
|
|
127
|
+
width: width
|
|
128
|
+
}), super("in" === animationType ? fromAttributes : toAttributes, "in" === animationType ? toAttributes : fromAttributes, duration, easing, {
|
|
129
|
+
group: null == params ? void 0 : params.group,
|
|
130
|
+
clipGraphic: rect
|
|
131
|
+
});
|
|
132
|
+
}
|
|
133
|
+
}
|
|
134
|
+
//# sourceMappingURL=clip-graphic.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/custom/clip-graphic.ts"],"names":[],"mappings":"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","file":"clip-graphic.js","sourcesContent":["import type { IArcGraphicAttribute, IGraphic, IGroup, IRectGraphicAttribute } from '@visactor/vrender-core';\nimport { application, AttributeUpdateType } from '@visactor/vrender-core';\nimport { ACustomAnimate } from './custom-animate';\nimport type { EasingType } from '../intreface/easing';\n\nexport class ClipGraphicAnimate extends ACustomAnimate<any> {\n private _group?: IGroup;\n private _clipGraphic?: IGraphic;\n protected clipFromAttribute?: any;\n protected clipToAttribute?: any;\n\n private _lastClip?: boolean;\n private _lastPath?: IGraphic[];\n\n constructor(\n from: any,\n to: any,\n duration: number,\n easing: EasingType,\n params: { group: IGroup; clipGraphic: IGraphic }\n ) {\n super(null, null, duration, easing, params);\n this.clipFromAttribute = from;\n this.clipToAttribute = to;\n this._group = params?.group;\n this._clipGraphic = params?.clipGraphic;\n }\n\n onBind() {\n if (this._group && this._clipGraphic) {\n this._lastClip = this._group.attribute.clip;\n this._lastPath = this._group.attribute.path;\n this._group.setAttributes(\n {\n clip: true,\n path: [this._clipGraphic]\n },\n false,\n { type: AttributeUpdateType.ANIMATE_BIND }\n );\n }\n }\n\n onEnd() {\n if (this._group) {\n this._group.setAttributes(\n {\n clip: this._lastClip,\n path: this._lastPath\n },\n false,\n { type: AttributeUpdateType.ANIMATE_END }\n );\n }\n return;\n }\n\n onUpdate(end: boolean, ratio: number, out: Record<string, any>): void {\n if (!this._clipGraphic) {\n return;\n }\n const res: any = {};\n Object.keys(this.clipFromAttribute).forEach(k => {\n res[k] = this.clipFromAttribute[k] + (this.clipToAttribute[k] - this.clipFromAttribute[k]) * ratio;\n });\n this._clipGraphic.setAttributes(res, false, {\n type: AttributeUpdateType.ANIMATE_UPDATE,\n animationState: { ratio, end }\n });\n }\n}\n\nexport class ClipAngleAnimate extends ClipGraphicAnimate {\n constructor(\n from: any,\n to: any,\n duration: number,\n easing: EasingType,\n params: {\n group: IGroup;\n center?: { x: number; y: number };\n startAngle?: number;\n radius?: number;\n orient?: 'clockwise' | 'anticlockwise';\n animationType?: 'in' | 'out';\n }\n ) {\n const groupAttribute = params?.group?.attribute ?? {};\n const width = groupAttribute.width ?? 0;\n const height = groupAttribute.height ?? 0;\n\n const animationType = params?.animationType ?? 'in';\n const startAngle = params?.startAngle ?? 0;\n const orient = params?.orient ?? 'clockwise';\n\n let arcStartAngle = 0;\n let arcEndAngle = 0;\n if (orient === 'anticlockwise') {\n arcEndAngle = animationType === 'in' ? startAngle + Math.PI * 2 : startAngle;\n arcEndAngle = startAngle + Math.PI * 2;\n } else {\n arcStartAngle = startAngle;\n arcEndAngle = animationType === 'out' ? startAngle + Math.PI * 2 : startAngle;\n }\n const arc = application.graphicService.creator.arc({\n x: params?.center?.x ?? width / 2,\n y: params?.center?.y ?? height / 2,\n outerRadius: params?.radius ?? (width + height) / 2,\n innerRadius: 0,\n startAngle: arcStartAngle,\n endAngle: arcEndAngle,\n fill: true\n });\n let fromAttributes: Partial<IArcGraphicAttribute>;\n let toAttributes: Partial<IArcGraphicAttribute>;\n if (orient === 'anticlockwise') {\n fromAttributes = { startAngle: startAngle + Math.PI * 2 };\n toAttributes = { startAngle: startAngle };\n } else {\n fromAttributes = { endAngle: startAngle };\n toAttributes = { endAngle: startAngle + Math.PI * 2 };\n }\n super(\n animationType === 'in' ? fromAttributes : toAttributes,\n animationType === 'in' ? toAttributes : fromAttributes,\n duration,\n easing,\n { group: params?.group, clipGraphic: arc }\n );\n }\n}\n\nexport class ClipRadiusAnimate extends ClipGraphicAnimate {\n constructor(\n from: any,\n to: any,\n duration: number,\n easing: EasingType,\n params: {\n group: IGroup;\n center?: { x: number; y: number };\n startRadius?: number;\n endRadius?: number;\n animationType?: 'in' | 'out';\n }\n ) {\n const groupAttribute = params?.group?.attribute ?? {};\n const width = groupAttribute.width ?? 0;\n const height = groupAttribute.height ?? 0;\n\n const animationType = params?.animationType ?? 'in';\n const startRadius = params?.startRadius ?? 0;\n const endRadius = params?.endRadius ?? Math.sqrt((width / 2) ** 2 + (height / 2) ** 2);\n\n const arc = application.graphicService.creator.arc({\n x: params?.center?.x ?? width / 2,\n y: params?.center?.y ?? height / 2,\n outerRadius: animationType === 'out' ? endRadius : startRadius,\n innerRadius: 0,\n startAngle: 0,\n endAngle: Math.PI * 2,\n fill: true\n });\n const fromAttributes: Partial<IArcGraphicAttribute> = { outerRadius: startRadius };\n const toAttributes: Partial<IArcGraphicAttribute> = { outerRadius: endRadius };\n super(\n animationType === 'in' ? fromAttributes : toAttributes,\n animationType === 'in' ? toAttributes : fromAttributes,\n duration,\n easing,\n { group: params?.group, clipGraphic: arc }\n );\n }\n}\n\nexport class ClipDirectionAnimate extends ClipGraphicAnimate {\n constructor(\n from: any,\n to: any,\n duration: number,\n easing: EasingType,\n params: {\n group: IGroup;\n direction?: 'x' | 'y';\n orient?: 'positive' | 'negative';\n width?: number;\n height?: number;\n animationType?: 'in' | 'out';\n }\n ) {\n const groupAttribute = params?.group?.attribute ?? {};\n const width = params?.width ?? groupAttribute.width ?? 0;\n const height = params?.height ?? groupAttribute.height ?? 0;\n\n const animationType = params?.animationType ?? 'in';\n const direction = params?.direction ?? 'x';\n const orient = params?.orient ?? 'positive';\n\n const rect = application.graphicService.creator.rect({\n x: 0,\n y: 0,\n width: animationType === 'in' && direction === 'x' ? 0 : width,\n height: animationType === 'in' && direction === 'y' ? 0 : height,\n fill: true\n });\n let fromAttributes: Partial<IRectGraphicAttribute> = {};\n let toAttributes: Partial<IRectGraphicAttribute> = {};\n if (direction === 'y') {\n if (orient === 'negative') {\n fromAttributes = { y: height, height: 0 };\n toAttributes = { y: 0, height: height };\n } else {\n fromAttributes = { height: 0 };\n toAttributes = { height: height };\n }\n } else {\n if (orient === 'negative') {\n fromAttributes = { x: width, width: 0 };\n toAttributes = { x: 0, width: width };\n } else {\n fromAttributes = { width: 0 };\n toAttributes = { width: width };\n }\n }\n super(\n animationType === 'in' ? fromAttributes : toAttributes,\n animationType === 'in' ? toAttributes : fromAttributes,\n duration,\n easing,\n { group: params?.group, clipGraphic: rect }\n );\n }\n}\n"]}
|