利用兩層相同圖片序列錯開關鍵幀、刪除重疊幀,實現水平無縫循環滾動,無 ActionScript,純時間軸動畫,效能高、邏輯簡單。
製作步驟
1. 準備圖片序列元件
- 匯入多張圖片至庫,關閉「使用導入的 JPEG 品質」減小體積。
- 插入 → 新建元件 類型圖形,命名
picStrip。
- 進入編輯模式,將所有圖片首尾相接水平排列拼成長條。
2. 第一層補間動畫(主滾動)
- 主場景第 1 層拖入
picStrip,對齊面板 相對舞台、左對齊、垂直置中。
- 第 101 幀插入關鍵幀,將元件水平左移直到右邊緣與舞台左邊緣對齊(即移動一個完整圖片序列寬度)。
- 第 1 幀右鍵 創建移動補間。
- 第 1 層第 1 幀 複製幀(右鍵複製幀)。
3. 第二層銜接動畫(無縫關鍵)
- 新增第 2 層,第 1 幀 貼上到當前位置(編輯 → 貼上到當前位置),畫面與第 1 層第 1 幀完全重疊。
- 第 101 幀插入關鍵幀。
- 第 1 幀將元件水平右移,使其左邊緣與第 1 層元件右邊緣完美對接(無縫銜接)。
- 第 1 幀右鍵 創建移動補間。
4. 關鍵:刪除重疊幀消除停頓
- 按住 Shift 同時選中第 1、2 層第 100 幀 → 右鍵插入關鍵幀。
- 同樣選中第 1、2 層第 101 幀 → 右鍵刪除幀。
原理:第 101 幀原本是兩層動畫的終點,與第 1 幀位置完全相同,若保留會導致第 101 幀與第 1 幀連續播放時出現 1 幀停頓。刪除第 101 幀後,第 100 幀直接循環回第 1 幀,位置完美銜接,實現真正無縫循環。
優缺點與應用
- 優點:零代碼、CPU 佔用極低、易於調整速度(改幀數)、圖片數量任意增減。
- 缺點:長序列會增加 SWF 體積;需互動控制(暫停/加速/跳轉)時須改用 AS 驅動。
- 應用:新聞跑馬燈、產品展示輪播、背景長景滾動、遊戲地圖循環。
此「雙層錯開 + 刪除終幀」技巧是 Flash 時代無縫滾動的標準解法,邏輯清晰且極其穩健。