《Flash動畫設(shè)計與制作（第三版）》項目一 圖形繪制

Flash動畫設(shè)計與制作（第三版）1項目一

圖形繪制2項目一圖形繪制3動畫通過連續(xù)播放一系列畫面，從而讓人在視覺上產(chǎn)生畫面連續(xù)變化的效果。本課程旨在介紹如何使用Flash制作動畫。圖形繪制是創(chuàng)作動畫的基礎(chǔ)，也是學(xué)習(xí)Flash動畫制作必備的基本功。與位圖處理軟件Photoshop不同，動畫制作軟件Flash是一款矢量圖形編輯和動畫制作軟件，在圖形繪制方面更易上手，學(xué)生學(xué)習(xí)起來也更容易。項目一圖形繪制4本項目通過繪制彩色氣球、新年燈籠、桃子熟了圖像和美麗的家園等簡單圖形培養(yǎng)學(xué)生的圖形繪制能力，為后期設(shè)計精美的原創(chuàng)動畫奠定基礎(chǔ)。同時，本項目中繪制的圖形在后續(xù)項目中可直接被用于制作動畫部分。例如，繪制彩色氣球后，將在項目六的制作兒童節(jié)賀卡任務(wù)中使用這些彩色氣球圖形并讓它們“飛”起來；繪制新年燈籠后，將在項目六的制作春節(jié)賀卡任務(wù)中讓燈籠圖形閃動起來；繪制桃子熟了圖像后，將在項目三的制作七十二變動畫任務(wù)中使用帶金箍棒的桃子圖形去模擬孫悟空七十二變這一情境；繪制美麗的家園后，將在項目三的制作荷蘭風情動畫任務(wù)中使用其中的郁金香圖形制作花生長的動畫。項目一

圖形繪制任務(wù)1繪制彩色氣球任務(wù)2繪制新年燈籠任務(wù)3繪制桃子熟了圖像任務(wù)4繪制美麗的家園56任務(wù)一

繪制彩色氣球?qū)W習(xí)目標能說出Flash工作界面中各組成部分的作用能導(dǎo)入位圖能熟練使用橢圓工具、選擇工具、漸變變形工具和鉛筆工具能進行文檔的測試和保存7任務(wù)描述8本任務(wù)是一個簡單的基本圖形繪制實例，主要利用橢圓工具、選擇工具和鉛筆工具等來繪制彩色氣球，效果如圖1-1-1所示。要完成本任務(wù)，除了掌握基本繪圖工具的用法外，還要了解顏色搭配、構(gòu)圖和比例等方面的知識，使繪制出來的圖形賞心悅目。圖1-1-1?彩色氣球效果圖相關(guān)知識9AdobeFlashCS3（以下簡稱Flash）是美國Adobe公司出品的一款矢量圖形編輯和動畫制作軟件，它的前身是MacromediaFlash。Flash從Illustrator和Photoshop中借用了一些有創(chuàng)新性的工具，可以非常輕松地將元件導(dǎo)入Flash中，然后在Flash中進行編輯。同時，F(xiàn)lash借用了Illustrator中的鋼筆工具，可以對點和線進行曲線控制操作。用Flash制作的圖形和動畫具有文件小、交互性強、可無損放大、可帶音效和兼容性好等特點，深受人們喜愛。Flash主要用于網(wǎng)頁設(shè)計、游戲和多媒體制作等領(lǐng)域，用它可以制作不同形式的動畫，是動畫制作中不可或缺的一員。一、Flash簡介相關(guān)知識10Flash二維動畫的制作是通過輸入和編輯關(guān)鍵幀，計算和生成中間幀，定義和顯示運動路徑及交互式變化畫面，產(chǎn)生一些特技效果，實現(xiàn)畫面與聲音的同步。因此，動畫的制作要涉及場景、時間軸和時間軸面板、幀、圖層、元件等元素，相關(guān)知識將在后續(xù)的項目中陸續(xù)介紹。一、Flash簡介相關(guān)知識11啟動Flash后，出現(xiàn)圖1-1-2所示的Flash啟動界面。二、Flash工作界面圖1-1-2?Flash啟動界面相關(guān)知識12二、Flash工作界面在啟動界面中，可以新建文件，也可以打開最近使用的文件或已有文件，還可以選擇從模板創(chuàng)建新文件。選擇“新建”中的“Flash文件（ActionScript3.0）”，F(xiàn)lash會自動創(chuàng)建名為“未命名-1.fla”的Flash文檔，同時進入圖1-1-3所示的Flash工作界面。工作界面中各組成部分的作用如下。圖1-1-3?Flash工作界面相關(guān)知識131.?標題欄標題欄位于工作界面的頂部，顯示當前文檔的名稱。2.?菜單欄菜單欄位于標題欄的下方，包含“文件”“編輯”“視圖”“插入”“修改”“文本”“命令”“控制”“調(diào)試”“窗口”“幫助”菜單，可以實現(xiàn)除了繪圖外的絕大多數(shù)操作。3.?工具箱工具箱位于工作界面的左側(cè)，主要用于繪制和修改圖形，以及完成填充顏色等與圖形相關(guān)的操作。4.?時間軸面板時間軸面板位于菜單欄的下方，用于完成控制、組織圖層和幀的相關(guān)操作。相關(guān)知識145.?舞臺舞臺是位于工作界面中央的白色區(qū)域，它是顯示、編輯和繪制動畫的區(qū)域。6.?工作區(qū)舞臺周圍的淺灰色區(qū)域是工作區(qū)，它是放置備用元素的區(qū)域，該區(qū)域的內(nèi)容不會出現(xiàn)在發(fā)布后的動畫中。7.?屬性欄屬性欄位于舞臺的下方，用于設(shè)置和修改文檔及各種被選擇對象的屬性。選擇不同的對象，就會出現(xiàn)不同的屬性面板。8.?浮動面板浮動面板位于工作界面的右側(cè)，用于查看、組織和更改文檔中的元素。相關(guān)知識15三、文檔的測試、保存與發(fā)布1.?測試動畫制作完成后，可以在場景中直接按“Enter”鍵預(yù)覽動畫的播放效果。執(zhí)行“控制”→“測試影片”命令或按“Ctrl+Enter”組合鍵將會出現(xiàn)播放窗口。在播放窗口中可以預(yù)覽整個動畫畫面。2.?保存與發(fā)布執(zhí)行“文件”→“保存”命令，生成“*.fla”格式的文件，此格式的文件即為Flash源文件。執(zhí)行“文件”→“發(fā)布設(shè)置”命令，彈出“發(fā)布設(shè)置”對話框，在對話框中按圖1-1-4所示進行設(shè)置，就可以在源文件的相同路徑下生成“*.swf”格式的文件。圖1-1-4?“發(fā)布設(shè)置”對話框相關(guān)知識16四、常用工具介紹1.?橢圓工具橢圓工具用于繪制橢圓形和圓形。長按工具箱中的“矩形工具”按鈕

，從彈出的面板中選擇“橢圓工具”，如圖1-1-5所示。圖1-1-5?“橢圓工具”的選擇相關(guān)知識17四、常用工具介紹選擇橢圓工具后，在舞臺的合適位置按住鼠標左鍵并拖動，即可繪制出橢圓形，在按住“Shift”鍵的同時按住鼠標左鍵并拖動，可繪制出正圓形，橢圓工具的“屬性”面板如圖1-1-6所示。圖1-1-6?橢圓工具的“屬性”面板相關(guān)知識18四、常用工具介紹（1）筆觸顏色：在“屬性”面板中，單擊“筆觸顏色”按鈕，會彈出調(diào)色板，如圖1-1-7所示，此時鼠標指針變?yōu)槲軤?，可以直接吸取需要的顏色，也可以在輸入框?nèi)輸入十六進制數(shù)字，完成筆觸顏色的設(shè)置。（2）筆觸高度：在“屬性”面板中，可以在“筆觸高度”輸入框中直接輸入數(shù)值確定筆觸高度，也可以單擊“筆觸高度”輸入框右側(cè)的倒三角形按鈕，通過拖動滑塊進行筆觸高度的設(shè)置。圖1-1-7?調(diào)色板相關(guān)知識19四、常用工具介紹（3）筆觸樣式：在“屬性”面板中，單擊“筆觸樣式”右側(cè)的倒三角形按鈕會彈出一個下拉列表，如圖1-1-8所示，可從中選擇筆觸樣式。圖1-1-8?“筆觸樣式”下拉列表相關(guān)知識20四、常用工具介紹（4）自定義筆觸樣式：在“屬性”面板中單擊“自定義”按鈕，可打開“筆觸樣式”對話框，如圖1-1-9所示，在“筆觸樣式”對話框中可進行筆觸樣式的設(shè)計。圖1-1-9?“筆觸樣式”對話框相關(guān)知識21四、常用工具介紹（5）填充顏色：“填充顏色”按鈕的用法與“筆觸顏色”按鈕的用法相同。（6）橢圓起始、結(jié)束角度：在“屬性”面板中的“起始角度”和“結(jié)束角度”輸入框內(nèi)輸入數(shù)值，可以繪制出扇形；也可以單擊“起始角度”和“結(jié)束角度”輸入框右側(cè)的倒三角形按鈕，通過拖動滑塊來設(shè)置橢圓的起始角度和結(jié)束角度。相關(guān)知識22四、常用工具介紹2.?選擇工具選擇工具主要用于選擇對象，修改對象形狀，以及移動、復(fù)制對象。（1）選擇對象：在對象上單擊即可選擇一個對象，若要選擇多個對象，可按住“Shift”鍵逐個單擊對象或者按住鼠標左鍵拖動以對對象進行框選。相關(guān)知識23四、常用工具介紹（2）修改對象形狀：將鼠標指針指向?qū)ο蟮墓战?，按住鼠標左鍵并拖動，可改變對象的拐角，如圖1-1-10所示；將鼠標指針移向直線段邊緣，按住鼠標左鍵并拖動，可將直線段變成曲線段，如圖1-1-11所示。圖1-1-10?改變對象的拐角圖1-1-11?將直線段變成曲線段相關(guān)知識24四、常用工具介紹（3）移動、復(fù)制對象：選擇對象后按住鼠標左鍵并拖動，可移動對象；在按住“Ctrl”或“Alt”鍵的同時按住鼠標左鍵并拖動，可復(fù)制對象。相關(guān)知識25四、常用工具介紹3.?漸變變形工具漸變變形工具用于對填充對象的填充顏色作變形處理，它有線性漸變和放射狀漸變兩種方式。線性漸變的設(shè)置方法如圖1-1-12所示。圖1-1-12?線性漸變的設(shè)置方法相關(guān)知識26四、常用工具介紹放射狀漸變的設(shè)置方法如圖1-1-13所示。圖1-1-13?放射狀漸變的設(shè)置方法相關(guān)知識27四、常用工具介紹4.?鉛筆工具鉛筆工具可用于繪制線條和圖形，其“屬性”面板如圖1-1-14所示。圖1-1-14?鉛筆工具的“屬性”面板相關(guān)知識28四、常用工具介紹使用鉛筆工具繪制圖形時，可以根據(jù)需要單擊工具箱中的“鉛筆模式”按鈕，選擇“直線化”“平滑”“墨水”三種繪圖方式之一進行繪制，如圖1-1-15所示。圖1-1-15?鉛筆工具的繪圖方式29任務(wù)二

繪制新年燈籠學(xué)習(xí)目標能區(qū)分合并繪制模式和對象繪制模式能熟練使用矩形工具、多角星形工具、任意變形工具和線條工具30任務(wù)描述31本任務(wù)主要利用矩形工具、多角星形工具、任意變形工具和線條工具來繪制新年燈籠，效果如圖1-2-1所示。要完成本任務(wù)，除了掌握基本繪圖工具的用法及圖形描邊的方法外，還要熟悉構(gòu)圖原理及配色技巧。圖1-2-1?新年燈籠效果圖相關(guān)知識32一、繪制模式Flash中的繪制模式有合并繪制模式和對象繪制模式兩種，其中合并繪制模式為默認繪制模式。初學(xué)者在繪制圖形時常會因不清楚兩者之間的區(qū)別而走不必要的彎路，下面簡單介紹這兩種繪制模式的區(qū)別。1.?合并繪制模式在此模式下繪制的圖形叫形狀。當在同一圖層中繪制的形狀顏色相同時，重疊繪制的形狀會自動進行合并，如圖1-2-2所示。圖1-2-2?顏色相同的形狀自動合并相關(guān)知識33一、繪制模式當在同一圖層中繪制的形狀顏色不同時，重疊繪制的形狀中最上層的形狀會截去下層與其重疊的形狀部分，如圖1-2-3所示。圖1-2-3?顏色不同的形狀截去重疊部分相關(guān)知識34一、繪制模式2.?對象繪制模式在此模式下繪制的圖形叫繪制對象。在工具箱中選擇橢圓工具后，單擊工具箱中位于倒數(shù)第二個的“對象繪制”按鈕即可切換到對象繪制模式，如圖1-2-4所示。圖1-2-4?“對象繪制”按鈕相關(guān)知識35一、繪制模式此時在舞臺上拖動鼠標繪制橢圓形得到的是繪制對象。繪制對象的四周有藍色矩形邊框，兩個繪制對象疊加在一起時相互不受影響，因此不會出現(xiàn)繪制對象合并或切割的問題，如圖1-2-5所示。圖1-2-5?對象繪制模式效果相關(guān)知識36二、常用工具介紹1.?矩形工具矩形工具用于繪制矩形、正方形和圓角矩形。繪制正方形時需在按住“Shift”鍵的同時按住鼠標左鍵并拖動來完成繪制。在“屬性”面板中設(shè)置矩形邊角半徑，可以繪制出圓角矩形。矩形工具的“屬性”面板如圖1-2-6所示。圖1-2-6?矩形工具的“屬性”面板相關(guān)知識37二、常用工具介紹2.?多角星形工具多角星形工具用于繪制多邊形及星形。長按工具箱中的“矩形工具”按鈕

，從彈出的面板中選擇“多角星形工具”。單擊多角星形工具“屬性”面板中的“選項”按鈕，在彈出的“工具設(shè)置”對話框中可以設(shè)置繪制的樣式、邊數(shù)和星形頂點大小。多角星形工具的“屬性”面板和“工具設(shè)置”對話框分別如圖1-2-7和圖1-2-8所示。圖1-2-7?多角星形工具的“屬性”面板圖1-2-8?“工具設(shè)置”對話框相關(guān)知識38二、常用工具介紹3.?任意變形工具任意變形工具用于縮放、旋轉(zhuǎn)、傾斜、扭曲對象以及修改對象封套。單擊工具箱中的“任意變形工具”按鈕，對象周圍會出現(xiàn)控點，拖動控點可改變圖形大小，如圖1-2-9所示。在工具箱下方，F(xiàn)lash設(shè)置了“旋轉(zhuǎn)與傾斜”“縮放”“扭曲”“封套”四種變形模式供用戶選擇，如圖1-2-10所示。圖1-2-9?對象周圍控點圖1-2-10?任意變形工具的變形模式相關(guān)知識39二、常用工具介紹（1）旋轉(zhuǎn)與傾斜：單擊“旋轉(zhuǎn)與傾斜”按鈕，將鼠標指針放在邊角控點上，按住鼠標左鍵并拖動可旋轉(zhuǎn)對象，將鼠標指針放在任一邊緣控點上按住鼠標左鍵并拖動可傾斜對象，如圖1-2-11和圖1-2-12所示。圖1-2-11

旋轉(zhuǎn)對象圖1-2-12?傾斜對象相關(guān)知識40二、常用工具介紹（2）縮放：單擊“縮放”按鈕，按住鼠標左鍵并拖動控點可改變對象的大小，如圖1-2-13所示。圖1-2-13?縮放對象相關(guān)知識41二、常用工具介紹（3）扭曲：單擊“扭曲”按鈕，按住鼠標左鍵并拖動角控點或邊控點可扭曲對象，如圖1-2-14所示。圖1-2-14?扭曲對象相關(guān)知識42二、常用工具介紹（4）封套：單擊“封套”按鈕，按住鼠標左鍵并拖動控點和控制手柄可修改對象封套，如圖1-2-15所示。圖1-2-15?修改對象封套相關(guān)知識43二、常用工具介紹4.?線條工具線條工具用于繪制各種樣式的線條。按住“Shift”鍵，可以繪制水平、垂直或傾斜（以45°為增量）的直線。44任務(wù)三

繪制桃子熟了圖像學(xué)習(xí)目標能熟練使用鋼筆工具、部分選取工具和顏料桶工具掌握圖形元件的制作方法45任務(wù)描述46本任務(wù)是一個卡通圖形繪制實例，主要利用鋼筆工具、鉛筆工具、橢圓工具、部分選取工具和顏料桶工具來繪制桃子熟了圖像，效果如圖1-3-1所示。要完成本任務(wù)，除了掌握鋼筆工具、部分選取工具的使用技巧以及翻轉(zhuǎn)對象的方法外，還要在繪制過程中注意構(gòu)圖和比例。圖1-3-1?桃子熟了圖像效果圖相關(guān)知識47一、鋼筆工具鋼筆工具用于繪制光滑的線條和路徑。1.?繪制直線段選擇工具箱中的鋼筆工具，在舞臺中適當位置單擊，繪制第一個錨點，再在另一適當位置單擊，即可完成直線段的繪制，如圖1-3-2所示。在繪制的同時，如果按住“Shift”鍵，可以繪制與舞臺中的水平線成0°、45°或90°角的直線段。圖1-3-2?繪制直線段要繪制一個開放路徑，可雙擊最后一個錨點；要繪制一個封閉路徑，可將鋼筆工具移動到第一個錨點處，這時鼠標指針旁會出現(xiàn)一個小圓環(huán)，單擊即可完成繪制。相關(guān)知識48一、鋼筆工具2.?繪制曲線段選擇工具箱中的鋼筆工具，在舞臺中預(yù)畫曲線段的起點處單擊，繪制曲線段的第一個錨點，然后松開鼠標左鍵并移動鼠標指針到第二個錨點處，按住鼠標左鍵，同時調(diào)整曲線段延伸方向使之符合要求，松開鼠標左鍵，繼續(xù)移動鼠標指針到下一個錨點處，按同樣方法操作，即可繪制出需要的曲線段，如圖1-3-3所示。圖1-3-3?繪制曲線段相關(guān)知識49一、鋼筆工具3.?修改路徑長按工具箱中的“鋼筆工具”按鈕，打開圖1-3-4所示面板，用戶可根據(jù)需要選擇工具來修改路徑。（1）添加錨點工具

：選擇添加錨點工具，在需要添加錨點的位置單擊，即可添加錨點，如圖1-3-5所示。圖1-3-4?“鋼筆工具”面板圖1-3-5?添加錨點相關(guān)知識50一、鋼筆工具（2）刪除錨點工具

：選擇刪除錨點工具，在需要刪除錨點的位置單擊，即可刪除錨點，如圖1-3-6所示。（3）轉(zhuǎn)換錨點工具

：選擇轉(zhuǎn)換錨點工具，在曲線點上單擊，曲線點轉(zhuǎn)換為角點，如圖1-3-7所示；在角點上單擊鼠標左鍵并拖動，角點轉(zhuǎn)換為曲線點，如圖1-3-8所示。圖1-3-6?刪除錨點圖1-3-7?曲線點轉(zhuǎn)換為角點圖1-3-8?角點轉(zhuǎn)換為曲線點相關(guān)知識51二、部分選取工具部分選取工具用于改變對象的形狀。用部分選取工具選擇對象的輪廓會出現(xiàn)多個錨點，如圖1-3-9所示。通過調(diào)節(jié)錨點的位置或方向，可改變對象的形狀。1.?移動錨點在要移動的錨點上長按鼠標左鍵并拖動可移動錨點，如圖1-3-10所示。圖1-3-9?選擇對象的輪廓圖1-3-10?移動錨點相關(guān)知識52二、部分選取工具2.?刪除錨點單擊以選擇錨點，按“Delete”鍵可刪除錨點，如圖1-3-11所示。3.?修改對象形狀單擊以選擇錨點，拖動或旋轉(zhuǎn)錨點的控制手柄可改變對象的形狀，如圖1-3-12所示。圖1-3-11?刪除錨點圖1-3-12?改變對象形狀相關(guān)知識53三、顏料桶工具顏料桶工具用于更改填充區(qū)域的顏色。它能將顏色、漸變色和位圖等填充到指定區(qū)域中。顏料桶工具的“屬性”面板如圖1-3-13所示。圖1-3-13?顏料桶工具的“屬性”面板相關(guān)知識54三、顏料桶工具若需要填充漸變色或位圖，可以執(zhí)行“窗口”→“顏色”命令打開“顏色”面板，在“顏色”面板中設(shè)置要填充的類型，如圖1-3-14所示。使用顏料桶工具除了能夠填充封閉的區(qū)域外，還可以填充不完全封閉的區(qū)域，這一功能可以通過單擊工具箱下方倒數(shù)第二個“空隙大小”按鈕并打開“空隙大小”面板來完成，如圖1-3-15所示。圖1-3-14

“顏色”面板圖1-3-15?顏料桶工具填充方式設(shè)置55任務(wù)四

繪制美麗的家園學(xué)習(xí)目標56能熟練使用“對齊”面板調(diào)整圖形之間的對齊方向、分布間距和匹配大小等掌握圖層的使用技巧能熟練使用文本工具、墨水瓶工具、縮放工具和手形工具能熟練使用圖形元件繪制場景任務(wù)描述57本任務(wù)是一個場景繪制實例，主要利用矩形工具、橢圓工具