Flash動畫學習指導十一:使用ActionScript 3

轉自:http://bbs.9ria.com/thread-73577-1-1.html


本文閱讀要求:


你可以通過關聯一個已存在的補間動畫或者複製從動畫轉換成Actionscript3的代碼,把一個動畫添加到一個文檔中去。下面的會給你展示這樣做事多麼的簡單,還有上面提供的例子可以告訴你能夠理解這種技術到什麼程度。你可以是使用Copy Motion as ActionScript 3操作把一個動畫轉換成ActionScript 3代碼,這樣,你就可以通過修改某一行代碼來改變這個動畫了。

Flash CS4介紹了一個新特性,同時也多虧了動畫也是面向對象的,這樣,我們就可以通過賦予動畫一個實例名稱來連接到其他的實例。引用這個實例名的實例,會擁有這個實例名的補間動畫一樣的運動效果。

你也可以使用代碼去運行動畫,這樣就可以完全避免補間動畫了,不過這超出這個學習指南的範圍。如果想了解更多關於這方面的知識,請閱讀ActionScript3創建動畫

從時間軸中複製ActionScript 3代碼

如果你有一個補間,通過一個菜單操作,你可以將這個補間中的動畫複製出來並轉化成ActionScript3代碼。在這個過程中,補間動畫中的信息是以代碼的形式複製到粘貼板上的,這樣你就可以把這些代碼粘貼到as文件或者fla文件中了。這樣可以幫助開發人員和設計師一起工作,開發人員就可以直接使用代碼而不是補間動畫了。這樣開發人員就不需要擔心動畫是否完全一樣了,因爲這個麻煩的工作已經交給設計師們在Flash中完成了。

下面的例子告訴你怎樣做(Flash CS4和Flash CS3有一些不同)
1.        在舞臺上創建一個動畫,例如選中一個影片剪輯實例並應用一個Motion Preset(Window > Motion Presets,選中並應用)。
2.        右鍵點擊補間動畫並選中“Copy Motion as ActionScript 3”,和動畫有相同效果的代碼就會複製到粘貼板了。
3.        創建一個新的圖層並選中這層的第一幀。
4.        打開Action面板(Window > Actions),並把代碼粘貼到腳本。
5.        創建一個新的圖層,並拖動第二個影片剪輯到舞臺上。
6.        選中第二個影片剪輯,並在屬性欄的<InstanceName>文本域中寫上myClip這個實例名,這樣,你就可以在代碼中引用這個實例了。
7.        選中包含代碼的那一幀,回到Actions面板,把下面的這行代碼反註釋。也就是把這行代碼開頭的兩個斜槓去掉。去掉之後應該是這樣的:
  1. animFactory_Symbol1_2.addTarget(<instance name goes here>, 0);
複製代碼
8.        把<instance name goes here>改爲myClip。
9.        Control > Test Movie,看看結果。兩個實例應該是相同的動畫。

這個功能在Flash CS3中也差不多是這樣使用的,如果你很熟悉Flash CS3的特性,你還是會發現有2點不同的:
1.        代碼不同,那是因爲動畫不再以XML的形式表現出來,而是表現爲一批值。
2.        你複製動畫的時候不再看到有對話框提示你輸入一個實例名。
就像你在前面看到的練習一樣,你需要把你粘貼的代碼中的最後一行反註釋掉,並寫上實例名。

使用補間動畫實例
在Fla文件中,你可以使用一個補間實例應用到其他的實例中。你賦予一個補間實例一個實例名,就像你給影片剪輯賦予實例名一樣,這樣你就可以在代碼中引用這個實例。給賦予補間實例一個實例名,意味着你可以把這個補間實例分配到其他的影片剪輯中,這些影片剪輯可以獲取這個補間實例的所有屬性和擁有相同的動畫效果。使用這個技術,意味着再fla文件中開發某一動畫的效率會得到極大的提高----對你的工作流程而言也是。

在上面提到的例子文件中你可以找到simple-tween-instance.fla,在這個文件中有一個實例是補間動畫,你可以賦予它一個實例名稱,並把它應用到文件中的影片剪輯中。

1.        在simple-tween-instance.fla中,選中舞臺上方的實例,並點擊動畫路徑(或者時間軸上的補間)。
2.        打開動畫屬性欄(Window > Properties)。在頂部有一個新的文本框,你可以在這個文本框輸入一個實例名。
3.        在文本框裏寫上theTween 作爲這個補間動畫的實例名(看圖61)。

as3motion_1.jpg 
圖61

在這個文件中有一個實例名是staticMonkey的(非補間動畫)影片剪輯。我們試試把上面說到的補間動畫應用到這個實例中:
1.        在使用補間動畫之前先播放一下,選擇Control > Test Movie,證明一個實例是補間動畫,另一個是非補間動畫。
2.        打開Actions面板(Window > Actions),添加下面一行代碼:
  1. theTween.addTarget(staticMonkey)。
複製代碼
這行代碼會把補間動畫從第一個會動的猴子應用到第二個身上,你會看到,兩個猴子都會動了。

後續學習
這個只是應用補間動畫實例的一個最基本的例子。例如你可能在補間想添加一些代碼,並把這個補間應用到其他的實例中。這樣的例子你可以在這個學習指南的源文件中的snow-tween-instance-3speeds.fla找到,這個文件的使用方法會在文件裏面的註釋代碼和Jen的博客中有描述。

補間動畫在設計師和開發人員需要在一個項目中合作的時候非常有用。下面的這個例子告訴你在以下的工作流程中你可以怎樣使用補間動畫:設計師創建了一個過渡效果,當菜單的菜單項被選中的時候就觸發一個事件或者一個動畫,而開發人員就要使得這個菜單是可交互的。開發人員會採用設計師創建的模型,把這個補間動畫所在的圖層隱藏起來並賦予它一個實例名。這樣,就可以添加這個菜單對象,並且在菜單項被選中的時候調用事件。

順便說一下,一定要看看flash動畫學習指南的其他章節。

發佈了6 篇原創文章 · 獲贊 6 · 訪問量 41萬+
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章