FLASH制作第1篇

1、第1篇 入門篇1、Flash簡介： Flash CS3 是Macromedia公司推出的一種交互式矢量多媒體制作工具，一般用來制作動畫或特效頁面，在網(wǎng)絡(luò)動畫、網(wǎng)頁特效、娛樂、教學領(lǐng)域有廣泛的應(yīng)用，支持動畫、聲音以及交互，具有強大的多媒體編輯功能，它是當今應(yīng)用范圍最廣的矢量動畫創(chuàng)作軟件。與Macromedia公司的Dreamweaver、Fireworks結(jié)合稱為網(wǎng)頁三劍客。2、矢量圖與位圖的區(qū)別： 矢量圖：通過矢量數(shù)據(jù)計算而形成，圖形文件的大小與圖形的復(fù)雜程度有關(guān)，與大小無關(guān)，能夠進行無限制放大并不影響顯示效果。但是很難做出非常復(fù)雜的圖形。Flash制作的圖形為矢量圖。位圖：通過點陣信息組合而

2、成，圖形文件的大小與圖形的實際大小有關(guān)，能夠作出比較復(fù)雜的圖形。但是不能夠進行無限制縮放。PHOTOSHOP制作的圖形為位圖。（把“繪制矢量風景”與導入圖片進行比較）練習1：進入Flash世界【教學目的】 掌握Flash的啟動、新建普通動畫文件、新建模板文件?！窘虒W內(nèi)容】1、啟動Flash：點擊“開始>所有程序> Adobe Flash CS3 Professional”或桌面的快捷圖標即可啟動。2、新建普通動畫文件：方法1：啟動Flash之后，在出現(xiàn)的界面中點擊“Flash文件(ActionScript 3.0)”。方法2：點擊“文件>新建”，在“常規(guī)”選項卡中選擇“Fla

3、sh文件(ActionScript 3.0)”。新建文件之后白色的地方為舞臺制作動畫的地方。3、新建模板文件模板：已經(jīng)設(shè)計好的動畫格式，添加內(nèi)容即可成為動畫。點擊“文件>新建”，點擊“模板”選項卡，選擇對應(yīng)的模板，再點擊“確定”即可。例如：新建一個“照片幻燈片放映”的模板。練習2：設(shè)置文檔屬性【教學目的】 掌握設(shè)置Flash文檔的大小、背景以及幀頻。【教學內(nèi)容】任何一個Flash作品在開始制作前，都要根據(jù)展示效果設(shè)置好文檔的屬性。如果等到把動畫設(shè)置好之后再設(shè)置屬性的話，那么會使得動畫的更改很麻煩。場景大小是指動畫播放是舞臺的大小。大的文件一般能夠擺放比較多和比較大的對象，但是最大化后放大

4、沒有什么變化。小的文件與之相反。無論是大的還是小的文檔，都能夠擺放同樣多的東西，但是一般都是根據(jù)自己的內(nèi)容需要而設(shè)置他們的大小，而且他們的大小一般都符合屏幕顯示的比例。設(shè)置方法：點擊場景的空白處，然后點擊“修改>文檔”或按Ctrl+J或點擊“屬性”面板的大小按鈕，最后在彈出的窗口中設(shè)置即可。說明：幀頻指每秒鐘動畫播放的幀數(shù)。練習3：保存Flash文件【教學目的】 掌握Flash文件的保存、發(fā)布?！窘虒W內(nèi)容】1、保存點擊“文件>保存”或按Ctrl+S，輸入文件名及選擇保存路徑，最后點擊“保存”即可。2、發(fā)布保存之后的文件后綴名為fla，這是源文件，需要發(fā)布成swf格式才能預(yù)覽動畫。方

5、法為：點擊“控制>測試影片”或按 Ctrl+Enter鍵。說明：發(fā)布影片之后會在保存源文件的同一路徑下生成一個swf的生成文件，生成文件為動畫真是播放效果的文件。必須要保存后才能看得見生成文件。3、發(fā)布為其他格式：我們可以將我們制作的動畫導出為各種flash能夠?qū)С龅母袷剑苑奖阌^看或在其他軟件上進行另外的編輯。Flash能夠?qū)С龅母袷接泻芏嘀校渲形覀冎饕玫降母袷绞牵簊wf、gif、jpeg、png、exe、mov、avi。注意：.fla文件是flash的源文件。單擊“文件>發(fā)布設(shè)置”會彈出發(fā)布設(shè)置對話框，每種類型的具體情況而定。說明： a 在“發(fā)布設(shè)置”對話框中，除了“格式”

6、選項卡以外，其他選項卡都是在選中相應(yīng)的發(fā)布選項后才會出現(xiàn)的。b 應(yīng)先將文件保存后在發(fā)布，因為發(fā)布生成的文件與源文件在同一個文件夾中，且同名。如果想要制定發(fā)布的名稱和路徑，可以直接輸入名稱和路徑，也可點擊“選擇發(fā)布目標”按鈕選擇發(fā)布路徑和名稱。(1) Flash格式： 該格式是Flash發(fā)布默認的生成格式。(2) HTML格式： 該格式是發(fā)布之后，在網(wǎng)頁中嵌套Flash文件，使用不是很多，一般做把動畫做好之后，使用網(wǎng)頁制作工具來插入Flash文件。(3) GIF格式： 此格式可以生成Web頁面常用的GIF圖象動畫，但是刪除Flash動畫中的交互功能、聲音以及復(fù)雜效果。通常只有簡單的Flash動畫

7、才發(fā)布成GIF動畫。 需要選中“回放”中的“動畫”和“不斷循環(huán)”才能看到動畫。(4) JPEG格式： 將動畫的當前幀內(nèi)容發(fā)布成JPG靜態(tài)圖片。質(zhì)量不是很高。(5) PNG格式： 將動畫的第一幀內(nèi)容發(fā)布成PNG靜態(tài)圖片格式。該格式是唯一一種可跨平臺支持透明度的圖象格式，也是Fireworks的基本格式。(6) EXE格式： 發(fā)布的影片具有獨立的播放器，不需要Flash Player來播放。適合在沒有安裝Flash Player播放的場合。單擊“文件”>“導出”后的“導出影片”或“導出圖象”，同樣可以導出影片。我們要先選擇好要導出的類型，保存，然后再對這種格式進行適當?shù)脑O(shè)置?？傊瑢С鲇捌?/p>

8、格式要看我們的需要。導出之前的重要工作是制作動畫，所以制作出有創(chuàng)意的動畫才是最關(guān)鍵的 ?！揪毩?】新建文件1、啟動Flash，新建一個動畫文檔。點擊“修改>文檔”，在彈出的窗口中設(shè)置尺寸為800×600像素、背景顏色為#FF9900和幀頻為默認。2、選擇工具欄中的文本工具，在屬性面板中設(shè)置好對應(yīng)的字體、字號、顏色等。3、在場景中單擊，然后輸入“學高為師”這四個字。注意：a 輸入完之后如果位置不合適可以點擊選擇工具后對文本進行移動。b 如果大小、顏色等不對可以選中后在屬性面板中調(diào)整。c 使用完任何一個工具后最好都選擇“選擇工具”，否則很容易進行誤操作。4、繼續(xù)使用文本工具輸入“身

9、正為范”，放在“學高為師”的下面，并調(diào)整好大小和位置。5、按Ctrl+s保存文檔，名稱自定。然后點擊“控制>測試影片”或按 Ctrl+Enter 鍵發(fā)布影片查看效果。【練習2】讓文字動起來目的：掌握將對象轉(zhuǎn)換為元件的方法，熟悉運動動畫的制作方法，掌握插入關(guān)鍵幀的方法，了解時間軸的應(yīng)用。制作步驟： 1、在上例的基礎(chǔ)上，選擇場景中的2塊文字，點擊“修改>轉(zhuǎn)換為元件”，將它們轉(zhuǎn)換為名稱為“文字”的圖形元件。并將它移動到左上角3、在第24幀處擊右鍵選擇“插入關(guān)鍵幀”，然后將文字移動到場景的右上角。關(guān)鍵幀：具有自己獨立對象的畫面。4、選中時間軸的第一幀，擊右鍵選擇“創(chuàng)建補間動畫”，這時從第1

10、到24幀之間出現(xiàn)了一條從左到右的淡藍色箭頭，說明運動動畫已經(jīng)創(chuàng)建成功。運動動畫：指一個對象從一個位置到另外一個位置之間移動的動畫。注意：只有元件才能正常制作運動動畫，而且要求前后是同一個元件，前后的元件只是在位置、大小或顏色發(fā)生了變化。元件的特征：選中之后有一個中心圓圈，一般都是在對象的中心。5、按照前面的步驟，分別在第48、72、96幀插入關(guān)鍵幀，然后將文字對象移動到右下腳、左下腳和左上角。最后分別給24-48、48-72、72-96幀之間創(chuàng)建運動補間動畫。動畫制作完畢。【練習3】讓文字分開動目的：掌握圖層的使用方法，掌握對象在舞臺內(nèi)外的處理方法，熟悉如何將對象靜止在舞臺上，進一步熟悉運動動

11、畫的制作(同一幀頻下控制不同的速度)。制作步驟： 1、新建一個600×400像素的Flash文件。2、點擊時間軸左下腳的添加圖層按鈕 ，增加一個新的圖層。圖層：是一張透明的紙，上面的對象會覆蓋下面的對象，不同的運動對象、靜止與運動的對象必須要分開放在不同的圖層。3、用文本工具在圖層1寫上“學高為師”，圖層2寫上“身正為范”。然后分別將他們轉(zhuǎn)換為“文字1”和“文字2”的圖形元件。注意：必須要將2個對象分開在2個圖層，因為它們是2個互不相關(guān)聯(lián)的動畫。必須要轉(zhuǎn)換為元件，因為后面創(chuàng)建的是運動補間動畫。4、然后在圖層1和圖層2的24幀分別插入關(guān)鍵幀，然后在第1幀調(diào)整兩個對象分別在場景外的左上角

12、和右上角，在第24幀都把他們調(diào)整到場景中央并放好位置。說明：在場景之外的對象在播放動畫時是看不出來的，所以可以得到物體從外往里面移動的效果。5、給圖層1和圖層2的1-24幀之間創(chuàng)建運動補間動畫。6、在圖層1和圖層2的48、55幀處分別插入關(guān)鍵幀，然后在55幀處調(diào)整“文字1”和“文字”這2個對象分別在舞臺外的左邊和右邊。說明：48幀不要調(diào)整對象的位置，因為在24-48幀之間對象的位置沒有移動，所以這個過程中動畫的畫面是靜止的(但是依然要按照幀頻播放)。7、給圖層1和圖層2的48-55幀之間創(chuàng)建運動補間動畫。動畫制作完畢，按Ctrl+Enter預(yù)覽動畫。說明：整個動畫的幀頻是相同的，但是前面進入的

13、速度比飛出的速度慢，其原因是進入時需要24幀，而飛出時只需要8幀。所以幀越少，距離一定的情況下速度越快。練習4：創(chuàng)建簡單動畫【教學目的】 掌握Flash動畫的原理，導入圖片的方法，對齊面板的使用。【教學內(nèi)容】1、Flash動畫的原理在最前和最后的畫面中間添加很多過渡動畫，每兩個相鄰的畫面變化不大，所有的畫面組合起來連續(xù)播放就成為動畫。2、導入圖片由于我們在Flash中繪制的都是矢量圖，而矢量圖不能夠繪制得出很好的圖像。當我們需要一些照片或其他位圖圖像時，可以將其導入到Flash中來編輯。方法：點擊“文件>導入>導入到庫/導入到舞臺”，在彈出的導入窗口中選擇要導入的圖像文件，然后點擊

14、“打開”即可。注意：如果導入的文件在同一文件夾中有多個圖像文件，并且這些文件名是以數(shù)字結(jié)尾并連續(xù)的，會彈出導入圖像序列的對話框，選擇“是”表示把這一系列圖像導入，點擊“否”則只導入本張圖像。說明：導入到舞臺：將選中的圖像或圖像序列導入場景中。導入到庫：將選中的圖像導入到庫中。庫：用于存放元件、圖像、聲音、視頻等對象的地方。點擊“窗口>庫”打開庫面板即可察看庫中存放的內(nèi)容。3、對齊面板的使用作用：用于將選中的對象進行對齊。方法：點擊“窗口>對齊”打開對齊面板，然后選中單個或多個對象顯示如下效果的面板：【練習4】 按課本P8-9頁制作即可。練習5：導入分層圖像【教學目的】 掌握在Fla

15、sh中導入PSD文件的方法、圖層編輯的方法。【教學內(nèi)容】1、導入PSD文件的原因在前面導入圖片時，該圖片只是作為一個對象在一個圖層，如果編輯圖片中的某些動畫可能非常不方便；或者對于圖片修改某一局部刪除不方便。如果導入PSD文件，可以分層導入，那么就可以對其中的某些內(nèi)容進行取舍。2、導入PSD文件的方法點擊“文件>導入>導入到舞臺”，在彈出的導入窗口中選擇要導入的PSD文件，然后點擊“打開”。這時會顯示導入對話，做好設(shè)置之后點擊“確定”即可將PSD中的每層導入為Flash中的每層。說明：a 導入時最好設(shè)置將舞臺大小設(shè)置與PS畫布大小相同。b 在導入對話框中可以勾上或不勾上某些圖層進行

16、部分導入。c 可以在導入前點擊“編輯>首選參數(shù)”對PSD導入進行設(shè)置，含義看課本P11-12頁。一般最好設(shè)置文本為“可編輯文本”。3、圖層編輯：作用：能夠方便的編輯每個動畫。在時間軸左端顯示如下圖所示的圖層編輯窗口。說明：a 插入圖層、插入運動引導線、插入圖層文件夾可以在“插入>時間軸”菜單中完成。b 選擇好對應(yīng)的圖層拖到刪除按鈕上方釋放鼠標可以將選定的圖層刪除。c 選中對應(yīng)的圖層擊右鍵可以彈出相應(yīng)的菜單，擊右鍵選擇“屬性”可以設(shè)置對應(yīng)圖層相應(yīng)的屬性。d 將圖層拖到圖層文件夾上方可以將本圖層放在該文件夾中，也可以將圖層從圖層文件夾中往外面拖出來。單擊圖層文件夾時能夠?qū)D層文件夾展開

17、或折疊。【練習5】 按課本P10-12頁制作即可。練習6：快速制作播放器界面【教學目的】 了解庫、公用庫的含義，掌握庫、公用庫和任意變形工具的使用。【教學內(nèi)容】1、庫的含義及使用庫是存儲和組織在Flash中創(chuàng)建的各種元件的覅昂，它還用于存儲和組織導入的圖片、聲音等文件。打開庫面板的方法：點擊“窗口>庫”。在庫面板中可以進行新建元件、新建文件夾組織元件、刪除元件、元件排序等操作。2、公用庫的含義及使用公用庫就是存放系統(tǒng)提供的認為經(jīng)常用到的對象。打開公用庫的方法：點擊“窗口>公用庫”選擇對應(yīng)的內(nèi)容能夠打開對應(yīng)的公用庫面板，將對應(yīng)的內(nèi)容可以拖到Flash文件中使用，特別是“按鈕”這個公用

18、庫是常用的公用庫。注意：公用庫的內(nèi)容在公用庫中只能夠使用，只有拖到對應(yīng)的文檔中才能進行編輯，并會在對應(yīng)的文檔中增加對應(yīng)的元件。3、任意變形工具的使用作用：用于改變對象的形狀，包括大小、傾斜、旋轉(zhuǎn)、對象中心。方法：選定要調(diào)整對象之后點擊本工具，拖動八個控制點可以改變對象的大小(在四個角按shift鍵表示按比例改變)；把鼠標放在邊沿出現(xiàn)左右箭頭拖動鼠標改變對象的傾斜度；把鼠標放在4個角出現(xiàn)圓形箭頭表示改變對象的旋轉(zhuǎn)度；放在中心圓圈上拖動表示改變對象的中心。以上改變的方法基本都是以對象中心來改變。也可以點擊“修改>變形”菜單來完成?！揪毩?】 按課本P13-14頁制作即可。說明：如果想在本例基

19、礎(chǔ)上做動畫，那么需要在界面圖層上新建圖層制作動畫即可。練習7：繪制規(guī)則圖形【教學目的】 掌握直線工具、矩形工具、橢圓工具、選擇工具的使用，了解對象模式與合并模式的使用。【教學內(nèi)容】1、直線工具的使用作用：繪制各種樣式的線條。方法：選中直線工具之后，可在屬性面板設(shè)置線條的顏色、大小、線型，點擊自定義可以對線型進行詳細設(shè)置。也可以通過混色器設(shè)置好效果較好的顏色。設(shè)置各種屬性之后在場景中拖動鼠標即可畫出線條，按住Shift鍵可以繪制水平、垂直、斜45度角的直線。2、橢圓工具的使用作用：用來繪制有邊框有填充填充、無邊框有填充、無填充有邊框的橢圓或正圓。方法：在工具面板單擊橢圓工具后，單擊工具面板的筆觸

20、顏色設(shè)置邊框顏色及有無，單擊填充色設(shè)置填充顏色及有無。設(shè)置好顏色之后在場景中按住鼠標左鍵拖動即可畫出橢圓。按住Shift鍵繪制正圓。還可以在屬性面板設(shè)置起始和結(jié)束角度、內(nèi)徑、大小等。3、矩形工具的使用作用：用來繪制有邊框有填充填充、無邊框有填充、無填充有邊框的矩形、正方形、圓角矩形。方法：在工具面板單擊矩形工具后，單擊工具面板的筆觸顏色設(shè)置邊框顏色及有無，單擊填充色設(shè)置填充顏色及有無。設(shè)置好顏色之后在場景中按住鼠標左鍵拖動即可畫出矩形。按住Shift鍵繪制正方形。可以在屬性面板中設(shè)置矩形四個角的圓弧度值。4、對象模式與合并模式合并繪制模式是指圖形繪制重疊時，會自動合并圖像。對象繪制模式是指繪制

21、圖形時自動變?yōu)橐粋€對象，需要雙擊它才能編輯。切換方法：選擇工具之后點擊工具欄的“對象繪制”按鈕即可。如果是對象要變?yōu)閳D形按Ctrl+B打碎即可，要組合為一個對象按Ctrl+G即可。5、選擇工具的使用作用：用于選擇一個或多個對象、圖形、元件等，選擇好之后可以對它們進行編輯或移動。方法：a 單擊可以選擇一個對象或圖形。b 雙擊可以選擇圖形相連的區(qū)域，或?qū)υM行編輯。c 拖動一個區(qū)域可以選擇包括在這個區(qū)域中的圖形或?qū)ο?，單不能選擇沒有全部包括的元件。選定后的特征：a 圖形：表明出現(xiàn)點狀陰影。b 元件：有藍色邊框，并且有一個圓圈為中心點。編輯圖形：把鼠標放在圖形的邊沿拖動即可。按照Alt鍵拖動會產(chǎn)生角。【練習7】 按課本P16-頁制作即可。練習8：繪制變化圖形【教學目的】 掌握多角星型工具、漸變工具的使用，掌握顏色面板的使用?！窘虒W內(nèi)容】1、多角星型工具的使用作用：星型或多邊形。方法：選擇“多角星形工具”后展開“屬性”面板，其線形和顏色等調(diào)整與普通線條