FLASH實(shí)例-美麗家園

美麗家園高等教育出版社本單元動畫效果目錄任務(wù)一、繪制一棵大樹任務(wù)二、小小院落任務(wù)三、爬動的小瓢蟲任務(wù)四、沿任意路徑運(yùn)動的瓢蟲動畫效果動畫效果動畫效果動畫效果[本任務(wù)目標(biāo)]:利用繪圖工具繪制大樹。學(xué)習(xí)圖形元件的創(chuàng)建方法。

[本任務(wù)重點(diǎn)]:掌握線條工具、顏料桶工具、填充變形工具、刷子工具等基本繪圖工具的使用，以及將舞臺上的圖形轉(zhuǎn)換為元件的方法。任務(wù)一、繪制一棵大樹

自己動手：1．創(chuàng)建影片文檔新建Flash文檔，打開“文檔屬性”對話框，設(shè)置寬為“650px”,高為“500px”，其它均為默認(rèn)值。

2．創(chuàng)建漸變背景層

（1）將當(dāng)前圖層改名為“背景”，按Shift+F9打開混色器面板，設(shè)置漸變類型為“線性”，溢出為“擴(kuò)展”。在色帶下單擊添加一個色標(biāo)。依次調(diào)整色標(biāo)顏色，分別為天藍(lán)色、白色、綠色。如圖2-2所示：（2）選擇工具箱的矩形工具，在舞臺繪制任意大小的矩形。然后打開“屬性”面板，設(shè)該矩形寬為“650”、高為“500”，X和Y的坐標(biāo)均為“0”，這樣設(shè)置的目的是使該矩形正好充滿整個舞臺。如圖2-3所示。

（3）選擇工具箱的填充變形工具，在該矩形上單擊，周圍出現(xiàn)可調(diào)節(jié)的控制手柄。拖動旋轉(zhuǎn)手柄使該漸變順時(shí)針旋轉(zhuǎn)90度，形成藍(lán)天、白云、草地的效果。如圖2-4所示。然后鎖定該圖層，這樣可防止執(zhí)行其它操作時(shí)對它的誤操作。第二單元美麗家園圖2-2漸變背景設(shè)置圖2-4

圖2-3漸變背景（1）創(chuàng)建名為“樹”的新層。單擊工具箱的“線條工具”，打開“屬性面板”，設(shè)置其筆觸顏色為綠色，筆觸高度為2，筆觸樣式為實(shí)線。如圖2-5所示。在舞臺上繪制一條直線，接著用“選擇工具”按住線條的中下部進(jìn)行拖動，將它拉成曲線，如圖2-6所示。第二單元美麗家園3.繪制樹葉

圖2-5設(shè)置線條屬性

圖2-6用“選擇工具”創(chuàng)建曲線再用線條工具繪制另一條直線，這條直線要連接曲線的兩端點(diǎn)，如圖2-7（a）所示。用選擇工具將這條直線也拉成曲線，然后用選擇工具再對它的外形略微調(diào)整，一片樹葉的基本形狀就畫出來了，如圖2-7(b)所示。圖2-7(a) 圖2-7(b)（2）現(xiàn)在我們來繪制葉脈，先在兩端點(diǎn)間繪制直線，然后拉成曲線，再畫旁邊的細(xì)小葉脈，可以用直線，也可以將直線略彎曲，這樣，一片簡單的樹葉就畫好了，如圖2-8所示。

圖2-8畫葉脈

圖2-9給樹葉填充顏色（3）接下來我們要給這片樹葉填上顏色。在工具箱的顏色選項(xiàng)欄設(shè)置填充色為淺綠色，然后單擊工具箱中的顏料桶工具，在畫好的葉子上單擊一下，效果如圖2-9所示。顏料桶工具默認(rèn)能在一個封閉的區(qū)域中填色。依次單擊為該樹葉填上顏色。至此，一片樹葉就繪制好了。(4)現(xiàn)在我們要把剛才畫好的這片樹葉轉(zhuǎn)換為元件備用。選擇該樹葉，單擊右鍵，在彈出的快捷菜單中選擇“轉(zhuǎn)換為元件”命令，彈出“轉(zhuǎn)換為元件”對話框。輸入元件名稱為“樹葉”，選擇元件類型為“圖形”，如圖2-11所示：圖2-11“轉(zhuǎn)換為元件”對話框執(zhí)行“窗口”→“庫”命令（快捷鍵是F11），打開庫面板，庫面板用來存儲元件和我們導(dǎo)入的各種外部素材。你將發(fā)現(xiàn)庫面板中出現(xiàn)一個名稱為“樹葉”的圖形元件，如圖2-12所示。圖2-12“庫”面板（5）用單片樹葉來武裝大樹，有些單調(diào)，所以我們在單片樹葉的基礎(chǔ)之上再做一個組合樹葉元件。從元件庫中再拖兩片“樹葉”到舞臺上，用任意變形工具將三片樹葉調(diào)整成如圖2-14所示的形狀。圖2-14組合樹葉形狀用我們上面剛剛學(xué)習(xí)的方法，將這三片樹葉全部選中，也轉(zhuǎn)換為圖形元件，元件名為“組合樹葉”。這樣就形成了元件的嵌套,也就是在“組合樹葉”元件內(nèi)嵌套了“樹葉”元件。4．繪制樹干和樹枝單擊刷子工具，在“顏色”欄內(nèi)設(shè)置填充色為褐色。在“選項(xiàng)”欄內(nèi)設(shè)置刷子形狀為橢圓形，刷子大小自定。刷子模式為標(biāo)準(zhǔn)繪畫。如圖2-15所示。移動鼠標(biāo)到場景中，畫出樹干和樹枝的形狀，如圖2-16所示。刷子大小刷子形狀刷子模式

圖2-15刷子工具選項(xiàng)設(shè)置圖2-16繪制樹干和樹枝5．組合大樹（1）按F11打開庫面板，你可以看到，庫面板中有兩個剛制作完的圖形元件，分別為“樹葉”和“組合樹葉”，單擊“樹葉”和“組合樹葉”圖形元件，分別將其拖放到舞臺的樹枝圖形上，用任意變形工具進(jìn)行調(diào)整。元件庫中的元件可以重復(fù)使用，只要改變它的大小和方向，就能制作出紛繁復(fù)雜的效果來，如圖2-18所示。按快捷鍵Ctrl+A將組合好的大樹全選，按F8將其轉(zhuǎn)換為圖形元件，名為“大樹”。圖2-18繪制好的大樹執(zhí)行Ctrl+Enter測試影片，可以在預(yù)覽窗口中看到一棵大樹。執(zhí)行“文件”→“保存”命令，將文件保存。6.測試存盤舉一反三1.嘗試?yán)L制各種花朵的形狀，并為其填充不同漸變顏色。2．仔細(xì)觀察你所喜歡的一種樹木，并在Flash中將它畫出來。3．繪制夜晚的星空。動畫效果動畫效果[本任務(wù)目標(biāo)]:靈活運(yùn)用繪圖工具的使用方法。[本任務(wù)重點(diǎn)]:靈活運(yùn)用繪圖工具欄的工具，繪制所需圖形。任務(wù)二、小小院落

自己動手：1．創(chuàng)建房子層為了防止對其它圖層的誤操作，我們單擊時(shí)間軸上方的鎖定圖層按鈕，將剛才的所有圖層鎖定。然后單擊插入圖層按鈕，創(chuàng)建名為“房子”的新圖層。其時(shí)間軸如圖2-22所示：圖2-22創(chuàng)建名為“房子”的新圖層選擇矩形工具，在顏色選項(xiàng)欄內(nèi)設(shè)置筆觸顏色為黑色，填充色為無。在舞臺上繪制出兩個矩形，上面的矩形作房頂，下面的矩形作房身，如圖2-23所示。2．繪制房子基本輪廓圖2-23繪制兩個矩形用選擇工具雙擊上面矩形的任一條邊，將整個矩形全部選中，單擊任意變形工具，將鼠標(biāo)移動到所選矩形的上邊線附近，當(dāng)鼠標(biāo)變成形狀，拖動鼠標(biāo)，如圖2-24（a）。將矩形斜切成平行四邊形,如圖2-24（b）。

(a)(b)圖2-24用任意變形工具變形選擇線條工具，將兩圖形連接起來，如圖2-25所示。接著用線條工具繪制屋頂?shù)膫?cè)面。得到如圖2-26所示的房屋輪廓。

圖2-25用線條工具連接兩個矩形圖2-26繪制房屋輪廓3.畫門和窗戶畫出門的形狀。再來繪制窗戶。使用橢圓工具畫一個沒有填充色的橢圓，用選擇工具框選靠下的大半個橢圓，按鍵盤的Delete鍵，刪除所選部分，剩下上面的弧線。緊挨著弧線再畫一長方形，如果不容易對準(zhǔn)，可以使用工具箱的縮放工具將畫面放大。畫好以后，雙擊縮放工具就可以恢復(fù)原狀了。增加直線，形成窗格。選中窗戶，在屬性面板中將顏色改為淺藍(lán)色，并增粗。如圖2-27所示。圖2-27畫門和窗4.填充顏色將畫好的房子填充上你喜歡的顏色，然后用選擇工具分別選中輪廓線，將它們一一刪除，得到如圖2-28所示形狀。

圖2-28為小屋填充顏色選擇工具箱的刷子工具，設(shè)置填充色為粉色，在選項(xiàng)欄單擊刷子模式按鈕，選擇繪畫模式為后面繪畫，如圖2-29所示。在窗戶內(nèi)畫出窗簾的形狀。如圖2-30。

5．畫窗簾圖2-29選擇后面繪畫模式圖2-30畫窗簾6．畫煙囪和碎石路結(jié)合矩形工具和橢圓工具，在房頂繪制煙囪和炊煙。然后在屋前用橢圓工具畫一些大小不一的小圓，作為門前的碎石路。用選擇工具框選房子層的所有圖形，執(zhí)行菜單“修改”→“組合”命令或按快捷鍵Ctrl+G，將其組合。如圖2-31所示。圖2-31組合后的小房子7.復(fù)制、排列大樹選擇場景1舞臺上的那棵大樹，按住alt鍵直接拖動，可產(chǎn)生多個大樹的復(fù)本，按由遠(yuǎn)及近，由小到大的順序依次排列在舞臺的左側(cè)。如圖2-32所示。圖2-32復(fù)制、排列大樹8．進(jìn)一步美化修飾小院使用刷子工具再給小院加上一些小草和籬笆墻。至此我們的美麗家園的場景圖就大功告成。其效果如圖2-33所示。

圖2-33美麗家園9．保存文件執(zhí)行Ctrl+Enter，觀察動畫效果，如果滿意，執(zhí)行“文件”→“保存”命令，將文件保存。舉一反三1．繪制簡單藍(lán)天、湖面場景。如圖2-34所示。制作說明：注意使用填充變形工具對湖面的漸變填充色和小山的漸變填充色進(jìn)行調(diào)整。圖2-34藍(lán)天、湖面效果圖2．嘗試?yán)L制小鴨形狀，如圖2-35所示。制作說明：你也可以充分發(fā)揮想像力，根據(jù)自己的觀察來畫。然后將畫好的小鴨子轉(zhuǎn)換為圖形元件。圖2-35小鴨子任務(wù)三爬動的小瓢蟲[本任務(wù)目標(biāo)]:利用橢圓工具、填充變形工具以及部分選取工具來繪制一個小小的瓢蟲。并讓它沿著樹干慢慢地向上爬。[本任務(wù)重點(diǎn)]:本任務(wù)的一個重要知識點(diǎn)是利用補(bǔ)間動畫實(shí)現(xiàn)瓢蟲爬動的效果。

自己動手：1．創(chuàng)建瓢蟲圖形元件（1）執(zhí)行菜單“插入”→“新建元件”命令，或按快捷鍵Ctrl+F8彈出創(chuàng)建新元件對話框，輸入名稱為“瓢蟲”，類型為“圖形”，如圖2-36所示。圖2-36創(chuàng)建新元件對話框（2）單擊確定，即進(jìn)入該元件的編輯狀態(tài)。選擇當(dāng)前圖層，將其改名為“背部”，使用工具箱的橢圓工具

，選擇筆觸顏色為無，填充色為紅到黑的放射狀漸變，繪制一個橢圓。如圖2-37所示。

圖2-37繪制橢圓（3）選擇工具箱的填充變形工具，在橢圓上單擊，可以看到在它周圍出現(xiàn)多個控制手柄，用來調(diào)整漸變的位置、大小、方向和焦點(diǎn)等。首先向外拖動右側(cè)第二個手柄，使它的漸變區(qū)域增大。再向下拖動漸變中心點(diǎn)，使?jié)u變中心點(diǎn)向下移動。如圖2-38所示。

圖2-38調(diào)整漸變填充第二單元美麗家園（4）創(chuàng)建名為“頭部”的新層，使用工具箱的橢圓工具，繪制一個筆觸顏色為無，填充色為黑色的小圓。單擊箭頭工具，選中該圓，按Ctrl+D鍵，直接復(fù)制該圓，然后把它往旁邊水平拖動一段位置。如圖2-39所示。

圖2-39

圖2-40取消選擇，兩個圓成為一個對象。選擇部分選取工具，在該對象邊緣上單擊，將出現(xiàn)多個錨點(diǎn)。如圖2-40所示。第二單元美麗家園在本例中我們先將圖形下面中心位置的錨點(diǎn)直接向下拖動，得到如圖2-41所示圖形。

圖2-41圖2-42單擊圖2-41中兩個圓圈所圈錨點(diǎn)，直接按鍵盤的Delete鍵，將這兩個錨點(diǎn)刪除，得到如圖2-42所示圖形。單擊圖2-42所示心形底部的錨點(diǎn)，出現(xiàn)控制手柄，按下Alt鍵，向左上方拖動右側(cè)手柄，如圖2-43（a）。這樣做的目的是使右側(cè)輪廓線有個向里的弧度。得到2-43(b)所示形狀。同樣按下Alt鍵，向右上方拖動左側(cè)手柄，使兩側(cè)形成同樣的弧度線。最終調(diào)整成如圖2-43（c）所示形狀。

圖2-43用部分選取工具調(diào)整圖形形狀（b）（a）（c）接著用任意變形工具將該圖壓扁，執(zhí)行Ctrl+D直接復(fù)制，將復(fù)制的圖形拖到一邊，執(zhí)行菜單“修改”→“變形”→“垂直翻轉(zhuǎn)”命令，將復(fù)制的圖形垂直翻轉(zhuǎn)180度。再用任意變形工具將它縮小一定比例，放在剛才的圖形之上。如圖2-44（a）所示。接著用選擇工具將兩側(cè)略微向里調(diào)整。這樣一個簡單的瓢蟲頭部就完成了。如圖2-44（b）。

圖2-44飄蟲頭部(a)(b)（5）分別創(chuàng)建名為“眼睛”和“斑點(diǎn)”的新層，選擇工具箱的刷子工具，使用不同的刷子形狀和大小，畫上瓢蟲的眼睛和斑點(diǎn)。其時(shí)間軸和舞臺效果如圖2-45所示：

圖2-45瓢蟲的圖層結(jié)構(gòu)（6）創(chuàng)建名為“足部”的新層，單擊圖層名選中該層，將其拖動到最底層。這樣做的目的是將瓢蟲的足部放在最下面。使用刷子工具繪制如圖2-46（a）所示的形狀。將它再復(fù)制五個，使用任意變形工具改變其位置和大小，放到合適的位置。接著用刷子工具繪制兩個小小的觸角。至此，一個可愛的小瓢蟲就畫好了。如圖2-46（b）。

2-46繪制飄蟲的足部(a)(b)（2）新建名為“瓢蟲”的圖層，按F11打開元件庫，將元件庫里的瓢蟲拖到大樹的根部，作為它爬動的起始位置。用任意變形工具將它調(diào)整到合適大小。然后選擇時(shí)間軸的第126幀，按F6插入關(guān)鍵幀。選中第126幀上的瓢蟲，將它拖到樹上，作為它爬動的結(jié)束位置。選擇任意變形工具，再將它縮小一些。2．創(chuàng)建瓢蟲爬動的運(yùn)動動畫（1）單擊時(shí)間軸上方的“場景1”按鈕，切換回場景1?，F(xiàn)在我們來做瓢蟲向樹上爬動的效果。用我們前面所學(xué)的逐幀動畫當(dāng)然也可以做成瓢蟲向上爬動的效果，但是制作過程過于繁瑣?，F(xiàn)在來學(xué)習(xí)一種更簡單的方法，補(bǔ)間動畫。（3）然后在第1幀和第126幀之間任意幀上單擊鼠標(biāo)右鍵，從彈出的快捷菜單中選擇“創(chuàng)建補(bǔ)間動畫”。即可產(chǎn)生瓢蟲向上爬動的效果，而且會越來越小。如圖2-47所示：圖2-47創(chuàng)建補(bǔ)間動畫（4）創(chuàng)建補(bǔ)間動畫還有另外一種方法，以上例創(chuàng)建1-126幀之間的補(bǔ)間動畫為例。在第1幀和第126幀之間任意幀上單擊，然后打開屬性面板，在屬性面板的補(bǔ)間選項(xiàng)中選擇“動畫”項(xiàng)。如圖2-48所示。單擊下拉三角箭頭，在展開的下拉選項(xiàng)中選擇補(bǔ)間動畫圖2-48創(chuàng)建補(bǔ)間動畫的另一種方法第二單元美麗家園3．瓢蟲以加速度向樹上爬行瓢蟲剛開始向樹上爬時(shí)，速度比較慢，后來速度逐漸加快。若想實(shí)現(xiàn)此效果需要在補(bǔ)間動畫的屬性面板中設(shè)置“緩動”項(xiàng)。選擇1-126幀之間任意一幀，打開屬性面板，在“緩動”項(xiàng)后，直接拖動滑桿，設(shè)置其值為-100。其屬性面板如圖2-49所示。負(fù)值表示為加速度，對象運(yùn)動會越來越快。圖2-49補(bǔ)間動畫屬性面板第二單元美麗家園4.保存文件執(zhí)行“文件”→“保存”命令，將文件保存。舉一反三1．結(jié)合本單元前兩個任務(wù)中舉一反三的例子，完成小鴨在水面游過的動畫。2．利用補(bǔ)間動畫制作皮球的下落、彈起過程。動畫效果動畫效果制作說明：小球落下后的變形，也是利用補(bǔ)間動畫來完成的。只需略微改變它的外形即可。任務(wù)四沿任意路徑運(yùn)動的瓢蟲[本任務(wù)重點(diǎn)]:創(chuàng)建引導(dǎo)層，使對象沿指定的路線運(yùn)動。[本任務(wù)目標(biāo)]:讓瓢蟲沿曲線向上運(yùn)動。自己動手：1．創(chuàng)建運(yùn)動引導(dǎo)層選擇“瓢蟲”層，單擊時(shí)間軸下方的添加運(yùn)動引導(dǎo)層按鈕，或者右鍵單擊瓢蟲層，在彈出的快捷菜單中選擇“添加引導(dǎo)層”?？梢钥吹皆谠搶由厦娑喑鲆粋€名為“引導(dǎo)層”的圖層