From b35fe0e0fe234669d266318b5ef901ee9d822846 Mon Sep 17 00:00:00 2001
From: "xuying.xu" <xuying.xu@alibaba-inc.com>
Date: Fri, 21 Jun 2024 17:57:03 +0800
Subject: [PATCH] =?UTF-8?q?fix:=20=E8=B7=B3=E8=BD=AC=E8=B6=85=E5=87=BA?=
 =?UTF-8?q?=E6=80=BB=E6=97=B6=E9=95=BF?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 packages/f-engine/src/canvas/timeline.ts      |  14 +++--
 ...00\273\346\227\266\351\225\277-1-snap.png" | Bin 0 -> 1980 bytes
 .../f-engine/test/timeline/player.test.tsx    |  54 ++++++++++++++++++
 3 files changed, 64 insertions(+), 4 deletions(-)
 create mode 100644 "packages/f-engine/test/timeline/__image_snapshots__/player-test-tsx-clip-animation-\350\267\263\350\275\254\350\266\205\345\207\272\346\200\273\346\227\266\351\225\277-1-snap.png"

diff --git a/packages/f-engine/src/canvas/timeline.ts b/packages/f-engine/src/canvas/timeline.ts
index ae9cace6..9bed94e6 100644
--- a/packages/f-engine/src/canvas/timeline.ts
+++ b/packages/f-engine/src/canvas/timeline.ts
@@ -119,22 +119,28 @@ class Timeline extends EE {
     const { frame, animUnits, playState } = this;
     let target;
 
-    for (let i = 0; i < animUnits.length; i++) {
-      const cur = animUnits[i];
-      target = i;
-      if (time > cur.time) {
+    for (target = 0; target < animUnits.length; target++) {
+      const cur = animUnits[target];
+      if (time >= cur.time) {
         time -= cur.time; // 计算剩余时间
       } else {
         break;
       }
     }
 
+    // 超出了总时长
+    if (target === animUnits.length && time > 0) {
+      this.setPlayState('finish');
+      return;
+    }
+
     if (frame !== target) {
       this.frame = target;
       this.drawFrame();
       this.animator.run();
       this.setPlayState(playState);
     }
+
     this.animator.goTo(time);
   }
 }
diff --git "a/packages/f-engine/test/timeline/__image_snapshots__/player-test-tsx-clip-animation-\350\267\263\350\275\254\350\266\205\345\207\272\346\200\273\346\227\266\351\225\277-1-snap.png" "b/packages/f-engine/test/timeline/__image_snapshots__/player-test-tsx-clip-animation-\350\267\263\350\275\254\350\266\205\345\207\272\346\200\273\346\227\266\351\225\277-1-snap.png"
new file mode 100644
index 0000000000000000000000000000000000000000..863f60f319da6dbc20ee82c0f6a05dcf4fce5ed9
GIT binary patch
literal 1980
zcmeAS@N?(olHy`uVBq!ia0y~yVAKJ!A9An($)cK$)eH>m&7LlfAr*0NuWaOGFce^R
z-2H#i|84;tzGFKrj1S&>Kj*#8pLdquAHM%7#mKbqfascl+nP))YK#YG{pjHo&|qa*
zeWk3Mq0!S}gPL736N?w)L9MNKl^ha;1lDw(pTW==<gmdjcRPo`3>KE`N5*On3q%Cg
z1l`sh;YPgMVy5QM;Gm%pp|~xWg(HWlY3t8OVFdv$j<AlmB8*J48xnHsuCZ{mFg1xL
zS-UnIP*aGQJ>L`<0}TnSH~a(@HgIxWdzS7yYQ$(*jHZjxJTh8d4B@i#1M>vafJgOx
SbDjZfWd=`IKbLh*2~7Yqs;Qy?

literal 0
HcmV?d00001

diff --git a/packages/f-engine/test/timeline/player.test.tsx b/packages/f-engine/test/timeline/player.test.tsx
index be86ca01..a9e2d6e4 100644
--- a/packages/f-engine/test/timeline/player.test.tsx
+++ b/packages/f-engine/test/timeline/player.test.tsx
@@ -372,4 +372,58 @@ describe('clip animation', () => {
 
     expect(context).toMatchImageSnapshot();
   });
+
+  it('跳转超出总时长', async () => {
+    const context = createContext('跳转超出总时长');
+
+    //结束后重播
+    const { props } = (
+      <Canvas context={context}>
+        <Player
+          state="finish"
+          keyFrames={[
+            {
+              view: {
+                to: {
+                  visible: true,
+                },
+                duration: 1000,
+              },
+            },
+          ]}
+        >
+          <View key={'view'} visible={false} />
+        </Player>
+      </Canvas>
+    );
+
+    const canvas = new Canvas(props);
+    await canvas.render();
+    await delay(100);
+
+    const { props: newProps } = (
+      <Canvas context={context}>
+        <Player
+          state="pause"
+          goTo={1200}
+          keyFrames={[
+            {
+              view: {
+                to: {
+                  visible: true,
+                },
+                duration: 1000,
+              },
+            },
+          ]}
+        >
+          <View key={'view'} visible={false} />
+        </Player>
+      </Canvas>
+    );
+
+    await canvas.update(newProps);
+    await delay(100);
+    expect(context).toMatchImageSnapshot();
+  });
 });