基于純flash的動畫網(wǎng)站的設計與實現(xiàn)_畢業(yè)論文(編輯修改稿)
2024-10-06 17:23 本頁面
【文章內(nèi)容簡介】 。動作就是指用ActionScript（動作腳本）編寫的、當特定事件發(fā)生時執(zhí)行的一組指令。觸發(fā)動作的事件可以是播放頭到達某幀，或用戶單擊一個按鈕，或用戶按下鍵盤上的鍵。 在 Flash 中， 在動作面板中可以編寫的有幀動作、按鈕動用和影片剪輯動作 。使用 Normal Mode(標準模式 )動作面板上的控件，無需編寫任何動作腳本就可以插入動作。如果已經(jīng)熟悉 ActionScript，也 可以使用 Export Mode(專家模式 )動作面板編寫自己的腳本。指令的形式可以是一個動作（如指令動畫停止播放），也可以是一系列動作（如首先計算條件，然后執(zhí)行一個動作）。很多動作的設置只要求讀者具有少量的編程經(jīng)驗，而其他一些動作的應用則要求比較熟悉編程語言，用于高級開發(fā)。 ActionScript 中的對象可以包含數(shù)據(jù)或作為影片剪輯以圖像形式出現(xiàn)的編輯區(qū)中。所有的影片剪輯都是預定義類 MovieClip 的實例。每個影片剪輯實例均包含MovieClip 類的所有屬性（例如 _height、 _rotation、 _totalframes）和所有方法（如gotoAndPlay、 loadMovie、 startDrag）。 在面向對象的腳本編寫中，依據(jù)指定的順序，類可以相互接收屬性和方法，這稱為繼承。利用繼承可以擴展或重定義一個類的屬性和方法。從其他類繼承而來的類稱為子類，傳遞屬性和方法到另一個類的類稱為父類。一個類可以是子類，也可以是父類。 3． 網(wǎng)站設計 的 前期 規(guī)劃 網(wǎng)站的名稱 Lane 蘭蔻 。 本網(wǎng)站 是一個商業(yè)型的網(wǎng)站， 做網(wǎng)站的目的就是為了提高公司的知名度，讓公司的產(chǎn)品推廣出去，讓更多的消費人郡知道這個公司的 存在 。蘭蔻 主要是推出化妝品。運用 flash 技術去做商品展示型的網(wǎng)站，可能讓用戶更直觀的了解產(chǎn)品， 并且給用戶一種視覺的享受，讓用戶可以和計算機之間有一個交互的過程。 6 網(wǎng)站素材收集 蘭蔻是法國的一個知名品牌，在全國各地都有銷售，蘭蔻也有自己的網(wǎng)站。因此網(wǎng)絡成為了獲取信息的一個最佳路徑。通過在網(wǎng)上查找一些蘭蔻產(chǎn)品的圖片和文字信息，同時根據(jù)設計的需求，做一些相應的背景和小動畫為網(wǎng)頁做陪襯。素材收集完后，再把圖片在 photoshop 的處理，做一些文字效果。最后進行設計，將圖片加上文字解說放入網(wǎng)站中，運用 flash技術做出動態(tài)的效果。 網(wǎng)站的色調(diào)及風格 化妝品主要是針對的廣大女性，因此選用了紫色 和白色相結合的色調(diào)，給人一種高貴優(yōu)雅的感覺。 網(wǎng)站的風格簡單大方，運用漸變的色塊將網(wǎng)站分為了三大塊，分別是 logo 導航、內(nèi)容和版權信息。 網(wǎng)站的布 局 及欄目 網(wǎng)站的布局：首先在上部放入網(wǎng)站的左邊 logo 和蘭蔻的標志，中間放入導航，右邊放上背景音樂的播放動畫。網(wǎng)站中間的部分為網(wǎng)站的主要內(nèi)容部分，點擊導航中的菜單，相應的內(nèi)容就會也現(xiàn)在中間的版塊中。最后是頁面下部分為網(wǎng)站的版權信息。如圖 31 所示： 圖 31 本網(wǎng)站的欄目主要 分為 首 頁、推薦 、彩妝、護膚、香水、男士、論壇七個欄目。如圖 32 所示。 7 圖 32 網(wǎng)站的框架 網(wǎng)站具體框架如圖 23所示 圖 33 4． flash 網(wǎng)站的頁面設計 開場動畫的設計 開場動畫中的圖片切換用了逐幀動畫，每隔一幀放一張圖片。 而線的殘影效果的實現(xiàn)的實現(xiàn)過程如下： 1) 新建一個影片剪輯，畫一個矩形將它的四分之三的部分去掉， 將其轉換為 片剪輯， 命名為 bk,新建一層，復制粘貼幀，點擊“修改” —— “變形” —— “ 水平翻轉 ” ， 將圖層 2 中的圖形翻轉過來和圖層 1 中的 圖形相對， 將兩個圖形移到中間剛好是個矩形，在第 10 幀的位置插入關鍵幀，將兩個圖形分別向外移動，移到剛好容下一張變換的圖片為止，為它們創(chuàng)建形狀補間動畫 2) 新建一個影片剪輯 ，將影片剪輯 bk 拖入，新那一層，復制粘貼幀，點擊“修改” —— “變形” —— “水平翻轉”，將圖層 2 中的圖形翻轉過來和圖層 1 中的圖形相對， 將它們移動到中間的位置剛好放下切換的圖形，在第 5幀的位置插入關鍵幀，主頁 推薦產(chǎn)品 彩妝產(chǎn)品 論壇 護膚產(chǎn)品 香水 男仕 新品 口碑產(chǎn)品 暢銷排行 眼部 保 濕系列 璀璨香水 清潔系列 膚色 唇部 抗皺系列 美白系列 珍愛香水 奇跡香水 夢魅香水 防曬系列 修復系列 防曬系列 護理系列 8 將圖形分別縮小，再 20 幀的位置插入關鍵幀，將圖形分別向外移動并將它們的透明度變?yōu)?0。 3) 新建一個影片剪輯， 將 1）中建的影片剪輯拖入， 將其實例化為 bkuang 延長到第 10 幀，新建一個動作層， 1—— 10 幀都插入關鍵幀，如圖 41 所示 圖 41 在第 2 幀上都寫入如下代碼： duplicateMovieClip(bkuang,bkuang1,1)。 setProperty(bkuang,_alpha,90)。 其中第 2幀上的 alpha 的值相對于上一幀都要低，而且復制的新影片剪輯的名字依次為 bkuang1—— bkuangN，名字不可以一樣。 透明度也 要相對應它的前一幀要降低 。 二級面頁的設計 彩妝頁 面主要分為了眼部彩妝、唇部彩妝和膚色。在這一頁面中，我彩用了緩動的方法，分別將蘭蔻公司具有代表性的三個彩妝系列來做為二級頁面的主要內(nèi)容。并且 蘭蔻全球創(chuàng)意總監(jiān) Aaron De Mey 作為該欄目的一部分進行介紹。 彩妝頁面每一個圖片上 都有一上透明的按鈕，而 文字 的 顯示則是用了按鈕事件onRollOver 和 onRollOut 來進行調(diào)用。到于點擊圖片就會進入相應的三級頁面，是在該場景中放入了一個空的影片剪輯， 并將其實例化，通過 loadMovie 來調(diào)用外部文檔。 打開彩妝頁面和進入三級頁面的圖片的進入和退出用到的是緩動 。進入時的主要代碼如下： 9 import 。 import .*。 myTween = new Tween(mc1, _y, , 600, 10, , true)。 為了讓它們出現(xiàn)逐個進入的效果，只需 將 它們的速度改變一個即可，也就是修改 的值，數(shù)值越大表示出現(xiàn)的越慢。 退出時是設計了一個函數(shù)， 代碼 如下： function down(mc, time) { myTween = new Tween(mc, _y, , 30, 500, time, true)。} 用是只需 調(diào)用并改變 它們 的影片剪輯的名字和速度就可以為了，也就是 mc 和time 的值。 三級頁面的設計 按鈕的設計 三級頁中的按鈕用的是補間動畫。本頁面中的按鈕為透明按鈕。主要用到了按鈕事件中的 onRollOvert 和 onRollOut，當鼠標移到按鈕上時影片剪輯開始播放并且在某一幀停下來，當鼠標移開時，再播放后面的幀。 具體步驟如下： 1) 新建一個圖形元件，畫一個矩形，不要邊框。 2) 新建一個影片剪輯，將做好的矩形圖形元件拖入 制作一個兩幀的逐幀動畫 將第一幀和第二幀的透明度改成不一樣的。 3) 新建一個影片剪輯，將做好的矩形圖形元件拖入，做
研究報告相關推薦
鄂ICP備17016276號-1