項目二　繪好圖形，動畫內(nèi)容更豐富

項目描述

在Flash動畫制作中，動畫素材是不可缺少的。除了可通過導(dǎo)入方式獲得外，還可以利用軟件自帶的繪圖工具來繪制。Flash CS5提供了豐富的繪圖工具用于繪制和填充圖形。本項目將重點介紹Flash CS5中各種繪圖工具的使用及擴展功能，并通過實例對各種繪圖工具的操作方法進行演練。

項目目標(biāo)

掌握Flash CS5圖形繪制的基本方法，熟練運用線條、鋼筆、多邊形、矩形、橢圓等工具，掌握圖形的填充、顏色設(shè)置等方法，掌握新增的噴涂、Deco工具的使用。

任務(wù)一　繪制“職教中心?；铡?/p>

我明了

本任務(wù)是通過制作“職教中心?；铡?，熟悉橢圓工具、矩形工具、鋼筆工具、文本工具的運用。

我掌握

本任務(wù)要求掌握Flash CS5、鋼筆工具、部分選取工具的運用，了解基本橢圓工具、文本工具；掌握對文字、所繪制圖形屬性的設(shè)置。

我準(zhǔn)備

鋼筆工具：鋼筆工具可以繪制連續(xù)的折線或平滑的曲線。在“工具”面板中選擇“鋼筆工具”(快捷鍵為【P】)。

繪制折線方法：將光標(biāo)移到舞臺適當(dāng)位置并單擊，確定超錨點，錨點在舞臺上表現(xiàn)為一個小圓圈，將光標(biāo)移到舞臺另一處單擊，創(chuàng)建第二個錨點，此時在起始錨點和第二個錨點之間會出現(xiàn)一條直線，繼續(xù)在其他位置單擊創(chuàng)建第三個錨點，最后將光標(biāo)移到起始錨點處，光標(biāo)會呈現(xiàn)形狀，此時單擊，可創(chuàng)建封閉圖形。圖形繪制完成后，再選擇除鋼筆和部分選擇工具以外的其他工具，或者按【Esc】鍵結(jié)束繪制。

繪制曲線的方法：選擇“鋼筆工具”，在舞臺上單擊，確定起點，然后在另一處按住鼠標(biāo)左鍵不放并拖動，可拖出一個調(diào)節(jié)桿，向任意方向拖動調(diào)節(jié)桿，可調(diào)整曲線的弧度，對曲線滿意后，釋放鼠標(biāo)左鍵可創(chuàng)建一個曲線錨點(見圖2-1)，在起始錨點下方單擊創(chuàng)建第三個錨點(見圖2-2)，由于前一個錨點是曲線點，所以此時的線段不是直線而是一條與曲線錨點相切的曲線。參照以上步驟可以完成如圖2-3所示的心形。

圖2-1　創(chuàng)建一個曲線錨點

圖2-2　創(chuàng)建第三個錨點

圖2-3　創(chuàng)建心形

使用“部分選擇工具”可以方便地移動錨點位置和調(diào)整曲線路徑的弧度。將光標(biāo)移到繪制圖形上單擊，顯示錨點，單擊要移動的錨點，然后按住鼠標(biāo)左鍵并拖動，可以移動錨點位置，將光標(biāo)移到曲線錨點的調(diào)節(jié)桿上，然后按住鼠標(biāo)左鍵不動并拖動，可調(diào)整曲線路徑的弧度，在拖動時按住【Alt】鍵，可單獨調(diào)整一邊的調(diào)節(jié)桿。按下“鋼筆工具”不動，會彈出“鋼筆工具”選項(見圖2-4)。

圖2-4　“鋼筆工具”選項

選擇“添加錨點工具”后，將光標(biāo)移到已顯示錨點的圖形上單擊，可以添加一個錨點，選擇“刪除錨點工具”后，將光標(biāo)移到已有錨點上方單擊，可以刪除該錨點，選擇“轉(zhuǎn)換錨點工具”后，將光標(biāo)移到用其他工具繪制的線條上單擊，可以顯示圖形上的錨點，將光標(biāo)移到直線錨點上按住鼠標(biāo)左鍵并拖動，可以將直線錨點轉(zhuǎn)為曲線錨點，將光標(biāo)移到曲線錨點的調(diào)節(jié)桿上，按住鼠標(biāo)左鍵并拖動，可以單獨調(diào)整一邊的錨點(與按下【Alt】鍵功效一樣)，將光標(biāo)移到曲線錨點上單擊，可將曲線錨點轉(zhuǎn)為直線錨點。

設(shè)置網(wǎng)格：單擊菜單“視圖”→“網(wǎng)格”命令，出現(xiàn)“顯示網(wǎng)格”與“編輯網(wǎng)格”，單擊“顯示網(wǎng)格”在舞臺上顯示默認(rèn)網(wǎng)格，再次單擊可以隱藏網(wǎng)格。顯示網(wǎng)格可以輔助我們對舞臺上對象進行編輯與排列。如果網(wǎng)格不理想，太大或太小，可以單擊“編輯網(wǎng)格”，設(shè)置網(wǎng)格的顯示與隱藏、網(wǎng)格的大小、是否自動貼緊到網(wǎng)格等屬性，如圖2-5所示。

圖2-5　“網(wǎng)格”對話框

我動手

1. 新建文檔

運行 Flash CS5，單擊菜單欄中的“文件”→“新建”→“ActionScript 3.0”命令，新建一個 Flash文檔。在舞臺上右擊調(diào)出文檔屬性設(shè)置框，并設(shè)置文檔尺寸為“500像素×500像素”，其他屬性保持默認(rèn)參數(shù)。

試一試：

單擊菜單“修改”→“文檔”命令，試一試有什么收獲。

2. 繪制環(huán)形

(1) 將默認(rèn)“圖層1”修改為“環(huán)形”，用鼠標(biāo)左鍵按住矩形工具不動，然后選擇“基本橢圓工具”，如圖2-6所示。

圖2-6　選擇“基本橢圓工具”

(2) 選擇筆觸顏色為“無”，填充色為“#0066FF”，按住【Shift】鍵在舞臺上拉動鼠標(biāo)，繪制一個圓，如圖2-7(b)所示。

圖2-7　選擇筆觸與填充色及繪制的圓形

(3) 選中圖2-7(b)中的圓，然后在右邊屬性欄內(nèi)修改X、Y坐標(biāo)均為0，寬、高均為500，內(nèi)徑為60，如圖2-8(a)所示，效果如圖2-8(b)所示。

圖2-8　設(shè)置橢圓屬性及設(shè)置后效果

試一試：

將鼠標(biāo)指向“X”、“Y”、“寬”、“高”右邊的數(shù)字，拖動鼠標(biāo)看看有什么效果。

3. 繪制環(huán)內(nèi)“雛鳥”

(1) 新建圖層“雛鳥”，選擇“鋼筆工具”，在右邊“屬性”面板中選擇筆觸顏色為黑色，筆觸高度為2，樣式選擇“實線”，如圖2-9所示。

(2) 在環(huán)形內(nèi)部單擊，產(chǎn)生第一個錨點；在第一個錨點右邊偏上方按下鼠標(biāo)左鍵產(chǎn)生第二個錨點；接著在第二個錨點左下方按下鼠標(biāo)左鍵并拖動，生成第三個錨點，依次生成其余錨點，最后在起始錨點上單擊并拖動來閉合曲線(顯示網(wǎng)格便于繪圖)，如圖2-10所示。

圖2-9　設(shè)置“鋼筆工具”屬性

圖2-10　繪制雛鳥

(3) 選擇“顏料桶工具”，填充色仍然設(shè)置為“#0066FF”，在“雛鳥”內(nèi)單擊便將其填充，然后雙擊“雛鳥”邊線，按【Delete】鍵，刪除邊線。繼續(xù)用“鋼筆工具”繪制雛鳥下半部分并填充，如圖2-11所示。

(4) 選擇“矩形工具”，筆觸顏色為“無”，填充色為“#0066FF”，在舞臺上繪制一個矩形。選中這個矩形，在右邊“屬性”面板中設(shè)置寬100，高12。然后按組合鍵【Ctrl+T】，打開“變形”面板，按圖2-12所示的進行設(shè)置。

想一想：

為什么這里要選中矩形，你知道嗎？

圖2-11　填充“雛鳥”

圖2-12　設(shè)置矩形屬性

(5) 將設(shè)置后的矩形拖動到“雛鳥”尾部，然后按住【Ctrl】鍵往下拖動該矩形，并調(diào)整復(fù)制后的第二根“羽毛”，同理做出第三根、第四根“羽毛”，如圖2-13所示。

(6) 選擇“橢圓工具”，在舞臺上畫一個顏色為“#0066FF” 的圓，然后設(shè)置寬、高均為30，并調(diào)整到如圖2-14所示位置。

圖2-13　添加“羽毛”

圖2-14　添加“球”

想一想：

按住【Ctrl】鍵，往下拖動是不是比使用“復(fù)制”然后“粘貼”的方法更便捷呢？

4. 輸入文字

(1) 選擇“文本工具”，在右邊屬性欄內(nèi)對字體、大小、顏色等屬性進行設(shè)置，如圖2-15所示。

(2) 設(shè)置好屬性后，在舞臺上輸入“秭歸縣職教中心”七個字，然后選中這幾個字，單擊菜單“修改”→“分離”命令，這樣就將文本框分離成七個單獨的對象，如圖2-16所示。

試一試：

選中這七個字后，按組合鍵【Ctrl+B】，試試效果。

圖2-15　文字屬性

圖2-16　輸入、分離文字

小經(jīng)驗：

設(shè)置具體的旋轉(zhuǎn)角度比手動調(diào)整更精確。

(3) 調(diào)整文字位置。首先將七個分離后的字按圖2-17所示的分布放好，選擇“秭”字，按組合鍵【Ctrl+T】，調(diào)出“變形”面板，設(shè)置“旋轉(zhuǎn)”為－110°，同理將“歸”設(shè)置為－70°，“縣”設(shè)置為－35°，“教”、“中”、“心”分別設(shè)置為35°、70°、110°，設(shè)置后的效果如圖2-18所示。

圖2-17　調(diào)整文字位置

圖2-18　調(diào)整文字角度

5. 導(dǎo)出圖像

最終時間軸如圖2-19所示，保存該文檔為“?；?fla”，單擊菜單“文件”→“導(dǎo)出”→“導(dǎo)出圖像”命令，命名為“?；铡?，選擇jpg格式，彈出“導(dǎo)出設(shè)置”對話框，“品質(zhì)”改為100，單擊“確定”按鈕，如圖2-20所示。

圖2-19　時間軸效果

圖2-20　設(shè)置導(dǎo)出屬性

我收獲

我留言

我練習(xí)

(1) 使用“基本橢圓工具”繪制“中國人壽”標(biāo)志，效果如圖2-21所示。

(2) 使用“橢圓工具”和“鋼筆工具”繪制“一條魚”，效果如圖2-22所示。

圖2-21　中國人壽標(biāo)志

圖2-22　魚

任務(wù)二　繪制“鬧鐘精靈”

我明了

在本任務(wù)中，我們一起繪制一個很可愛的卡通“鬧鐘”，進一步鞏固文檔的設(shè)置方法、“工具箱”常用工具的使用方法，以及對繪制的對象進行變形。

我掌握

掌握“矩形工具”、“橢圓工具”、“多邊形工具”的運用，掌握對填充色的選擇與設(shè)置方法。

我準(zhǔn)備

“橢圓工具”可以繪制出橢圓、正圓、扇形和弧線。橢圓工具在其他幾何工具默認(rèn)情況下是看不到的，按住“工具”面板中的矩形工具不動，然后在展開的工具列表中選擇橢圓工具便可切換過來。

小經(jīng)驗：

用“橢圓工具”、“多邊形工具”繪制圖形時，按住【Shift】鍵可以繪出正圓或正多邊形；繪制直線時，按住【Shift】鍵可以繪出水平、垂直、傾斜45°等直線。

我動手

1. 新建文檔

運行 Flash CS5，單擊菜單欄中的“文件”→“新建”→“ActionScript 3.0”命令，新建一個 Flash文檔。在舞臺上右擊調(diào)出文檔屬性設(shè)置框，并設(shè)置文檔尺寸為“550像素×400像素”，其他屬性保持默認(rèn)參數(shù)。

2. 繪制“鬧鐘”頭部

(1) 選擇“橢圓工具”，在“屬性”面板中設(shè)置筆觸顏色為“#482D7A”，填充色為“#DDDDDD”，筆觸高度為4，單擊工具箱下方的“繪制對象”，然后在舞臺的中央，按住【Shift】鍵，單擊并拖動鼠標(biāo)，繪制一個正圓。

(2) 選擇“選擇工具”，選中剛繪制的圓形，在“屬性”面板中調(diào)整圓形的大小及位置，設(shè)置寬、高均為170，X為190，Y為115?！皩傩浴泵姘逶O(shè)置如圖2-23所示。

(3) 繼續(xù)選擇“橢圓工具”，在屬性面板中設(shè)置筆觸顏色為“無”，填充色為“#9082B7”，按住【Shift】鍵，在剛繪制的圓的旁邊繪制一個小圓，設(shè)置大小及位置：寬、高均為130，X為210，Y為135，效果如圖2-24所示。

小提示：

選中，即選中“對象繪制模式”，繪制出的圖形是一個整體，多個圖形疊加時互不影響；取消選中，即選中“合并繪制模式”，在該模式下繪制圖形是分散的，兩個圖形之間如果有重疊，后繪制的圖形會覆蓋先繪制的圖形，此時移動后繪制的圖形會改變先繪制的圖形，如果顏色相同，則先后繪制的圖形會融為一個圖形。

圖2-23　“屬性”設(shè)置

圖2-24　效果1

3. 繪制鬧鐘臉部

(1) 選擇“橢圓工具”，在“屬性”面板中設(shè)置筆觸顏色為“#000000”，填充色為“#AADBC6”，筆觸高度為1，在舞臺空白處按住【Shift】鍵繪制一個小圓，并設(shè)置大小及位置，設(shè)置寬、高均為110，X為220，Y為145，效果如圖2-25所示。

(2) 繼續(xù)選擇“橢圓工具”，在屬性面板中設(shè)置筆觸顏色為“#000000”，填充色為“#0684CE”，筆觸高度為1，按住【Shift】鍵在舞臺空白處繪制一個小圓，并在“屬性”面板中調(diào)整圓的大小，寬、高均為22，效果如圖2-26所示。

小提示：

設(shè)置矩形高、寬時請看清楚、這兩個圖標(biāo)，表示按比例設(shè)置，表示分別設(shè)置。

圖2-25　效果2

圖2-26　效果3

(3) 繼續(xù)選擇“橢圓工具”，設(shè)置屬性：筆觸顏色為“無”，填充顏色為“#000000”，繪制一個小橢圓形，寬為10，高為15，效果如圖2-27所示。將該橢圓拖到小圓內(nèi)部，效果如圖2-28所示。

想一想：

這里繪制的小圓、小橢圓均用對象供給制模式，想一想為什么？

圖2-27　效果5

圖2-28　效果6

(4) 用同樣的方法再繪制一個筆觸顏色為“無”、填充色為“白色”的小橢圓，并設(shè)置寬、高分別為3、7，并放置到黑色橢圓內(nèi)部，然后繪制一個更小的白色圓形放到白色小橢圓的旁邊，這樣就繪制好一只眼睛，效果如圖2-29所示。

(5) 選擇“選擇工具”，在“眼睛”周圍拉一個“矩形”，選中整個“眼睛”，此時四個部分處于被選中狀態(tài)，如圖2-30(a)所示，單擊菜單“修改”→“組合”命令(或按組合鍵【Ctrl+G】)，組合后如圖2-30(b)所示。

小經(jīng)驗：

這種選擇多個對象的方法可以形象地稱為“框選”，框選對于選擇相鄰的多個對象很方便，也可以按住【Shift】鍵依次單擊要選擇的各個對象來同時選擇多個對象。

圖2-29　效果7

圖2-30　眼睛效果

(6) 選中“眼睛”，按組合鍵【Ctrl+C】進行復(fù)制，再按組合鍵【Ctrl+ V】進行粘貼，這樣就有了另一只眼睛。將復(fù)制出的“眼睛”選中，單擊菜單欄中的“修改”→“變形”→“水平翻轉(zhuǎn)”命令，再將兩只眼睛分別放置在X為245、285，Y為170、170的位置，如圖2-31所示。

(7) 選擇“直線工具”，在工具箱下方取消“對象繪制模式”，用“合并繪制模式”，右邊屬性欄就用默認(rèn)值，在舞臺上畫一條直線，使用“選擇工具”將直線修改為曲線，并按組合鍵【Ctrl+C】組合，然后拖動到鬧鐘臉部，作為鬧鐘精靈的嘴，如圖2-32所示。

小經(jīng)驗：

只有在“合并繪制模式”下繪制的圓才能用直線將其一分為二，注意直線也只能是“合并繪制模式”下繪制的直線，如果是“對象繪制”模式下繪制的圖形，將其“打散”后也可以進行同樣的操作。

圖2-31　效果8

圖2-32　效果9

4. 繪制鬧鐘耳朵

(1) 選擇“矩形工具”，在“屬性”面板中設(shè)置筆觸顏色為“無”，填充色為“#482D7A”，在鬧鐘臉的旁邊繪制一個矩形，寬為36，高為7。選中該矩形，單擊“變形”按鈕，打開“變形”面板，設(shè)置旋轉(zhuǎn)角度為－25°，傾斜為－20°。面板設(shè)置如圖2-33所示，舞臺效果如圖2-34所示。

圖2-33　變形設(shè)置

圖2-34　舞臺效果

(2) 選擇“橢圓工具”，在“屬性面板”中設(shè)置筆觸顏色為“無”，填充顏色為“#F26C00”，按住【Shift】鍵在舞臺上繪制一個小圓形，然后選擇該圓，設(shè)置寬、高均為50，然后選擇“直線工具”，設(shè)置筆觸高度為2，在剛才繪制的圓形上畫一條直線，效果如圖2-35所示。

(3) 選擇“選擇工具”，在右半圓上單擊，選中右邊的半圓，將其拖到“矩形”旁邊，然后在半圓上再畫兩個白色的小橢圓，這樣就繪制好一只耳朵了。將余下的半圓和直線刪掉，效果如圖2-36所示。

圖2-35　繪制圓和直線

圖2-36　調(diào)整半圓位置

(4) 選擇“選擇工具”，將鬧鐘的一只耳朵全部選中，按組合鍵【Ctrl+G】將其組合。選擇這個組合，按組合鍵【Ctrl+D】，直接復(fù)制得到另外一個，此時復(fù)制的一只耳朵處于選中狀態(tài)，單擊菜單“修改”→“變形”→“水平翻轉(zhuǎn)”命令，然后調(diào)整兩只耳朵的位置，效果如圖2-37所示。

圖2-37　繪制耳朵

5. 繪制精靈棒

(1) 選擇“基本矩形工具”，設(shè)置屬性筆觸顏色為“#999999”，填充色為“#FFFF00，筆觸高度為2，邊角半徑為10，在鬧鐘旁邊繪制一個矩形，設(shè)置“屬性”寬為140，高為12。選中矩形，打開“變形面板”，設(shè)置旋轉(zhuǎn)角度為－40°，如圖2-38所示。

圖2-38　繪制圓角矩形

想一想：

請你比較一下“矩形工具”與“基本矩形工具”的區(qū)別。

(2) 選擇“多邊形工具”，在“屬性”面板中單擊“選項”按鈕，打開“工具設(shè)置”對話框，設(shè)置樣式為“星形”，邊數(shù)為5。對話框參數(shù)設(shè)置如圖2-39所示。然后在舞臺上繪制一個星形并放到矩形的右上方，筆觸顏色與填充顏色系統(tǒng)自動繼承繪制圓角矩形時的設(shè)置。

(3) 選擇“選擇工具”，單擊“圓角矩形”命令，然后按住【Shift】鍵，再單擊“星形”，這樣就將圓角矩形與星形全部選中，單擊菜單“修改”→“組合”命令，將其組合成一個整合。然后移動到如圖2-40所示的位置。

圖2-39　設(shè)置屬性

圖2-40　繪制“精靈”

6. 繪制鬧鐘手臂

(1) 選擇“橢圓工具”，在“屬性”面板中設(shè)置筆觸顏色為“#BBAFD3”，筆觸高度為6，按住【Shift】鍵，在舞臺上繪制一個正圓。

(2) 選擇“選擇工具”，單擊該圓，單擊菜單“編輯”→“直接復(fù)制”命令，得到另一個圓，然后調(diào)整兩個圓的位置，效果如圖2-41所示。

圖2-41　效果圖

試一試：

選中該圓，按組合鍵【Ctrl+D】看看是什么效果。

我收獲

我留言

我練習(xí)

(1) 使用Flash CS5繪圖工具，繪制如圖2-42所示的效果圖。

(2) 使用Flash CS5繪圖工具，繪制如圖2-43所示的效果圖。

圖2-42　微笑的臉

圖2-43　QQ表情

任務(wù)三　繪制“卡通小汽車”

我明了

在本任務(wù)中，我們一起繪制一個很可愛的“卡通小汽車”圖案，進一步熟悉圖層的操作，鞏固“鋼筆工具”的使用，熟悉顏料、墨水瓶、刷子等工具的使用。

我掌握

掌握顏料桶、墨水瓶、刷子等工具的屬性設(shè)置及使用方法，學(xué)會將繪制的圖形轉(zhuǎn)換為元件，從而可進行反復(fù)調(diào)用。

我準(zhǔn)備

“顏料桶工具”的作用是用顏色填充封閉或不完全封閉區(qū)域，選定“顏料桶工具”后，可以在工具箱面板中設(shè)置“空隙大小”選項。

不自動封閉所選區(qū)域的間隙，所以無法填充未封閉的區(qū)域。

自動封閉所選區(qū)域的小間隙，然后填充顏色。

自動封閉所選區(qū)域的中等間隙，然后填充顏色。

自動封閉所選區(qū)域的大間隙，然后填充顏色。

我動手

1. 繪制車體

(1) 啟動Flash CS5，按組合鍵【Ctrl+N】，打開“新建文檔”對話框，選擇“Flash文件(ActionScript 3.0)”選項，新建一個空白文檔，按組合鍵【Ctrl+J】修改文檔屬性，設(shè)置尺寸為“600像素×400像素”，背景色為白色。

(2) 選擇“鋼筆工具”，設(shè)置筆觸顏色為“#000000”(黑色)，筆觸高度設(shè)置為2，在舞臺中央繪制小汽車車體部分，并將“圖層1”名稱更改為“車體”，效果如圖2-44所示。

(3) 選擇“選擇工具”，將光標(biāo)移到上一步繪制的小汽車外形上，當(dāng)光標(biāo)變成形狀時，調(diào)整線條的弧度，調(diào)整完成后效果如圖2-45所示。

小提示：

右擊圖層名，進入“屬性”設(shè)置，可以給圖層重命名、設(shè)置圖層的類型?；蛑恍杞o圖層重命名，雙擊圖層名即可。

圖2-44　繪制車體

圖2-45　調(diào)整車體弧度

小經(jīng)驗：

在Flash操作中，時時注意光標(biāo)的形狀提示可以提高效率。

(4) 選擇“顏料桶工具”(快捷鍵為【K】)，在屬性面板中設(shè)置填充色為“FF3300”，將顏料桶移到車身上單擊，車身就變成“橙色”，如圖2-46所示。

圖2-46　給車身上色

2. 繪制車窗

(1) 單擊“插入圖層”按鈕，新建圖層2，并將其重命名為“車窗”，選擇“鋼筆工具”，按照上述方法在“車窗”圖層中繪制小汽車的四個車窗部分，效果如圖2-47所示。

圖2-47　繪制車窗

(2) 選擇“顏料桶工具”，在屬性面板設(shè)置填充色為“線性漸變”，第一個色塊顏色為“#FFFFFF”(白色)，第二個色塊顏色為“#00CCFF”(淺藍色)，屬性面板設(shè)置如圖2-48所示。然后在第二個車窗上單擊，給車窗安裝“玻璃”，同樣在其他三個車窗上單擊，安上“玻璃”，效果如圖2-49所示。

圖2-48　設(shè)置屬性

圖2-49　給車窗安裝“玻璃”

小提示：

設(shè)置線性漸變時，在下面的顏色條空白處單擊，可以增加顏色，還可以拖動按鈕改變漸變效果。

(3) 按住“任意變形工具”不動，然后選擇“漸變變形工具”，對四個“車窗”窗體部分的漸變色、方向、位置和范圍進行調(diào)整。效果如圖2-50所示。

試一試：

拖動“旋轉(zhuǎn)調(diào)整漸變色方向手柄”和“范圍調(diào)整手柄”，試一試。

圖2-50　調(diào)整漸變效果

3. 繪制車輪

(1) 單擊“插入圖層”按鈕，新建一個圖層，將圖層命名為“車輪”，并鎖定“車體”、“車窗”圖層，時間軸效果如圖2-51所示。

圖2-51　添加圖層

(2) 選擇“基本橢圓工具”，設(shè)置筆觸顏色為“#575757”(灰色)，填充色為“#333333”(深灰色)，筆觸高度為2，移動光標(biāo)到靠近車體下方，按住【Shift】鍵，繪制一個圓(見圖2-52)，然后選擇“選擇工具”，將光標(biāo)移到圓形的中心，拖動圓環(huán)的中心點形成合適內(nèi)徑的圓環(huán)，如圖2-53所示。

圖2-52　畫車輪

圖2-53　調(diào)整車輪內(nèi)徑

想一想：

“基本橢圓工具”與“橢圓工具”有什么不同？“橢圓工具”能完成的任務(wù)“基本橢圓工具”能完成嗎？

小經(jīng)驗：

移動車輪時，按鍵盤上的方向鍵可以進行微調(diào)。

(3) 右擊“車窗”圖層，選擇“插入圖層”選項，這樣就在“車窗”圖層和“車輪”圖層之間新建了一個圖層，并將其命名為“輪床”。再次選擇“鋼筆工具”，繪制用于放置車輪的“輪床”部件，然后填充為黑色，效果如圖2-54所示。

(4) 新建一個“車圈”圖層，選擇“橢圓工具”，設(shè)置筆觸顏色為無，填充色為“#339999”(灰藍色)，按住【Shift】鍵，在車輪圓環(huán)中心處繪制一個圓，使小汽車看上去更生動，效果如圖2-55所示。

圖2-54　繪制輪床

圖2-55　繪制車圈

(5) 分別復(fù)制“車輪”、“輪床”、“車圈”圖層中的圖形，按組合鍵【Ctrl+V】粘貼，然后移動到另一個車輪位置，如圖2-56所示。

圖2-56　制作另一個車輪

4. 繪制其他部件

(1) 新建“其他部件”圖層，選擇“基本矩形工具”，設(shè)置筆觸顏色為“000000”(黑色)，筆觸高度為2，填充色為“CCCCCC”(淺灰色)，在車尾位置繪制一個小矩形(小汽車后保險杠)，如圖2-57所示。

(2) 選擇“選擇工具”，將光標(biāo)移到矩形的任意一個節(jié)點上，按住鼠標(biāo)左鍵，調(diào)整矩形為“圓角矩形”，然后用“任意變形工具”調(diào)整圓角矩形的大小、位置，完成后保險杠的繪制，如圖2-58所示。

圖2-57　繪制矩形

圖2-58　調(diào)整圓角矩形

小提示：

拖動用“基本矩形工具”繪制的矩形四周的節(jié)點，可以調(diào)整矩形，如果需精確調(diào)整，還得在“屬性”面板中輸入角度。

(3) 按照上述辦法完成車身其他零部件的繪制，也可根據(jù)個人愛好進行添加，達到小汽車看上去更加生動形象的目的，完成后效果如圖2-59所示。

圖2-59　完成效果

5. 轉(zhuǎn)換為“元件”

(1) 選擇“選擇工具”，將所有圖層解鎖，在舞臺中央拖動光標(biāo)，繪制一個大矩形，確保將小汽車全部選中，如圖2-60所示。

圖2-60　“框選”全部

小經(jīng)驗：

框選所有對象后，右擊，在彈出的快捷菜單中選擇“轉(zhuǎn)換為元件”選項會更快捷。

(2) 單擊菜單“修改”→“轉(zhuǎn)換為元件”命令，打開“轉(zhuǎn)換為元件”對話框，設(shè)置名稱為“小汽車”，類型為“圖形”，如圖2-61所示。單擊“確定”按鈕，將繪制的小汽車轉(zhuǎn)換為一個圖形元件。按組合鍵【Ctrl+L】，打開“庫”面板，查看元件，便可以在“庫”中看到“小汽車”這個元件，以后在制作動畫時就可以反復(fù)使用了，如圖2-62所示。

小提示：

元件庫中的元件可以反復(fù)拖到舞臺創(chuàng)建一個“實例”，每個實例還可以設(shè)置固有的其他屬性。

圖2-61　“轉(zhuǎn)換為元件”對話框

圖2-62　查看元件

我收獲

我留言

我練習(xí)

(1) 打開配套作業(yè)，如圖2-63所示。用“顏料桶工具”給圖中人物各部分著色。

(2) 繪制如圖2-64所示的卡通飛機效果圖。

圖2-63　為小丑著色

圖2-64　卡通飛機

任務(wù)四　繪制“咖啡廳招牌”

我明了

在本任務(wù)之前已對Flash CS5的各種繪圖工具作了些介紹，下面將介紹Flash CS5新增功能“裝飾性繪畫工具”，進行實例制作。本任務(wù)主要通過 Flash CS5中的“Deco工具”提供的許多刷子，繪制“咖啡廳招牌”。

我掌握

本任務(wù)要求進一步鞏固“鋼筆工具”、“橢圓工具”、“顏料桶工具”等工具的使用，掌握“Deco工具”的使用。

我準(zhǔn)備

“Deco工具”是裝飾性繪畫工具，它可以將“庫”面板中的任意影片剪輯，或?qū)D形元件作為圖案進行復(fù)雜繪圖或制作動畫效果。在工具箱中選擇“Deco工具”后，可以在右邊屬性欄內(nèi)選擇“繪制效果”。

藤蔓式填充：可以模仿藤蔓生長的方式在舞臺、元件或封閉區(qū)域中填充圖案。

網(wǎng)格填充：可以以元件填充設(shè)計區(qū)、元件或封閉區(qū)域，將網(wǎng)格填充繪制到設(shè)計區(qū)中，如果移動填充元件或調(diào)整大小，則網(wǎng)格填充將隨之移動或調(diào)整大小。

對稱刷子：可以圍繞中心點對稱排列元件，在設(shè)計區(qū)繪制元件時，將顯示一組手柄，使用手柄可以增加、添加對稱內(nèi)容或者修改效果。

裝飾性刷子：可以通過應(yīng)用“裝飾性刷子”效果，繪制出多種裝飾線。

粒子系統(tǒng)：可以創(chuàng)建火、煙、水、氣泡及其他效果的粒子動畫。

樹刷子：可以快速創(chuàng)建樹狀插圖，在“高級選項”下拉列表中還可以選擇多種樹的效果。

建筑刷子：可以快速繪制各種樓房。

我動手

1. 新建文檔

運行 Flash CS5，選擇“ActionScript 3.0”選項，新建一個Flash文檔，并設(shè)置尺寸為“700像素×200像素”，其他屬性保持默認(rèn)參數(shù)。

2. 制作咖啡杯

(1) 將“圖層1”重命名為“咖啡杯”。選擇“橢圓工具”，將筆觸顏色設(shè)為“#666666”，填充顏色為“無”，選用“合并繪制模式”，在舞臺上繪制一個正圓，如圖2-65(a)所示?？蜻x上半圓并將其刪除，得到下半圓，如圖2-65(b)所示。

(2) 繼續(xù)使用“選擇工具”，框選半圓下面部分弧線，按鼠標(biāo)左鍵將其下移，如圖2-65(c)所示。然后選擇“線條工具”，繪制兩根直線，將底部輪廓連接起來，如圖2-65(d)所示。

圖2-65　繪制咖啡杯輪廓線

小經(jīng)驗：

繪制“杯口”時可以先鎖定“咖啡杯”圖層，然后新建一個圖層進行繪制，調(diào)整好“杯口”與“杯身”位置后，剪切繪制好的“杯口”，然后再將“咖啡杯”圖層解鎖，在該圖層中按組合鍵【Ctrl+Shift+V】進行原位置粘貼。這樣就不會因繪制杯口而影響已繪好的杯身。

(3) 選擇“橢圓工具”，筆觸顏色設(shè)為“#CCCCCC”，填充色為“無”，在杯身上方繪制一個大橢圓作為杯口輪廓，如圖2-66所示。

(4) 選擇“顏料桶工具”，按組合鍵【Shift+F9】，打開“顏色設(shè)置”面板，將顏色類型設(shè)為“徑向漸變”，填充顏色設(shè)為由“#FFFFFF”至“#666666”的漸變，然后對杯身部分進行填充，效果如圖2-67所示。

圖2-66　繪制杯口

圖2-67　填充杯身

(5) 選擇“漸變變形工具”，單擊上一步填充的顏色，出現(xiàn)漸變變形控制圓，將光標(biāo)指向中心，調(diào)整漸變中心的位置到杯身左上側(cè)，然后將光標(biāo)移到，調(diào)整漸變范圍大小，如圖2-68所示。

圖2-68　調(diào)整漸變中心及漸變范圍

小提示：

移動光標(biāo)，當(dāng)光標(biāo)變成向四個方向的箭頭時才能移動“高光點”。

(6) 繼續(xù)選擇“顏料桶工具”，對杯口進行填充，并按上述辦法進行漸變調(diào)整，縮小漸變范圍并將“高光點”(漸變中心)移到杯口右側(cè)，效果如圖2-69所示。

圖2-69　填充杯口

(7) 選擇“選擇工具”，選取杯口上沿的半圓弧，按組合鍵【Ctrl+C】對其進行復(fù)制，再按組合鍵【Ctrl+V】進行粘貼，選擇“橡皮擦工具”，將復(fù)制得到的圓弧兩邊擦去一些，再將其移到咖啡杯內(nèi)部，如圖2-70所示。

(8) 選擇“顏料桶工具”，打開“顏色面板”，設(shè)置顏色類型為“徑向漸變”，填充顏色設(shè)為由“#993300”(咖啡色)至“#602D1E”(深咖啡色)的漸變，然后對杯身內(nèi)部進行填充，再刪除杯身部分輪廓線，完成杯身制作，如圖2-71所示。

圖2-70　繪制半橢圓

圖2-71　完成杯身

(9) 選擇“鋼筆工具”，繪制如圖2-72所示的封閉曲線作為把手，然后選擇“顏料桶工具”，設(shè)置“線性漸變”，填充色設(shè)為由“#333333”至“#CFCFCF”，再至“#666666”的漸變色，如圖2-73所示。然后對把手進行填充，再選擇“漸變變形工具”對漸變色進行適當(dāng)調(diào)整，達到最佳效果，如圖2-74所示。

圖2-72　繪制把手

圖2-73　設(shè)置線性漸變

圖2-74　填充把手

小經(jīng)驗：

用“合并繪制模式”繪制的圖形，完成調(diào)整后對其進行組合，以免與其他“合并繪制模式”繪制的圖形相互影響。

(10) 選擇“選擇工具”，雙擊把手邊線，按【Delete】鍵將邊線刪除，再按組合鍵【Ctrl+G】組合，將其放置到杯身右側(cè)恰當(dāng)位置，完成杯身制作，如圖2-75所示。

圖2-75　完成后的杯體效果

3. 繪制碟子

(1) 新建“托盤”圖層，并將其拉到“咖啡杯”圖層下方。單擊“咖啡杯”圖層前面的小正方形，讓咖啡杯只顯示輪廓線，便于碟子的繪制。時間軸如圖2-76所示。

(2) 采用繪制“杯身”的方法繪制碟子，如圖2-77所示。

圖2-76　新“托盤”層

圖2-77　繪制碟子

小提示：

圖層就如一張張透明的紙，不同圖層繪制的圖形中，上層的圖形會遮住下層的圖形。根據(jù)需要，可以拖動圖層而改變圖層的位置，達到理想效果。

(3) 將“碟子”組合，調(diào)整到杯體下合適的位置，如圖2-78所示。

(4) 新建“影子”圖層，將其拉到“托盤”圖層下方，在碟子下面繪制一個黑色無邊線的橢圓。鎖定三個圖層，并取消“咖啡杯”圖層的輪廓顯示，效果如圖2-79所示。

圖2-78　調(diào)整碟子位置

圖2-79　完成效果

4. 制作圖案和裝飾

(1) 按組合鍵【Ctrl+F8】打開“新建元件”對話框，設(shè)置名稱為“直線”，類型為“圖形”的元件，單擊“確定”按鈕，進入元件編輯模式。選擇“線條工具”，在“屬性”面板中設(shè)置筆觸顏色為“#996600”，樣式為“極細(xì)線”，設(shè)置面板如圖2-80所示。按住【Shift】鍵，繪制一條垂直的直線，再選中這條直線，在“屬性”面板中設(shè)置寬度為1，高度為25。按組合鍵【Ctrl+K】打開“對齊”面板，選中“與舞臺對齊”，然后單擊“水平對齊”、“頂對齊”按鈕，效果如圖2-81所示。

圖2-80　屬性設(shè)置

圖2-81　元件效果

小提示：

勾選“與舞臺對齊”后，所選中的對象會相對于舞臺進行各自對齊。

(3) 在舞臺上單擊，放置元件，并按住鼠標(biāo)左鍵，在綠色輔助線周圍移動它，直到得到想要的放射狀圖案為止，效果如圖2-83所示。

圖2-82　“對稱刷子”屬性

圖2-83　繪制放射圖案

小提示：

用“Deco工具”繪制的圖案是一個組，其中包含了許多個相關(guān)的元件。

(4) 選擇“橢圓工具”，設(shè)置筆觸顏色為“#996600”，填充色為“無”，筆觸樣式為“極細(xì)線”。在舞臺上繪制一個正圓，然后同時選擇“放射狀”、“圓”，打開“對齊”面板，進行相對舞臺水平、垂直居中設(shè)置，如圖2-84所示。

圖2-84　繪制氣泡

圖2-85　調(diào)整氣泡

(5) 按組合鍵【Ctrl+G】將其組合，復(fù)制并粘貼這個組，在咖啡杯上方產(chǎn)生多個氣泡，使用“任意變形工具”把氣泡縮放成不同的大小，如圖2-85所示。

(6) 選擇“Deco工具”，在“屬性”面板中選擇“裝飾性刷子”選項。在“高級選項”中選擇“虛線”選項，圖案顏色設(shè)置為“#996600”，面板設(shè)置如圖2-86所示。在舞臺上方繪制幾條曲線，效果如圖2-87所示。

圖2-86　設(shè)置屬性

圖2-87　繪制“熱氣”

小提示：

在“屬性”面板中還可以對花的類型、顏色等進行設(shè)置。

(7) 選擇“Deco工具”，在“屬性”面板中選擇“花刷子”選項，在“高級選項”中選擇“園林花”選項，勾選“分支”復(fù)選框，并保留顏色和大小默認(rèn)值，面板設(shè)置如圖2-88所示，在舞臺下方繪制花枝，效果如圖2-89所示。

圖2-88　設(shè)置“花刷子”屬性

圖2-89　繪制花枝效果

5. 制作背景曲線

(1) 新建“波浪1”圖層，鎖定其他圖層。選擇“鋼筆工具”，設(shè)置筆觸顏色為“#996600”，繪制一個如圖2-90所示效果的封閉曲線(效果圖隱藏了其他圖層)。

圖2-90　繪制波浪1輪廓

小提示：

單擊圖層前面的與眼睛、鎖對應(yīng)的圓點，可以隱藏(顯示)、鎖定(解鎖)該圖層。

小經(jīng)驗：

“水龍頭”可以直接刪除連線，與選中連線然后刪除的效果相同。

(2) 選擇“顏料桶工具”，將填充色設(shè)置為“#996633”，在剛才繪制的輪廓內(nèi)單擊進行填充，再選擇“橡皮擦工具”，在下面“選項”中選擇“水龍頭”選項，在輪廓線上單擊，將輪廓線刪除，按組合鍵【Ctrl+G】將其組合，再將圖層“波浪1”拖至最底層。

(3) 選擇“波浪1”圖層中的圖形，將其進行復(fù)制。在“波浪1”圖層上方插入“波浪2”圖層，然后在“波浪2”圖層上按組合鍵【Ctrl+Shift+V】粘貼到原位置，按向左、向上方向鍵，使浪峰有點偏移。打開“顏色”面板，將其Alpha值設(shè)置為50%，效果如圖2-91所示?！皶r間軸”效果如圖2-92所示。

圖2-91　繪制波浪后效果圖

圖2-92　“時間軸”效果

小經(jīng)驗：

涉及多個圖層時，每編輯好一個圖層后要將其鎖定，以免因誤操作而相互影響。

6. 創(chuàng)建文本

(1) 選擇最上面的圖層，單擊“新建圖層”按鈕，插入一個新圖層，重命名為“文本”。

(2) 選擇“文本工具”，在“屬性”面板中選擇“傳統(tǒng)文本”選項，并選擇“靜態(tài)文本”選項，在“字符”選項下面，選擇合適的字體，樣式為“正?！保笮?8點，顏色為“#990000”，“屬性”設(shè)置如圖2-93所示。在舞臺上單擊并輸入文本“咖啡情緣”，并將文檔背景色改為“#CC9966”。最終“時間軸”如圖2-94所示，最終作品如圖2-95所示。

圖2-93　文本屬性

圖2-94　“時間軸”效果

圖2-95　最終作品

我收獲

我留言

我練習(xí)

使用Deco裝飾性繪畫工具繪制“城市風(fēng)景”效果，如圖2-96所示。

圖2-96　城市風(fēng)景

任務(wù)五　美化“職教中心辦公樓”

我明了

在本任務(wù)中，我們看到一幅職教中心辦公樓的圖片上懸掛著一個“橫幅”，但是由于拍攝原因根本看不清是什么內(nèi)容，放大后隱隱約約看到幾個字。我們將重新制作這個橫幅，讓字變得更清晰，同時對這張圖片進行其他方面的美化。

我掌握

掌握Flash CS5外部圖片的導(dǎo)入方法，學(xué)會對導(dǎo)入素材的“打散”等操作；掌握對外部導(dǎo)入素材的編輯方法。

我準(zhǔn)備

Flash CS5允許導(dǎo)入外部位圖或矢量圖作為特殊元素，具體步驟如下。

(1) 單擊菜單“文件”→“導(dǎo)入”→“導(dǎo)入到舞臺”命令，彈出“導(dǎo)入”對話框。

(2) 在“導(dǎo)入”對話框的“查找范圍”列表框中選擇所需導(dǎo)入外部圖像的路徑，然后選擇需導(dǎo)入的文件。

(3) 單擊“打開”按鈕，所選擇的圖像就導(dǎo)入到舞臺中。

導(dǎo)入其他格式的圖像及聲音的方法與此相同。

我動手

1. 新建文檔

運行 Flash CS5，單擊“ActionScript 3.0”命令，新建一個Flash文檔，并設(shè)置尺寸為“800像素×600像素”，其他屬性保持默認(rèn)參數(shù)。

2. 導(dǎo)入素材

(1) 單擊菜單“文件”→“導(dǎo)入”→“導(dǎo)入到舞臺”命令，彈出“導(dǎo)入”對話框，打開“素材/項目2”中的圖1，出現(xiàn)如圖2-97所示的對話框，單擊“否”按鈕。一張職教中心辦公樓的圖片就導(dǎo)入到舞臺上了。

圖2-97　導(dǎo)入對話框

小經(jīng)驗：

如果導(dǎo)入文件所在文件夾有多張命名有規(guī)律的圖片，就會出現(xiàn)圖2-97所示的對話框，如果選擇“是”，則相應(yīng)圖片全部導(dǎo)入，并分別依次放到不同的幀中。

(2) 選擇導(dǎo)入的圖片，單擊右邊屬性面板中“位置和大小”下面的圖標(biāo)(鎖定比例)，使之變成圖標(biāo)(解除鎖定)，然后設(shè)置寬為800，高為600，X、Y坐標(biāo)均為0。屬性面板如圖2-98所示。

圖2-98　位圖屬性

3. 編輯圖片

(1) 單擊“編輯欄”右邊的舞臺比例窗口，在此框中輸入“70%”。

(2) 再次選擇舞臺上的圖片，舞臺效果如圖2-99所示，單擊菜單“修改”→“分離”命令，舞臺效果如圖2-100所示。

圖2-99　圖片“分離”前

圖2-100　圖片“分離”后

小提示：

根據(jù)編輯的需要，適當(dāng)放大舞臺顯示比例，可以更好地進行編輯。

(3) 重命名“圖層1”為“原圖”，在“原圖”圖層上方插入新圖層，命名為“橫幅”。鎖定“原圖”圖層。

(4) 將舞臺顯示比例調(diào)整為“400%”，選擇“手形工具”，拖動舞臺上的圖片，調(diào)出“橫幅”所在位置。選擇“鋼筆工具”，在“橫幅”層繪制橫幅輪廓線，如圖2-101所示。

圖2-101　繪制橫幅輪廓線

小提示：

使用“鋼筆工具”繪制橫幅輪廓線而不用“矩形工具”，可以讓效果更逼真。

(5) 選擇“顏料桶工具”，設(shè)置填充色為“#FF3300”，然后進行填充，雙擊輪廓線，按【Delete】鍵將其刪除，效果如圖2-102所示。

圖2-102　填充刪除輪廓線

小經(jīng)驗：

不同的內(nèi)容放到不同的層中，可以避免“誤操作”，還可以方便以后的進一步編輯。

(6) 在最上面新建“文字”圖層，鎖定其他圖層。選擇“文本工具”，設(shè)置大小為9點，顏色為白色，字體為黑體。在文字圖層輸入“相信科學(xué) 反對邪教 提高素質(zhì) 促進和諧”，并調(diào)整位置，使之與紅色橫幅相匹配，效果如圖2-103所示。

圖2-103　輸入文字

(7) 選擇“任意變形工具”，將文字進行適當(dāng)旋轉(zhuǎn)，使之與橫幅協(xié)調(diào)，效果如圖2-104所示。

圖2-104　調(diào)整文字

(8) 解鎖“原圖”圖層，同時鎖定其余圖層，選擇“手形工具”，將圖片拉到圖片左邊四樓人像處，如圖2-105所示。再選擇“套索工具”，在下面的選項中選擇“多邊形模式”，在“人像”旁邊依次單擊，在形成一個方形時雙擊，則選擇出一塊墻體，如圖2-106所示。按下組合鍵【Ctrl+D】直接復(fù)制，然后調(diào)整到“人像”處，將其覆蓋，效果如圖2-107所示。

圖2-105　圖片四樓人像

小經(jīng)驗：

調(diào)整復(fù)制出的“墻體”時，按光標(biāo)鍵可以更精確地移動。

圖2-106　選擇要復(fù)制的墻體

圖2-107　覆蓋“人像”

(9) 將舞臺顯示比例調(diào)整為100%，效果如圖2-108所示。

圖2-108　最終效果

我收獲

我留言

我練習(xí)

利用Flash CS5去掉圖2-109中的“暢游網(wǎng)”標(biāo)志，然后在圖片上方添加“三峽我的家”五個字。

圖2-109　三峽我的家