軟大彩虹頻道

用滑鼠滑過畫面左下方的按鈕即可切換頻道

前言:

利用按鈕Action的Tell Target 指令,設定使用按鈕來控制MovieClip 中的照片切換。



步驟1
節目LOGO製作

1.先將背景設成電視機外殼的深灰色,並將場景Scene 1 的圖層"Layer 1"更名為"電視機"。

2.用Insert > New Symbol 新增一 Graphic Symboll(圖形元件),命名為"小球",並進入其編輯模式。然後在其圖層"Layer 1"中,用圓形繪製工具繪製一大小為12x12,邊框為無色的圓形置於"小球"元件場景的中央,並用油漆桶工具將圓形填成如圖1 所示的漸層色。


圖1

3. 回到場景Scene 1中,新增一MovieClip Symbol(影片片段)元件,命名為"LogoE",並進入其編輯模式。將其圖層"Layer 1"更名為"e",另外新增一個圖層,命名為"小球繞行"。

4.在圖層"e"的Frame 1中,用文字工具先在場景中置入一英文字母:"e",然後用 Modify > BreakApart將該字打散成圖形,用油漆桶工具填入分直線型漸層色,並用Transform Fill(填色變形)工具將其調成如圖 2 之漸層方向;完成後在Frame 10插入Frame。


圖2

※文字要先經"BreakApart"(打散)程序轉為一般填色區域之後才能在文字中填入漸層色。

 

5.在圖層"小球繞行"的Frame 1中,將之前做好的"小球"元件置入場景,然後在Frame 7插入KeyFrame;再用Insert > Motion Guide新增此圖層的Motion Guide(導引線)圖層,在此導引線圖層中繪製小球繞字母"e"的導引線。

6.開啟磁鐵工具,將圖層"小球繞行"中Frame 1的"小球"元件吸附至導引線在字母左下方的繞行起點,而Frame 7的"小球"元件則吸附至導引線在字母右上方的繞行終點。然後再將Frame 1 至 Frame 7 之間設成Motion Tweening(移動漸變)的動畫,如圖 3所示。


圖3

7.回到場景Scene 1中,新增一Graphic Symbol(圖形元件),命名為"Logo",並進入其編輯模式。在圖層"Layer 1"的Frame 1 中用文字工具置入"T"、"V"及"S"等字,並排至適當位置,將其全部選取後再用步驟1-4.的方法將三個字母填入漸層色,另外再畫幾個顏色不同的小球放到每個字母的不同角落。然後再將之前完前的"LogoE"元件從Library圖庫中拉到場景中適當位置,如圖 4所示。


圖4

 

步驟2
電視節目製作

1.回到場景Scene 1中,新增一MovieClip Symbol(影片片段)元件,命名為"頻道",並進入其編輯模式。將其圖層"Layer 1"更名為"螢幕",另外再新增一個圖層,命名為"節目"。

2.在圖層"螢幕"的Frame 1 用方形繪製工具繪一個大小為400x300 pixel的深藍色方形,並置於元件的中央,然後在Frame 4 插入Frame,並在Frame 1 的Frame Action 設 Stop

3.在圖層"節目"的Frame 1到 Frame 4分別插入空白KeyFrame (共 4 個),在Frame 2File > Import 輸入第一個節目的照片,並將照片放在元件的中央位置。再用相同方法將第二個節目的照片輸入到Frame 3,而第三個節目的照片則輸入到 Frame 4,並將照片放在元件的中央位置。最後再到Frame 1 中將上個步驟做好的"Logo"元件從Library(庫圖)中拉到元件場景的中央,如下圖所示:


圖5

 

步驟3
頻道按鈕及電視機製作

1.回到場景Scene 1中,新增一Graphic Symbol(圖形元件),命名為"搖控器",並進入其編輯模式。在圖層"Layer 1"的Frame 1 中用鉛筆工具及油漆桶工具,繪製一手握搖控器的圖形。

2.回到場景Scene 1中,新增一MovieClip Symbol(影片片段)元件,命名為"搖控",並進入其編輯模式。在其圖層"Layer 1"的 Frame 1 及Frame 2各插入一空白KeyFrame,然後在Frame 2 中將剛才完成的"搖控器"元件放到場景中。在Frame 8 新增一KeyFrame,並將場景中的"搖控器"元件向下移動一個距離。完成後將Frame 2 到Frame 8設成Motion Tweening (移動漸變) 的動畫。

3.回到Frame 2 中,用Frame > Imoprt 將按按鈕的聲音檔輸入到場景中,如下圖所示,並將Frame 1 的Frame Action 設成 Stop


圖6

 

4.回到場景Scene 1中,製作三個Button Symbol(按鈕元件),分別命名為"頻道鈕 1"、"頻道鈕 2"及"頻道鈕 3 "。完成後放置在Frame 1的場景中的適當位置。

5.將之前完成的"頻道"及"搖控"兩個MovieClip元件放到Frame 1場景中的適當位置,並分別將其 Instance Name 設成 "channel"及"remote";,如下圖所示:


圖7

6.選取"頻道鈕 1"元件,按滑鼠右鍵選擇Actions 呼叫出 對話框,先新增一Tell Target Action 設定當滑鼠指標滑入按鈕上方(RollOver) 時 Instance Name (實體名稱)為 "channel "的MovieClip 跳到 Frame 2並停止播放,如圖 8 所示。


圖 8

※要新增另一個不同滑鼠事件的 Tell Target Action時,先將藍色的光棒移到最下方的 } , 再用加號來新增Action,否則會變成同一滑鼠事件。

然後再新增另一Tell Target Action 設定當滑鼠指標滑出按鈕上方(RollOut)時 Instance Name (實體名稱)為 "channel "的MovieClip 回到 Frame 1(即TVES的畫面)並停止播放,最後再新增另一Tell Target Action 設定當滑鼠指標滑出按鈕上方(RollOut)時 Instance Name (實體名稱)為 "remote "的MovieClip 播放。如圖 9所示。


圖 9

 

用同樣步驟將"頻道鈕 2"元件Action 設成:

 on (rollOver) {
  tellTarget ("/channel") {
   gotoAndStop (3);
  }
 }
 on (rollOut) {
  tellTarget ("/channel") {
   gotoAndStop (1);
  }
 }
 on (rollOver) {
  tellTarget ("/remote") {
   play ();
  }
 }

將"頻道鈕 3"元件Action 設成:

 on (rollOver) {
  tellTarget ("/channel") {
   gotoAndStop (4);
  }
 }
 on (rollOut) {
  tellTarget ("/channel") {
   gotoAndStop (1);
  }
 }
 on (rollOver) {
  tellTarget ("/remote") {
   play ();
  }
 }

7.執行 Control > Test Movie 預覽其效果,完成後檔並輸出。

原始檔下載


回課程目錄