旋轉運動

目標
製作鐘針旋轉並以按鈕控制之



學習新功能

• 移動補間→旋轉→順時

步驟

一、製作圓盤、字盤、長針、短針、軸心栓

1. 檢視 > 尺規。
2. 檢視 > 導引線 > 顯示導引線。
3. 從上側及左側的尺規拉一水平及垂直導引線相交於舞台中央。
4. 檢視 > 導引線 > 鎖定導引線。
5. 將內定圖層更名為「圓盤」，以圓形工具，按Alt+Sht鍵，在舞台上畫一圓盤，圓心落在導引線相交處。
   
6. 設定圓盤的色彩。
7. 在屬性視窗內調整圓盤外框線的粗細。

(一) 製作數盤

1. 新增圖層，取名為「數盤」。
   
2. 用文字工具在圓盤正上方鍵入數字「12」。
3. 以文字工具選取「12」成反白，於屬性視窗內選擇「齊中」。
4. 以「自由變形工具」選取數字「12」，將其物件中心移至兩導引線的交點。
5. 在「數盤」的第13影格新增一關鍵影格。
6. 於第2到12影格間影按任一格點，並於屬性視窗之「補間動畫」欄選擇「移動」。
7. 於「旋轉」欄選「順時針」。
8. 於時間軸上選第2到12影格，按滑鼠右鍵於文字選項欄選擇「轉換成關鍵影格」。
9. 依序將第2到12影格的數字改為1到11。
10. 將第13影格移除。
11. 將第1到12影格的數字打散一次，接著再將10、11及12打散一次。
12. 點按第2影格。編輯 > 剪下。
13. 點按第1影格，編輯 >在原地貼上。
14. 重復上二步驟，將第3~13影格的數字剪下，原地貼到第1影格。
15. 選取第2~12影格，移除影格。

(二) 製作時針

1. 新增一圖層，取名為「時針」，從兩導引線的交點畫一直立線，於屬性視窗內修改其色彩及粗細。
2. 選取舞台上的時針，修改 > 轉換為元件，選圖像類型，將該元件取名為「時針」。
3. 選取舞台上的針，刪除之。
   

(三) 製作分針

1. 新增一圖層，取名為「分針」，從舞台中央往上畫一直立線，於屬性對話框內修改其色彩及粗細。
2. 選取舞台上的分針，修改 > 轉換為元件，選圖像類型，將該元件取名為「分針」。
3. 選取舞台上的分針，刪除之。
   

(四) 製作軸心栓

1. 新增一圖層，取名為「軸心栓」，畫一小圓，圓心落在兩導引線的交點。

二、製作鐘針轉動元件
(一) 分針轉動影片片段

1. 新增元件，選取影片片段模式，取名為「分針clip」。
2. 從元件庫將「分針」元件拖拉放到舞台。
3. 以「自由變形工具」選取分針，將其物件中心移至物件的底端。
4. 利用對齊視窗，讓「時針」的物件中心對於原點。
5. 在第61影格新增一關鍵影格。
   擬將分針以60格旋轉一圈，因有一格會重疊，故設61。
   
6. 於第2到60影格間點按，並於屬性視窗之「補間動畫」欄選擇「移動」。
7. 於「旋轉」欄選「順時針」。
8. 於時間軸上選第2到60影格，按滑鼠右鍵選擇「轉換成關鍵影格」。
9. 將第61影格移除。

(二) 時針轉動影片片段

1. 新增元件，選取影片片段模式，取名為「時針clip」。
2. 從元件庫將「時針」元件拖拉放到舞台。
3. 以「自由變形工具」選取時針，將其物件中心移至物件的底端。
4. 利用對齊視窗，讓「時針」的物件中心對於原點。
5. 在第721影格新增一關鍵影格。
   由於擬將分針以60格旋轉一圈，故12個小時須用到720格，因繞一圈會有一格重疊，所以取721。
   
6. 於第2到720影格間點按，並於屬性視窗之「補間動畫」欄選擇「移動」。
7. 於「旋轉」欄選「順時針」。
8. 於時間軸上選第2到720影格，按滑鼠右鍵選擇「轉換成關鍵影格」。
9. 滑鼠右鍵點按第721影，選擇移除影格。

三、製作按鈕及AS

1. 切換到「場景1」。
2. 將「分針clip」影片片段移入舞台中的分針層。將其實體名稱更名為longhand_clip。
3. 將「時針clip」影片片段移入舞台中的時針層，將其實體名稱更名為shorthand_clip。
4. 新增一圖層，取名為「按鈕」。
   
5. 視窗 > 庫存元件，拖拉放播放按鈕元件及暫停元件至按鈕層，分別將其實體名稱取名為「play_btn」及「pause_btn」。
6. 新增圖層，取名為Action。按F9，鍵入語令如下：
   stop();
   play_btn.addEventListener(MouseEvent.CLICK, clickplay_btn);
   function clickplay_btn(event:Event):void {
   trace ("play_btn");
   shorthand_clip.play();
   longhand_clip.play();
   }
   
   pause_btn.addEventListener(MouseEvent.CLICK, clickpause_btn);
   function clickpause_btn(event:Event):void {
   trace ("pause_btn");
   shorthand_clip.stop();
   longhand_clip.stop();
   }
7. 測試影片。
8. 存檔。