mirror of
https://github.com/EsotericSoftware/spine-runtimes.git
synced 2026-02-04 14:24:53 +08:00
[ts][webcomponents] holdDurationLastAnimation to repeatDelay.
This commit is contained in:
parent
b588b95d76
commit
335d0ed17f
@ -767,11 +767,11 @@
|
||||
<li><code>mixDuration</code>: the mix duration between this animation and the previous one (not used for the first animation on a track)</li>
|
||||
</ol>
|
||||
|
||||
<p>To loop a track once it reaches the end, add the special group <code>[loop, trackNumber, holdDurationLastAnimation]</code>, where:</p>
|
||||
<p>To loop a track once it reaches the end, add the special group <code>[loop, trackNumber, repeatDelay]</code>, where:</p>
|
||||
<ul>
|
||||
<li><code>loop</code>: identifies this as a loop instruction</li>
|
||||
<li><code>trackNumber</code>: the number of the track to loop</li>
|
||||
<li><code>holdDurationLastAnimation</code>: the number of seconds to wait after the last animation is completed before repeating the loop</li>
|
||||
<li><code>repeatDelay</code>: the number of seconds to wait after the last animation is completed before repeating the loop</li>
|
||||
</ul>
|
||||
|
||||
<p>The parameters of the first group on each track are passed to the <code>setAnimation</code> method, while the remaining groups use <code>addAnimation</code>.</p>
|
||||
|
||||
@ -60,7 +60,7 @@ export type OffScreenUpdateBehaviourType = "pause" | "update" | "pose";
|
||||
export type FitType = "fill" | "width" | "height" | "contain" | "cover" | "none" | "scaleDown" | "origin";
|
||||
export type AnimationsInfo = Record<string, {
|
||||
cycle?: boolean,
|
||||
holdDurationLastAnimation?: number;
|
||||
repeatDelay?: number;
|
||||
animations: Array<AnimationsType>
|
||||
}>;
|
||||
export type AnimationsType = { animationName: string | "#EMPTY#", loop?: boolean, delay?: number, mixDuration?: number };
|
||||
@ -1027,7 +1027,7 @@ export class SpineWebComponentSkeleton extends HTMLElement implements Disposable
|
||||
state.data.defaultMix = defaultMix;
|
||||
|
||||
if (animationsInfo) {
|
||||
for (const [trackIndexString, { cycle, animations, holdDurationLastAnimation }] of Object.entries(animationsInfo)) {
|
||||
for (const [trackIndexString, { cycle, animations, repeatDelay }] of Object.entries(animationsInfo)) {
|
||||
const cycleFn = () => {
|
||||
const trackIndex = Number(trackIndexString);
|
||||
for (const [index, { animationName, delay, loop, mixDuration }] of animations.entries()) {
|
||||
@ -1051,8 +1051,8 @@ export class SpineWebComponentSkeleton extends HTMLElement implements Disposable
|
||||
if (cycle && index === animations.length - 1) {
|
||||
track.listener = {
|
||||
complete: () => {
|
||||
if (holdDurationLastAnimation)
|
||||
setTimeout(() => cycleFn(), 1000 * holdDurationLastAnimation);
|
||||
if (repeatDelay)
|
||||
setTimeout(() => cycleFn(), 1000 * repeatDelay);
|
||||
else
|
||||
cycleFn();
|
||||
delete track.listener?.complete;
|
||||
|
||||
@ -102,7 +102,7 @@ function castToAnimationsInfo (value: string | null): AnimationsInfo | undefined
|
||||
if (!matches) return undefined;
|
||||
|
||||
return matches.reduce((obj, group) => {
|
||||
const [trackIndexStringOrLoopDefinition, animationNameOrTrackIndexStringCycle, loopOrHoldDurationLastAnimation, delayString, mixDurationString] = group.slice(1, -1).split(',').map(v => v.trim());
|
||||
const [trackIndexStringOrLoopDefinition, animationNameOrTrackIndexStringCycle, loopOrRepeatDelay, delayString, mixDurationString] = group.slice(1, -1).split(',').map(v => v.trim());
|
||||
|
||||
if (trackIndexStringOrLoopDefinition === "loop") {
|
||||
if (!Number.isInteger(Number(animationNameOrTrackIndexStringCycle))) {
|
||||
@ -111,12 +111,12 @@ function castToAnimationsInfo (value: string | null): AnimationsInfo | undefined
|
||||
const animationInfoObject = obj[animationNameOrTrackIndexStringCycle] ||= { animations: [] };
|
||||
animationInfoObject.cycle = true;
|
||||
|
||||
if (loopOrHoldDurationLastAnimation !== undefined) {
|
||||
const holdDurationLastAnimation = Number(loopOrHoldDurationLastAnimation);
|
||||
if (Number.isNaN(holdDurationLastAnimation)) {
|
||||
throw new Error(`If present, duration of last animation of cycle in ${group} must be a positive integer number, instead it is ${loopOrHoldDurationLastAnimation}. Original value: ${value}`);
|
||||
if (loopOrRepeatDelay !== undefined) {
|
||||
const repeatDelay = Number(loopOrRepeatDelay);
|
||||
if (Number.isNaN(repeatDelay)) {
|
||||
throw new Error(`If present, duration of last animation of cycle in ${group} must be a positive integer number, instead it is ${loopOrRepeatDelay}. Original value: ${value}`);
|
||||
}
|
||||
animationInfoObject.holdDurationLastAnimation = holdDurationLastAnimation;
|
||||
animationInfoObject.repeatDelay = repeatDelay;
|
||||
}
|
||||
|
||||
return obj;
|
||||
@ -146,7 +146,7 @@ function castToAnimationsInfo (value: string | null): AnimationsInfo | undefined
|
||||
const animationInfoObject = obj[trackIndexStringOrLoopDefinition] ||= { animations: [] };
|
||||
animationInfoObject.animations.push({
|
||||
animationName: animationNameOrTrackIndexStringCycle,
|
||||
loop: loopOrHoldDurationLastAnimation.trim().toLowerCase() === "true",
|
||||
loop: loopOrRepeatDelay.trim().toLowerCase() === "true",
|
||||
delay,
|
||||
mixDuration,
|
||||
});
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user