萬盛學電腦網

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

Flash ActionScript 3.0 實作:隨機旋轉的花朵互動動畫

核心思路

利用for...in遍歷主場景(_root)所有影片剪輯,為每個實例動態綁定onPress(拖曳)、onRelease(釋放)、onEnterFrame(逐幀旋轉)事件,實現「滑鼠拖拽花朵、釋放後自轉」的互動效果。

完整代碼實作

// 定義三個功能函數
var F1:Function = function () { this.startDrag(false); };
var F2:Function = function () { this.stopDrag(); };
var F3:Function = function () { this._rotation += this.speed; }; // 累加旋轉角度

// 遍歷 _root 所有物件
for (var k in _root) {
    _root[k].speed = Math.random() * 20;      // 隨機轉速
    _root[k].onPress = F1;                    // 按下拖曳
    _root[k].onRelease = F2;                  // 釋放停止
    _root[k].onEnterFrame = F3;               // 每幀自轉
}

關鍵知識點解析

1. 兩種函數定義方式

  • 函數語句:function Test(a,b){ return a+b; } — 可先調用後定義,標準寫法。
  • 函數表達式:var Test = function(a,b){ return a+b; }; — 必須先定義再調用。

建議優先使用函數語句,結構更清晰。

2. for...in 遍歷機制

適用於 XML、Array、Object、_root 等集合。示例:

var Car = {brand:"M6", color:"red", engine:2000};
for (var k in Car) { trace(k + "=" + Car[k]); }
// 輸出: brand=M6, color=red, engine=2000

// 遍歷舞台所有 MC(即使未命名,Flash 自動分配實例名 _level0.instanceN)
for (var k in _root) { trace(_root[k]); }

3. onEnterFrame — 動畫與遊戲的核心

  • 主時間軸寫 onEnterFrame = function(){...} 實際掛載於 _root。
  • MovieClip.onEnterFrame 讓單一 MC 獨立運行邏輯,配合 for...in 批量綁定極其高效。
// 傳統寫法(100 個 MC 需重複 100 次)
MC1.onEnterFrame = function(){ this._rotation += this.speed; };

// 高效寫法
function rotateMe() { this._rotation += this.speed; }
for (var k in _root) {
    _root[k].speed = Math.random()*10;
    _root[k].onEnterFrame = rotateMe;   // this 指向當前 MC
}

實作步驟總結

  1. 舞台放置多個影片剪輯(無需命名)。
  2. 第一幀貼上上述代碼。
  3. 發布測試:滑鼠拖曳任意花朵,釋放後以隨機速度自轉。

延伸應用:可擴展為粒子系統、星空旋轉、互動相冊等。掌握 for...in + onEnterFrame 模式,是 AS2/AS3 早期開發的核心技能。

copyright © 萬盛學電腦網 all rights reserved