萬盛學電腦網

您现在的位置: 萬盛學電腦網 >> 軟體知識 >  >> 影像處理 >> Flash 教學

Flash AS3 教學:製作百葉窗轉場特效

利用 Flash AS3 內建的 fl.transitions.TransitionManager,只需幾行程式碼即可為圖片套用百葉窗轉場效果,適合初學者快速上手轉場動畫。

製作步驟

1. 準備文件與素材

  • 新建 ActionScript 3.0 文件,按 Ctrl+J 設定文件屬性:背景色任意、舞台大小與圖片尺寸一致、影格率設為 38 fps。
  • 匯入一張圖片到舞台,按 F8 轉為 影片剪輯,實例名稱設為 Photo。

2. 建立觸發按鈕

新增圖層,繪製文字按鈕(如「百葉窗」),轉為 按鈕元件,實例名稱設為 myButton,置於舞台適當位置。

3. 加入轉場程式碼

再新增一個圖層命名為「actions」,選取第 1 幀輸入:

import fl.transitions.*;
import fl.transitions.easing.*;

myButton.addEventListener(MouseEvent.CLICK, blindsMyObject);

function blindsMyObject(event:MouseEvent):void {
    TransitionManager.start(Photo, {
        type: Blinds,
        direction: Transition.IN,
        duration: 2,
        easing: None.easeNone,
        startPoint: 1
    });
}

參數說明:

  • type: Blinds:指定轉場類型為百葉窗。
  • direction: Transition.IN:進場效果(也可用 OUT 做退場)。
  • duration: 2:動畫持續 2 秒。
  • easing: None.easeNone:無緩動,勻速播放。
  • startPoint: 1:從第 1 條百葉窗開始(0~參數視類型而定)。

4. 測試效果

按 Ctrl+Enter 測試,點擊按鈕即可看到圖片以百葉窗方式展現。若需其他轉場類型(如 Iris、Wipe、Fade 等),只需更換 type 參數即可。

此範例展示了 TransitionManager 的基本用法,掌握後可輕鬆為專案加入豐富的轉場效果。

copyright © 萬盛學電腦網 all rights reserved