Flash CC動(dòng)畫設(shè)計(jì)與制作課件：FlashCC動(dòng)畫腳本

FlashCC動(dòng)畫設(shè)計(jì)與制作FlashCC動(dòng)畫腳本教學(xué)目標(biāo)1.掌握ActionScript的運(yùn)用。2.掌握函數(shù)的運(yùn)用。教學(xué)內(nèi)容：

前面章節(jié)學(xué)習(xí)了FlashCC聲音與視頻，本章主要學(xué)習(xí)FlashCC腳本語言。在FlashCC中，學(xué)會(huì)利用“動(dòng)作”面板在時(shí)間軸上書寫代碼，及在外部類文件中書寫代碼，利用腳本語言制作具有交互性的動(dòng)畫，創(chuàng)作各種不同的應(yīng)用特效，實(shí)現(xiàn)豐富多彩的動(dòng)畫效果。目錄

8.1制作雨天效果8.2制作變出來的花兒8.3制作五彩的星星8.4制作魚群本章小結(jié)8.1制作籃球8.1.1案例描述

8.1.2制作步驟8.1.3案例小結(jié)8.1.4能力擴(kuò)展8.1.1案例描述

本案例使用導(dǎo)入功能，將背景圖片導(dǎo)入舞臺(tái)中；再使用線條工具，繪制出雨點(diǎn)的外形；最后使用ActionScript技術(shù)，編輯出雨點(diǎn)不斷下落的效果。

8.1.1制作步驟1、新建一個(gè)Flash空白文檔，選擇【修改】>【文檔】命令，打開“文檔設(shè)置”對(duì)話框，在對(duì)話框中將舞臺(tái)大小設(shè)置為“580*450像素”，設(shè)置舞臺(tái)顏色為“黑色”，選擇“文件>導(dǎo)入>導(dǎo)入到舞臺(tái)”命令，將“素材\\8.1雨天效果\下雨.jpg”導(dǎo)入到舞臺(tái)中，如圖所示。2、選擇“插入>新建元件”命令，打開“創(chuàng)建新元件”對(duì)話框。在對(duì)話框中的“名稱”文本框中輸入名稱為yd，在“類型”下拉列表中選擇“影片剪輯”選項(xiàng)，完成后單擊“確定”按鈕進(jìn)入按鈕元件編輯區(qū),如圖所示。

8.1.1制作步驟3、使用“線條工具”在工作區(qū)中繪制一條線段，在實(shí)踐軸的第24幀處插入關(guān)鍵幀，然后選中該幀處的線條，將其向左下方移動(dòng)一段距離。這里移動(dòng)的距離就是雨點(diǎn)從天空落向地面的距離。最后在第1幀和第24幀之間創(chuàng)建補(bǔ)間動(dòng)畫，如圖所示。4、新建“圖層2”，并把它拖到“圖層1”的下方。然后在“圖層2”的第24幀處插入空白關(guān)鍵幀，并使用“橢圓工具”在舞臺(tái)中線條的下方繪制一個(gè)邊框?yàn)榘咨?，填充色為無，寬和高分別為57像素與7像素的橢圓，如圖所示。

8.1.1制作步驟5、選擇“圖層2”的第24幀，按住不放，將它向右移動(dòng)一個(gè)幀的距離。也就是將“圖層2”的第24幀移動(dòng)到第25幀處。然后選中第25幀處的橢圓，按F8鍵，將其轉(zhuǎn)換為圖形元件，在“名稱”文本框中輸入“水紋”，如圖所示。6、選中“圖層2”的第40幀，按F6鍵插入關(guān)鍵幀。然后選中該幀處的橢圓。使用“任意變形工具”將其寬和高分別放大至“118像素”與“13”像素。接著“屬性”面板中將它的Alpha值設(shè)置為“0%”，再在“圖層2”的第25幀與第24幀之間創(chuàng)建傳統(tǒng)補(bǔ)間動(dòng)畫，如所示。

8.1.1制作步驟7、打開“庫(kù)”面板，在影片剪輯元件yd上單擊鼠標(biāo)右鍵，在彈出的快捷菜單中選擇“屬性”命令。打開“元件屬性”對(duì)話框，單擊“高級(jí)”按鈕，單擊為“ActionScript導(dǎo)出”選項(xiàng)，完成后單擊“確定”按鈕，如圖所示。8、返回主場(chǎng)，新建一個(gè)“圖層2”，選中該層的第1幀，在“動(dòng)作”面板中添加如下代碼，保存動(dòng)畫文件，然后按Ctrl+Enter組合鍵測(cè)試效果，如圖所示。8.1.1案例小結(jié)——線條、橢圓形工具、補(bǔ)間動(dòng)畫的運(yùn)用

本案例主要是學(xué)會(huì)使用導(dǎo)入功能，使用線條工具繪制雨點(diǎn)的外形，并使用ActionScript技術(shù)編輯出雨點(diǎn)不斷下落的效果。8.1.1能力擴(kuò)展

通過使用ActionScript技術(shù)與創(chuàng)建制作ActionScript文件制作如上圖所示的物體3D旋轉(zhuǎn)特效。8.2制作變出來的花兒8.2.1案例描述

8.2.2制作步驟8.2.3案例小結(jié)8.2.4能力擴(kuò)展8.1.1案例描述

本案例利用ActionScript腳本制作一個(gè)使用鼠標(biāo)在空白處擦出來的圖像效果。

8.1.1制作步驟1.新建一個(gè)Flash空白文檔，選擇【修改】>【文檔】命令，并打開“文檔設(shè)置”對(duì)話框，并在對(duì)話框中將“舞臺(tái)大小”設(shè)置為620X530像素，如圖8-13所示。2.選擇【文件】>【導(dǎo)入】>【導(dǎo)入到舞臺(tái)】命令，將“素材文件\\背景.jpg”導(dǎo)入到舞臺(tái)中，如圖8-14所示。

8.1.1制作步驟3、選擇導(dǎo)入的圖片，按F8健，打開“轉(zhuǎn)換為元件”對(duì)話框，在“名稱”文本框中輸入元件的名稱pic，并在“類型”下拉列表中選擇“影片剪輯”選項(xiàng)，如圖所示。4、保存元件的選中狀態(tài)，打開“屬性”面板，并將其實(shí)例名稱設(shè)置為“imageMC”，如圖所示。

8.1.1制作步驟5、單擊“新建圖層”按鈕，新建“圖層2”，然后選中“圖層12”的第1幀，并按F9健打開“動(dòng)作”面板，接著在面板中輸入如圖所示。保存文件，按Ctrl+Enter組合鍵測(cè)試效果。8.2.1案例小結(jié)——熟練使用ActionScript制作動(dòng)畫

本案例主要是利用ActionScript腳本制作一個(gè)鼠標(biāo)在空白處擦出來的圖像效果，熟練使用ActionScript制作動(dòng)畫。8.2.1能力擴(kuò)展

通過使用ActionScript制作擦出來的藍(lán)天白云，效果如圖8-24所示。8.3制作五彩的星星8.3.1案例描述

8.3.2制作步驟8.3.3案例小結(jié)8.3.4能力擴(kuò)展8.3.1案例描述

本案例通過創(chuàng)建ActionScript文件與添加ActionScript代碼來制作。

8.3.1制作步驟1、新建一個(gè)Flash空白文檔，選擇【修改】>【文檔】命令，打開“文檔設(shè)置”對(duì)話框，在對(duì)話框中將舞臺(tái)大小設(shè)置為“600*450像素”，設(shè)置舞臺(tái)顏色為“黑色”，選擇“插入>新建元件”命令，打開“創(chuàng)建新元件”對(duì)話框。在“名稱”文本框中輸入Star，在“類型”下拉列表中選擇“影片剪輯”選項(xiàng)，如圖所示。2、選擇“多角星形工具”在影片剪輯元件編輯區(qū)中，繪制一個(gè)無邊框，填充色為任意色，寬和高隨意的星形，打開“庫(kù)”面板，在影片剪輯元件Star上單擊鼠標(biāo)右鍵，在彈出的快捷菜單中選擇【屬性】命令，如圖所示。

8.3.1制作步驟3、打開“元件屬性”對(duì)話框，單擊“高級(jí)”按鈕，單擊“為ActionScript導(dǎo)出”選項(xiàng)，完成后單擊“確定”按鈕，如圖所示。4、按[Ctrl+N]組合鍵打開“新建文檔”對(duì)話框，選擇“ActionScript文件”選項(xiàng)，單擊確定“確定”按鈕，如圖

8.3.1制作步驟5、按[Ctrl+S]組合鍵將ActionScript文件保存為Star.as，然后在Star.as中輸入如下代碼，如圖所示。6、回到主場(chǎng)景，在時(shí)間軸的第1幀中添加如下代碼，如圖所示。

8.3.1制作步驟7、新建“圖層2”，將其拖曳到“圖層1”的下方，然后導(dǎo)入“素材\\8.3制作五彩的星星\星空.jpg”到舞臺(tái)中，如圖6所示。保存動(dòng)畫文件，然后按Ctrl+Enter組合鍵測(cè)試效果。8.3.1案例小結(jié)——熟練使用ActionScript制作動(dòng)畫

本案例主要是利用ActionScript腳本制作一個(gè)滿天閃爍的星星圖像效果，熟練使用ActionScript制作動(dòng)畫。8.3.1能力擴(kuò)展

通過使用ActionScript制作如上圖所示的繽紛多彩的圓點(diǎn)效果。8.4制作魚群8.4.1案例描述

8.4.2制作步驟8.4.3案例小結(jié)8.4.4能力擴(kuò)展8.4.1案例描述

本案例通過創(chuàng)建ActionScript文件與添加ActionScript代碼來制作海底魚群的動(dòng)畫效果。

8.4.1制作步驟1、新建一個(gè)Flash空白文檔，選擇【修改】>【文檔】命令，打開“文檔設(shè)置”對(duì)話框，在對(duì)話框中將舞臺(tái)大小設(shè)置為“500*300像素”，設(shè)置幀頻為“30fps”，選擇“文件>導(dǎo)入>導(dǎo)入到舞臺(tái)”命令，將一幅背景圖像導(dǎo)入舞臺(tái)中，如圖所示。2、選擇【插入】>【新建元件】命令，打開“創(chuàng)建新元件”對(duì)話框。在“名稱”文本框中輸入MoveBall，在“類型”下拉列表中選擇“影片剪輯”選項(xiàng)，完成后單擊“確定”按鈕，如圖所示。

8.4.1制作步驟3、選擇【文件】>【導(dǎo)入】>【導(dǎo)入到舞臺(tái)】命令，將一幅小魚圖像導(dǎo)入到工作區(qū)中，如圖所示。4、打開“庫(kù)”面板，在影片剪輯元件MoveBall上單擊鼠標(biāo)右鍵，在彈出的快捷菜單中選擇【屬性】命令，如圖所示。

8.4.1制作步驟5、打開“元件屬性”對(duì)話框，單擊“高級(jí)”按鈕，選中“為ActionScript導(dǎo)出”選項(xiàng)，完成后單擊“確定”按鈕，如圖所示。6、按Ctrl+N組合鍵打開“新建文檔”對(duì)話框，選擇“ActionScript文件”選項(xiàng)，單擊“確定”按鈕，如圖所示。

8.4.1制作步驟7、按Ctrl+S組合鍵將ActionScript文件保持為MoveBall.as，然后在MoveBall.as中輸入如下代碼，如圖所示。8、返回到主場(chǎng)景中，新建“圖層2”，選擇該層的第1幀，按下F9鍵打開“動(dòng)作”面板，輸入如下代碼，如圖所示。保存動(dòng)畫文件，然后按Ctrl+En