[Flash] Timeline Control

• Timeline Control

Download: MovieClipDemo1.zip MovieClipDemo2.zip

Demo: MovieClipDemo1 MovieClipDemo2


從接觸Flash 4 到現在Timeline Control一直都是讓許多入門者感到疑惑的地方，大部分的人直覺只要我有建立元件在場景上，在任何影格上就可以呼叫這個元件，這是一個錯誤的認知，範例狀況如下:

在MovieClipDemo1.fla裡有三個圖層，主場景共兩個影格。在圖層MoveiClips裡影格一為MC1 這個 MovieClip，而影格二則為MC2 這個 MovieClip。MC1 和MC2皆包含著三個按鈕來跳躍時間軸，如下:

MC1 MovieClip:




MC2 MovieClip:



分別將Actionscript碼寫到個別的MovieClip裡，以MC1為例如下:

stop();

main_btn.addEventListener(MouseEvent.CLICK, onMainClick);
mc1_btn.addEventListener(MouseEvent.CLICK, onMC1Click);
mc2_btn.addEventListener(MouseEvent.CLICK, onMC2Click);

function onMainClick(event:MouseEvent):void{
MovieClip(root).gotoAndStop(2);
}

function onMC1Click(event:MouseEvent):void{
this.gotoAndStop(2);
}

function onMC2Click(event:MouseEvent):void{
//MovieClip(root).mc2_mc.gotoAndStop(3);
//unable to call a undefined movieclip
}

Main Timeline跟MC1 Timeline的按鈕都不會有問題，但是如果你將對應到MC2 Timeline按鈕的程式語法註解拿掉的話，當你編譯完後在MC1裡點擊MC2 Timeline按鈕會出現錯誤訊息，回顧前面兩張圖，在主場景影格一裡我們沒有建立MC2影片元件，所以MC1自然就看不到他，也就無法操控(也就是所謂scope的問題)。

要解決這個問題你可以把MC2跟MC1建立在同個影格上，且長度一致，如下:

然後在主場景影格一加上下面的程式碼:

mc1_mc.visible = true;
mc2_mc.visible = false;

目的是要讓MC2一開始先隱藏起來，如法炮製，在影格二你就要把這個性質給對調。

元件建立完後我們還要對個別的MovieClip做些微的語法控制修正，以MC1為例:

stop();

main_btn.addEventListener(MouseEvent.CLICK, onMainClick);
mc1_btn.addEventListener(MouseEvent.CLICK, onMC1Click);
mc2_btn.addEventListener(MouseEvent.CLICK, onMC2Click);

function onMainClick(event:MouseEvent):void{
MovieClip(root).gotoAndStop(2);
}

function onMC1Click(event:MouseEvent):void{
this.gotoAndStop(2);
}

function onMC2Click(event:MouseEvent):void{
MovieClip(root).mc2_mc.gotoAndStop(3);
MovieClip(root).gotoAndStop(2);
}


在onMC2Click裡的程式碼做了小小的手腳，先將mc2跳到frame3在跳到maine timeline frame 2。

由於這是個演示範例，所以模式寫成這樣，實際設計運作情況應該盡量讓同質性的功能寫在一起，非必要盡量避免將actionscript分散到各個元件影格上，因為對維護者而言是一件很辛苦的事。

這裡只有簡單提到單一場景的時間軸控制，如果再加上場景的切換又有一些基礎概念需要了解，有機會要講解時我再做一個解說吧!