FlashMX2004基礎(chǔ)

1、第五章第五章 flash mx 2004基礎(chǔ)基礎(chǔ) 第一節(jié)第一節(jié) 初識(shí)初識(shí)flash mx 2004 第二節(jié)第二節(jié) flash mx 2004工作界面工作界面 第三節(jié)第三節(jié) 應(yīng)用實(shí)例應(yīng)用實(shí)例 習(xí)題五習(xí)題五flash mx 2004是目前最為流行的一款web網(wǎng)頁(yè)創(chuàng)作工具，它集矢量編輯和動(dòng)畫創(chuàng)作為一體，可以在web上創(chuàng)建精美的動(dòng)畫和交互式流媒體，無(wú)論在創(chuàng)作動(dòng)畫、廣告、導(dǎo)航按鈕還是構(gòu)建商業(yè)網(wǎng)站等方面，都是最靈活、最專業(yè)的矢量動(dòng)畫軟件。它還可以創(chuàng)作復(fù)雜的交互式游戲、桌面應(yīng)用程序等軟件。第一節(jié) 初識(shí)flash mx 2004一、一、flash mx 2004簡(jiǎn)介簡(jiǎn)介flash mx 2004是macrom

2、edia公司推出的一款優(yōu)秀的矢量動(dòng)畫軟件，包含了用于創(chuàng)建矢量圖、動(dòng)畫、應(yīng)用程序、演示文稿等工具，下面簡(jiǎn)單介紹一些flash mx 2004的基礎(chǔ)知識(shí)。flash動(dòng)畫又稱flash影片，由于其主要由矢量圖形組成，因此所導(dǎo)出的swf文件很小，下載速度很快，并且可以在瀏覽時(shí)根據(jù)用戶需要自由縮放。它支持多種文件的導(dǎo)入，例如：photoshop，illustrator，freehand等軟件生成的圖形文件格式；還支持音頻文件的導(dǎo)入，例如：mp3。flash mx 2004具有極其靈巧的圖形繪制功能，可以將圖形打散成許多單一的元素進(jìn)行編輯。由于flash提供具有保真技術(shù)的繪圖工具，所以圖形在經(jīng)過(guò)一系列加工

3、后，仍會(huì)保持平滑。flash mx 2004集成了flash播放器flash player 7.0，默認(rèn)情況下隨著flash mx 2004一起安裝。此外，windows 2000和windows xp或以上版本的操作系統(tǒng)中也包含了flash播放插件，而如果用戶使用的windows 98并且ie瀏覽器的版本為4.0或更低版本，則需要安裝flash播放器插件才能順利瀏覽flash動(dòng)畫。二、二、flash mx 2004安裝與運(yùn)行安裝與運(yùn)行在macromedia flash mx 2004安裝與運(yùn)行之前應(yīng)該關(guān)閉所有正在使用的flash版本，才能順利進(jìn)行安裝與運(yùn)行。1程序的安裝下面介紹flash m

4、x 2004在windows xp下的安裝步驟：（1）將安裝程序插入計(jì)算機(jī)cd-rom驅(qū)動(dòng)器，系統(tǒng)便會(huì)自動(dòng)運(yùn)行flash mx 2004安裝程序。如果系統(tǒng)未自動(dòng)安裝，可以選擇“開始”“我的電腦”命令，找到cd-rom驅(qū)動(dòng)器，雙擊安裝程序圖標(biāo)，彈出“macromedia flash mx 2004-installshield wizard”對(duì)話框，開始解壓縮文件，如圖5.1.1所示。圖5.1.1 “macromedia flash mx 2004-installshield wizard”對(duì)話框（2）解壓縮完畢后，彈出“installshield wizard”對(duì)話框，開始準(zhǔn)備啟動(dòng)安裝向?qū)?，如圖

5、5.1.2所示。圖5.1.2 “installshield wizard”對(duì)話框（3）等待安裝向?qū)瓿珊?，彈出“macromedia flash mx 2004安裝程序”對(duì)話框，如圖5.1.3所示。圖5.1.3 “macromedia flash mx 2004安裝程序”對(duì)話框（4）單擊“下一步”按鈕，彈出macromedia flash mx 2004的“許可證協(xié)議”對(duì)話框，如圖5.1.4所示。閱讀完許可證協(xié)議的內(nèi)容后，如果同意該協(xié)議中所有條款，單擊“是”按鈕，進(jìn)入下一步安裝；如果不同意，單擊“否”按鈕，退出安裝。若要安裝macromedia flash mx 2004，必須同意此協(xié)議。圖5

6、.1.4 “許可證協(xié)議”對(duì)話框（5）在“許可證協(xié)議”對(duì)話框中單擊“是”按鈕后，彈出“選擇目的地位置”對(duì)話框，如圖5.1.5所示。圖5.1.5 “選擇目的地位置”對(duì)話框（6）如果要改變macromedia flash mx 2004的安裝目的地，單擊“瀏覽”按鈕，彈出“選擇文件夾”對(duì)話框，如圖5.1.6所示。選擇新的安裝目的地后單擊“確定”按鈕，返回“選擇目的地位置”對(duì)話框。圖5.1.6 “選擇文件夾”對(duì)話框（7）單擊“下一步”按鈕，彈出“安裝macromedia flash player”對(duì)話框，如果要安裝，選中復(fù)選框，如圖5.1.7所示。圖5.1.7 “安裝macromedia flash

7、player”對(duì)話框（8）單擊“下一步”按鈕，彈出“開始復(fù)制文件”對(duì)話框，如圖5.1.8所示。復(fù)制文件前請(qǐng)查看“當(dāng)前設(shè)置”列表框中顯示的內(nèi)容，如果設(shè)置錯(cuò)誤，單擊“上一步”按鈕在相應(yīng)的對(duì)話框中進(jìn)行修改。圖5.1.8 “開始復(fù)制文件”對(duì)話框（9）確認(rèn)所有設(shè)置無(wú)誤后單擊“下一步”按鈕，彈出“安裝狀態(tài)”對(duì)話框，進(jìn)行程序的安裝，如圖5.1.9所示。圖5.1.9 “安裝狀態(tài)”對(duì)話框（10）程序安裝完畢后，會(huì)彈出“正在復(fù)制文件”對(duì)話框，如圖5.1.10所示。圖5.1.10 “正在復(fù)制文件”對(duì)話框（11）文件復(fù)制完畢后，彈出“installshield wizard完成”對(duì)話框，單擊“完成”按鈕，完成flas

8、h mx 2004的安裝，如圖5.1.11所示。圖5.1.11 “installshield wizard完成”對(duì)話框2程序的運(yùn)行安裝完畢后，選擇“開始”“所有程序”“macromedia”“macromedia flash mx2004”命令，即可啟動(dòng)flash mx 2004，運(yùn)行flash mx 2004的具體步驟如下：（1）選擇“macromedia flash mx2004”命令，彈出“macromedia產(chǎn)品注冊(cè)”對(duì)話框，如圖5.1.12所示。選中“我有一個(gè)序列號(hào)，我希望激活macromedia flash”單選按鈕，激活flash。圖5.1.12 “macromedia產(chǎn)品注冊(cè)”

9、對(duì)話框（2）單擊“繼續(xù)”按鈕，彈出“輸入您的序列號(hào)”對(duì)話框，在文本框中輸入從安裝盤中找到的產(chǎn)品序列號(hào)。（3）輸入正確的產(chǎn)品序列號(hào)后，注冊(cè)即可完成。單擊“繼續(xù)”按鈕，彈出“激活已完成”對(duì)話框，表明dreamweaver mx 2004已經(jīng)激活成功。填寫并選擇對(duì)應(yīng)的信息，單擊“注冊(cè)”按鈕；或是單擊“以后提醒我”按鈕，跳過(guò)注冊(cè)，如圖5.1.13所示。圖5.1.13 “激活已完成”對(duì)話框（4）注冊(cè)完成后，便會(huì)彈出flash mx 2004的啟動(dòng)界面，如圖5.1.14所示。圖5.1.14 flash mx 2004的啟動(dòng)界面（5）隨后打開flash mx 2004的程序窗口，如圖5.1.15所示。圖5.

10、1.15 flash mx 2004的程序窗口本節(jié)將對(duì)flash mx 2004的工作界面及其各種工具進(jìn)行簡(jiǎn)單地介紹。選擇“開始”“所有程序”“macromedia ”“macromedia flash mx 2004”命令，啟動(dòng)flash mx 2004，選擇“文件”“新建”命令，彈出“新建文檔”對(duì)話框，打開“常規(guī)”選項(xiàng)卡，在“類型”列表框中選擇“flash文檔”選項(xiàng)，單擊“確定”按鈕，新建一個(gè)flash文檔，其工作界面如圖5.2.1所示。第二節(jié) flash mx 2004工作界面圖5.2.1 flash mx 2004的工作界面一、標(biāo)題欄一、標(biāo)題欄標(biāo)題欄顯示的主要有flash mx 200

11、4的程序圖標(biāo)、程序名稱（如果正在編輯文檔，會(huì)顯示當(dāng)前正在編輯文檔的標(biāo)題和名稱）、最小化按鈕、最大化按鈕（或向下還原按鈕）和關(guān)閉按鈕，如圖5.2.2所示。圖5.2.2 標(biāo)題欄單擊flash mx 2004的程序圖標(biāo)或在標(biāo)題欄中單擊鼠標(biāo)右鍵，彈出程序菜單，如圖5.2.3所示。用戶可以選擇對(duì)flash窗口進(jìn)行移動(dòng)、改變大小、最大化、最小化等操作，雙擊程序圖標(biāo)，可以關(guān)閉flash mx 2004。程序名稱后面顯示的是當(dāng)前正在編輯的文檔的文件名稱。圖5.2.3 程序菜單二、菜單欄二、菜單欄標(biāo)題欄的下方是菜單欄，由“文件”、“編輯”、“視圖”、“插入”、“修改”、“文本”、“命令”、“控制”、“窗口”和“

12、幫助 ”10個(gè)菜單項(xiàng)組成，如圖5.2.4所示。這里只簡(jiǎn)單介紹一下其各項(xiàng)的主要功能，具體的使用方法將在本書后面的章節(jié)中詳細(xì)介紹。圖5.2.4 菜單欄（1）文件：“文件”菜單中包括新建、打開、保存、關(guān)閉文件，導(dǎo)入、導(dǎo)出其他格式文檔等命令。利用該菜單中的命令還可以在internet explorer或flash player中預(yù)覽設(shè)計(jì)的flash。（2）編輯：“編輯”菜單中包括撤消、重做、剪切、復(fù)制、粘貼、查找、替換等命令。利用該菜單的命令還可以設(shè)置flash mx 2004的首選參數(shù)。（3）視圖：“視圖”菜單中包括場(chǎng)景的切換，對(duì)各種對(duì)象的放大、縮小，顯示或隱藏標(biāo)尺、網(wǎng)格等輔助設(shè)計(jì)工具。（4）插入：

13、“插入”菜單中包括元件的創(chuàng)建、在時(shí)間軸中插入圖層、以及添加各種時(shí)間軸特效以及場(chǎng)景等工具。（7）命令：“命令”菜單中包括對(duì)已保存的命令進(jìn)行管理、運(yùn)行命令，從網(wǎng)上獲取更多命令等工具，并且在下拉菜單中列出已保存的命令。（8）控制：“控制”菜單中包括對(duì)影片的測(cè)試、調(diào)試、播放等工具，還可設(shè)置影片的循環(huán)播放、靜音等功能。（9）窗口：“窗口”菜單中包括對(duì)flash mx 2004各面板和窗口的訪問(wèn)，同時(shí)還可以在各文檔之間進(jìn)行切換。（10）幫助：“幫助”菜單提供了flash mx 2004的幫助資料、范例、擴(kuò)展、聯(lián)機(jī)注冊(cè)以及flash技術(shù)支持中心的鏈接。提示：菜單項(xiàng)后面括號(hào)內(nèi)的英文字母是該菜單項(xiàng)的快捷鍵，按住

14、alt鍵的同時(shí)，再按相應(yīng)的快捷鍵，即可快速打開相應(yīng)的菜單項(xiàng)。三、工具欄三、工具欄工具欄包括主工具欄、控制器和編輯欄。選擇“窗口”“工具欄”命令，在彈出的子菜單中選擇各項(xiàng)命令，即可顯示或隱藏對(duì)應(yīng)的工具欄。1主工具欄選擇“窗口”“工具欄”“主工具欄”命令，打開“主工具欄”面板，如圖5.2.5所示。其中包括“新建”按鈕、“打開”按鈕、“保存”按鈕、“打印”按鈕、“剪切”按鈕、“復(fù)制”按鈕、“粘貼”按鈕、“撤消”按鈕、“重做”按鈕、“對(duì)齊對(duì)象”按鈕、“平滑”按鈕、“伸直”按鈕、“旋轉(zhuǎn)與傾斜”按鈕、“縮放”按鈕和“對(duì)齊”按鈕。圖5.2.5 “主工具欄”面板2控制器選擇“窗口”“工具欄”“控制器”命令，打

15、開“控制器”面板，如圖5.2.6所示。其中包括“停止”按鈕、“后退”按鈕、“后退一幀”按鈕、“播放”按鈕、“前進(jìn)一幀”按鈕和“轉(zhuǎn)到結(jié)尾”按鈕。圖5.2.6 “控制器”面板3編輯欄選擇“窗口”“工具欄”“編輯欄”命令，便會(huì)在窗口中出現(xiàn)編輯欄，如圖5.2.7所示。其中包括“向上”按鈕、“編輯場(chǎng)景”按鈕、“編輯元件”按鈕和“顯示比例”下拉列表框。圖5.2.7 編輯欄四、工具箱四、工具箱工具箱集成了一套完整的繪圖工具，通常固定在窗口的左側(cè)，用戶可以使用工具箱中的工具對(duì)圖像或選定區(qū)域進(jìn)行操作，如圖5.2.8所示。圖5.2.8 工具箱（1）：選擇工具。在工作區(qū)中以矩形框選擇或移動(dòng)一個(gè)或多個(gè)對(duì)象。（2）：部

16、分選取工具。移動(dòng)或編輯單個(gè)的錨點(diǎn)或切線，移動(dòng)單個(gè)對(duì)象。（3）：線條工具。繪制直線對(duì)象。（4）：套索工具。選擇對(duì)象的一部分，其選擇區(qū)域可以是不規(guī)則的。（5）：鋼筆工具。與直線工具相比，鋼筆工具能夠繪制更復(fù)雜、精確的曲線。（6）：文本工具。插入文本對(duì)象。（7）：橢圓工具。繪制內(nèi)部帶有填充色塊的橢圓。（8）：矩形工具。繪制矩形或橢矩形對(duì)象（單擊此按鈕右下角的小三角可以彈出多角星形工具）。（9）：鉛筆工具。繪制任意線條和圖形。（10）：刷子工具。繪制像刷子一樣刷出來(lái)的線條和填充閉合的區(qū)域。（11）：任意變形工具。任意調(diào)整線條、圖形或文本框等對(duì)象。（12）：填充變形工具。可以調(diào)整漸變色、填充物的尺寸、角

17、度和中心點(diǎn)。（13）：墨水瓶工具?？梢愿淖儗?duì)象輪廓線的顏色、類型、粗細(xì)等。（14）：顏料桶工具。用于填充顏色、漸變色及位圖等對(duì)象的封閉區(qū)域。（15）：滴管工具。可以從各種對(duì)象中獲得顏色信息。 （16）：橡皮擦工具。擦除鼠標(biāo)經(jīng)過(guò)的區(qū)域內(nèi)的內(nèi)容。（17）：手形工具。拖動(dòng)工作區(qū)中的圖像。（18）：縮放工具?？梢苑糯蠡蚩s小視圖大小。（19）：筆觸顏色。設(shè)定畫筆的顏色。（20）：填充色。設(shè)定填充的顏色。（21）：對(duì)齊對(duì)象。能夠使對(duì)象對(duì)齊。（22）：平滑。柔化選定對(duì)象的邊界。（23）：伸直。銳化選定對(duì)象的邊界。五、時(shí)間軸面板五、時(shí)間軸面板時(shí)間軸用于組織和控制文檔內(nèi)容在一定時(shí)間內(nèi)播放的層數(shù)和幀數(shù)。flash

18、文檔將時(shí)長(zhǎng)分為幀，而層就像堆疊在一起的多張幻燈膠片一樣，每個(gè)層都包含一個(gè)顯示在舞臺(tái)中不同的圖像，如圖5.2.9所示。文檔中的層列在時(shí)間軸左側(cè)的列中，每個(gè)層中包含的幀顯示在該層名右側(cè)的一行中，時(shí)間軸頂部的時(shí)間軸標(biāo)題指示幀編號(hào)，播放頭指示在舞臺(tái)中當(dāng)前顯示的幀。用戶可以更改在時(shí)間軸中幀的顯示方式，也可以在時(shí)間軸中顯示幀內(nèi)容的縮略圖。時(shí)間軸顯示文檔中哪些地方有動(dòng)畫，包括逐幀動(dòng)畫、補(bǔ)間動(dòng)畫、運(yùn)動(dòng)路徑等。注意：在播放動(dòng)畫時(shí)，將顯示實(shí)際的幀頻；如果計(jì)算機(jī)不能足夠快地顯示動(dòng)畫，則該幀頻可能與文檔的幀頻不一致。 圖5.2.9 “時(shí)間軸”面板六、屬性面板六、屬性面板屬性面板也叫屬性檢查器，是控制flash元素屬性

19、的面板，如圖5.2.10所示。在其中可以更改和設(shè)置許多常用的屬性，同時(shí)也可以做出一些效果和設(shè)計(jì)。圖5.2.10 屬性面板（1）單擊圖5.2.10中屬性面板右下角的折疊按鈕，可以折疊屬性面板，使之僅顯示最常用的屬性，如圖5.2.11所示。此時(shí)，折疊按鈕會(huì)相應(yīng)地變成。圖5.2.11 屬性面板（2）屬性面板上的內(nèi)容會(huì)根據(jù)選中元素的不同而發(fā)生相應(yīng)的改變。例如，選中工具箱中“直線工具”和“文本工具”時(shí)屬性面板是完全不一樣的，如圖5.2.12和圖5.2.13所示。圖5.2.12 選中“直線工具”時(shí)的屬性面板提示：在屬性面板中所做的大部分修改會(huì)立刻顯示在編輯區(qū)中，但是對(duì)于某些屬性的修改，則要在屬性編輯文本區(qū)

20、域之外單擊或按回車鍵或tab鍵才會(huì)使更改有效。圖5.2.13 選中“文本工具”時(shí)的屬性面板七、面板組七、面板組與dreamweaver mx 2004類似，面板是一個(gè)工具集合的控制框架，如果要將面板從面板組中拖離，可以將鼠標(biāo)指向面板左上角處，此時(shí)鼠標(biāo)光標(biāo)變成形狀，按住鼠標(biāo)左鍵，拖動(dòng)鼠標(biāo)至編輯區(qū)松開鼠標(biāo)左鍵即可，如圖5.2.14所示。圖5.2.14 將面板從面板組中拖離在面板中進(jìn)行操作時(shí)，對(duì)文檔的改變也會(huì)相應(yīng)地顯示在編輯區(qū)中。它可以將各種浮動(dòng)窗口、面板組合成為選項(xiàng)卡的形式，節(jié)省屏幕空間，如圖5.2.15所示。單擊面板名稱前的按鈕，可展開該面板進(jìn)行編輯，此時(shí)按鈕會(huì)相應(yīng)地變成。圖5.2.15 面板組

21、在使用面板時(shí)，可以單擊“窗口”菜單，在彈出的下拉菜單中選擇相應(yīng)的命令以顯示或隱藏各個(gè)面板，如圖5.2.16所示。若想查看動(dòng)畫設(shè)計(jì)的整體效果，可按f4鍵隱藏全部面板，再次按f4鍵時(shí)，可以顯示全部面板。圖5.2.16 “窗口”下拉菜單八、舞臺(tái)和工作區(qū)八、舞臺(tái)和工作區(qū)flash mx 2004的工作區(qū)由以下幾部分組成：一個(gè)可在上面放置媒體內(nèi)容的舞臺(tái)、一個(gè)用于控制應(yīng)用程序功能的包含菜單和命令的主工具欄、面板組和一個(gè)用于組織和修改媒體資源“屬性”面板，以及一個(gè)用于創(chuàng)建和修改矢量圖形內(nèi)容包含工具的工具欄，如圖5.2.17所示。這里將詳細(xì)講述舞臺(tái)的一些操作及相關(guān)工具的使用方法。圖5.2.17 flash m

22、x 2004的舞臺(tái)1移動(dòng)舞臺(tái)視圖將舞臺(tái)放大后可能無(wú)法看到整個(gè)舞臺(tái)。使用“手形工具”按鈕可以移動(dòng)舞臺(tái)，從而不必更改縮放比率即可更改視圖。移動(dòng)舞臺(tái)的操作步驟介紹如下：（1）在工具欄中單擊“手形工具”按鈕。（2）拖動(dòng)舞臺(tái)至合適位置。提示：按住空格鍵并在工具欄中單擊其他工具，可臨時(shí)在手形工具和其他工具之間切換。2標(biāo)尺flash mx 2004可以設(shè)置在工作區(qū)中顯示標(biāo)尺，使用它可以比較容易控制舞臺(tái)中各個(gè)對(duì)象的位置。用戶可以根據(jù)需要改變標(biāo)尺的度量單位。在制作動(dòng)畫的過(guò)程中，讀者可以通過(guò)標(biāo)尺了解各個(gè)對(duì)象在舞臺(tái)中的位置。如果要在工作區(qū)中顯示標(biāo)尺，可選擇“視圖”“標(biāo)尺”命令。3網(wǎng)格如果用戶覺得在繪圖中標(biāo)尺還不足以

23、精確定位，可以設(shè)置在舞臺(tái)中顯示灰色網(wǎng)格協(xié)助繪圖，如圖5.2.18所示。圖5.2.18 顯示網(wǎng)格后的舞臺(tái)效果如果要在工作區(qū)中顯示網(wǎng)格，可選擇“視圖”“網(wǎng)格”“顯示網(wǎng)格”命令。如果要設(shè)置網(wǎng)格可選擇“視圖”“網(wǎng)格”“編輯網(wǎng)格”命令，彈出對(duì)話框，如圖5.2.19所示?？梢栽O(shè)置網(wǎng)格的顏色、是否顯示網(wǎng)格、使對(duì)象對(duì)齊網(wǎng)格、網(wǎng)格的橫縱間距以及對(duì)齊精確度等信息，單擊“保存默認(rèn)值”按鈕可將所做更改設(shè)定為默認(rèn)值，在以后使用flash mx 2004時(shí)，自動(dòng)載入默認(rèn)值。圖5.2.19 “網(wǎng)格”對(duì)話框 提示：只有在選中“對(duì)齊網(wǎng)格”復(fù)選框時(shí)，才能利用網(wǎng)格進(jìn)行對(duì)齊。 4設(shè)置舞臺(tái)顏色舞臺(tái)的默認(rèn)顏色為白色，在最終動(dòng)畫中沒(méi)有任何

24、對(duì)象覆蓋的區(qū)域都能夠看到該背景。改變舞臺(tái)背景的操作步驟如下：（1）選擇“修改”“文檔”命令，彈出“文檔屬性”對(duì)話框，如圖5.2.20所示。（2）單擊“背景顏色”顏色板，打開顏色選擇面板，如圖5.2.21所示。（3）單擊所要使用的顏色，然后單擊“確定”按鈕，即可更改舞臺(tái)的背景顏色。圖5.2.20 “文檔屬性”對(duì)話框 圖5.2.21 顏色選擇面板本例制作一個(gè)自右向左移動(dòng)并逐漸消失的文本，效果如圖5.3.1所示。第三節(jié) 應(yīng)用實(shí)例圖5.3.1 效果圖具體操作步驟如下：（1）選擇“文件”“新建”命令，彈出“新建文檔”對(duì)話框，如圖5.3.2所示。在“類型”列表框中選擇“flash文檔”選項(xiàng)，單擊“確定”按鈕。圖5.3.2 “新建文檔”對(duì)話框（2）選擇“修改”“文檔”命令，彈出“文檔屬性”對(duì)話框，設(shè)置其參數(shù)，如圖5.3.3所示，單擊“確定”按鈕。圖5.3.3 “文檔屬性”對(duì)話框（3）選擇“插入”