flash網(wǎng)站畢業(yè)論文--班級展示平臺的設(shè)計與實現(xiàn)_第1頁
已閱讀1頁,還剩30頁未讀 繼續(xù)免費閱讀

下載本文檔

版權(quán)說明:本文檔由用戶提供并上傳,收益歸屬內(nèi)容提供方,若內(nèi)容存在侵權(quán),請進行舉報或認(rèn)領(lǐng)

文檔簡介

1、<p><b>  畢業(yè)論文(設(shè)計)</b></p><p>  題目 班級展示平臺的設(shè)計與實現(xiàn) </p><p>  ??茖W(xué)校 蘇州工業(yè)職業(yè)技術(shù)學(xué)院 </p><p>  專業(yè) 計算機信息管理 </p>

2、;<p>  考生姓名 </p><p>  準(zhǔn)考證號 </p><p>  指導(dǎo)教師 </p><p>  2012年3月29日</p><p&g

3、t;<b>  目 錄</b></p><p><b>  摘 要1</b></p><p>  Abstract2</p><p><b>  前 言3</b></p><p>  第一章 概 述4</p><p>  1.1 Fla

4、sh網(wǎng)站背景4</p><p>  1.2 Flash網(wǎng)站所具備的優(yōu)勢4</p><p>  1.3 關(guān)于本課題4</p><p>  1.4 本論文所涉及內(nèi)容5</p><p>  第二章 開發(fā)平臺與所用技術(shù)6</p><p>  2.1 開發(fā)工具6</p><p>  2

5、.1.1 Adobe Flash CS5.5 Professional6</p><p>  2.1.2 Adobe Photoshop CS4 Professional6</p><p>  2.2 所用技術(shù)6</p><p>  第三章 網(wǎng)站規(guī)劃7</p><p>  3.1 網(wǎng)站結(jié)構(gòu)圖7</p><p&

6、gt;  3.2 網(wǎng)站內(nèi)容7</p><p>  3.3 網(wǎng)站效果圖7</p><p>  第四章 網(wǎng)站程序?qū)崿F(xiàn)11</p><p>  4.1 整體設(shè)計11</p><p>  4.2 網(wǎng)站設(shè)計11</p><p>  4.2.1 引導(dǎo)頁設(shè)計11</p><p>  4

7、.2.2 導(dǎo)航的設(shè)計11</p><p>  4.2.3 滾動條的設(shè)計12</p><p>  4.2.4 XML外部載入實現(xiàn)13</p><p>  4.2.5 相冊的翻頁設(shè)計15</p><p>  4.2.6 郵件發(fā)送的實現(xiàn)16</p><p>  4.2.7 背景音樂的控制17</

8、p><p>  4.2.8 進度條的實現(xiàn)18</p><p>  第五章Flash 發(fā)布20</p><p>  第六章 總結(jié)21</p><p>  6.1 個人總結(jié)21</p><p>  6.2 制作過程中遇到的問題和解決方法21</p><p>  6.3 網(wǎng)站改進方向

9、22</p><p><b>  參考文獻23</b></p><p><b>  致 謝24</b></p><p><b>  附 錄25</b></p><p><b>  摘 要</b></p><p>

10、;  Flash是一種創(chuàng)作工具,可使用它來創(chuàng)建演示文稿、應(yīng)用程序和其它允許用戶交互的內(nèi)容。Flash可以包含簡單的動畫、視頻內(nèi)容、復(fù)雜演示文稿和應(yīng)用程序以及介于它們之間的任何內(nèi)容。Flash特別適用于創(chuàng)建關(guān)于Internet的內(nèi)容,因為它的文件非常小。Flash是通過廣泛使用矢量圖形做到這一點的。而全Flash網(wǎng)站具備普通網(wǎng)站所不具備的視覺沖擊力和互動體驗。所以全Flash網(wǎng)站比較生動,其互動性能是普通網(wǎng)站無法相比的。</p>

11、;<p>  本文完整的闡述了如何制作一個Flash網(wǎng)站,并且怎樣利用XML實現(xiàn)txt,mp3和jpg文件在web頁面的動態(tài)交互加載以及不同頁面間的切換,信息的編輯與發(fā)送以及Action Script代碼控制等。</p><p>  關(guān)鍵詞:Flash XML Action Script </p><p>  作 者:王曦鵬</p><p>

12、<b>  指導(dǎo)老師:陳園園</b></p><p><b>  Abstract</b></p><p>  Flash is a kind of creation tools, can use it to create demonstration draft, the application and the other allows user

13、s to interactive content. Flash can contain simple animation, video content, complex demo application, and in-between manuscripts and between them of any content. Flash particularly applicable to create the content on In

14、ternet, because of it of file is very small. Flash is through the extensive use of vector graphics do it. And the whole Flash web site with ordinary doesn't have </p><p>  This paper expounds how to make

15、 complete a Flash web, and how to use XML realize TXT, mp3 and JPG file in web pages load and the dynamic interaction between different page switch, editor of information and send and Action Script code control, etc.<

16、/p><p>  Keywords: Flash XML ActionScript </p><p>  The make: Wang Xipeng </p><p>  Teacher: ChenYuanyuan </p><p><b>  前 言</b></p><p>  數(shù)字媒體時代的到來

17、,使人們不在滿足于簡單直接的信息傳達,人們渴望在接受信息的同時能夠帶來一種視覺享受。Flash能讓瀏覽者在輕松、有趣的視覺感受中,以最短的時間了解信息內(nèi)容。Flash是目前在網(wǎng)絡(luò)應(yīng)用中最好的多媒體動畫,強烈的視覺沖擊力給瀏覽者帶來全新的感受,更易留下深刻的印象,能夠極好的達到理想的宣傳效果。綜合起來說,F(xiàn)lash網(wǎng)站是一種藝術(shù)與技術(shù)相結(jié)合產(chǎn)物。Flash網(wǎng)站是以藝術(shù)介入技術(shù)層面來達到視覺推廣的目的,這樣的好處是能夠更好的針對目標(biāo)人群,把

18、信息以藝術(shù)效果的形式體現(xiàn)出來。</p><p>  本課題是利用Flash的Adobe Flash CS5.5 Professional版本進行一個班級網(wǎng)站的制作,由于本人知識的有限,時間的倉促,以及客觀條件的限制,網(wǎng)站的規(guī)模不會很大。該Flash網(wǎng)站主要是一個以班級活動時候的照片,以及一些對于班級生活的文字的描述和同學(xué)介紹的一個班級網(wǎng)站。每個人都有那么段屬于自己的學(xué)生生涯,對于大學(xué)生涯,美好的回憶總是一幕幕出現(xiàn)

19、在眼前。而一個小型的Flash網(wǎng)站,既能勾起我美好的大學(xué)回憶,也能在網(wǎng)站中找到一些大學(xué)班級生活中的點點滴滴,和同學(xué)們的深厚友誼。于是,我決定利用自己大學(xué)課余時間自己所學(xué)的知識,自己在指導(dǎo)老師的幫助下,和朋友合作制作這個小型的Flash網(wǎng)站。</p><p>  本次畢業(yè)設(shè)計制作完成的Flash網(wǎng)站共分為三個模塊,分別為關(guān)于我們、照片和聯(lián)系我們。本文共分為五章,第一章介紹了Flash軟件開發(fā)背景以及課題的內(nèi)容; 第

20、二章介紹了本網(wǎng)站的開發(fā)平臺及要使用的主要技術(shù);第三章對網(wǎng)站進行了規(guī)劃和簡單的介紹;第四章是網(wǎng)站的具體實現(xiàn),并描述一些關(guān)鍵性技術(shù);第五章主要介紹網(wǎng)站的發(fā)布;第六章是對整個過程的總結(jié),講述心得與感想。</p><p><b>  第一章 概 述</b></p><p>  1.1 Flash網(wǎng)站背景</p><p>  早在上世紀(jì)八九十年代,凡

21、是接觸網(wǎng)頁的人員,在他們的印象中所謂網(wǎng)站就是一些文字和圖像的排版,文字和圖片都可以做上相應(yīng)的鏈接,并且可以點擊。而如今,很大一部分人來說,這種現(xiàn)象仍然持續(xù)到現(xiàn)在,不過隨著互聯(lián)網(wǎng)網(wǎng)絡(luò)帶寬的不斷增加以及如今Flash對互聯(lián)網(wǎng)的影響力的不斷增強,人們已經(jīng)認(rèn)可在HTML頁面上加入一些Flash的元素。Flash元素的加入使得網(wǎng)絡(luò)頁面更加的生動形象,讓人們更容易,更好的去接受。自從2000年以后,開始不斷涌現(xiàn)純Flash網(wǎng)站,但人們對他的認(rèn)識并不

22、是很深,大部分人會認(rèn)為純Flash網(wǎng)站會影響訪問的速度。所以在Flash發(fā)展初期和帶寬有限的情況下確實存在這種現(xiàn)象,隨著計算機網(wǎng)絡(luò)的發(fā)展,傳輸速率加快,這一現(xiàn)狀也將得到解決。而且,網(wǎng)站是人們了解一個企業(yè)的窗口,而現(xiàn)如今,更多的公司將自己的網(wǎng)站看作是在互聯(lián)網(wǎng)上的銷售平臺,不僅讓用戶在這個平臺上了解和感受公司的產(chǎn)品和文化,同時還能收集用戶所反饋的信息,通過分析這些信息,企業(yè)才能及時調(diào)整策略以達到利潤的最大化。而純Flash網(wǎng)站恰好能滿足這些

23、企業(yè)的要求:它具有強有力的廣告宣傳、快速的傳播速度、涉及的范圍極廣、豐富的媒體內(nèi)容、體貼用戶的流</p><p>  1.2 Flash網(wǎng)站所具備的優(yōu)勢</p><p>  Flash網(wǎng)站是以生動形象的動畫和交互式操作,給每一位訪問者帶來一種切身體驗的訪問感受,使用者在瀏覽的過程中自然而然的融入到網(wǎng)站中。同時Flash已經(jīng)具備了后端開發(fā)和數(shù)據(jù)顯示的能力,可以完全勝任中小型網(wǎng)站的開發(fā)。&l

24、t;/p><p>  從視覺展現(xiàn)效果來看,純Flash 網(wǎng)站可以完成HTML網(wǎng)站不能制造出的質(zhì)感和動作效果,特別是一流的動態(tài)視覺特效,能給人以震撼的視聽沖擊,同時配合高品質(zhì)的頁面設(shè)計,別具風(fēng)格的配樂,純Flash 網(wǎng)站會展現(xiàn)出無窮的魅力。現(xiàn)如今,計算機網(wǎng)絡(luò)發(fā)展日新月異,互聯(lián)網(wǎng)網(wǎng)絡(luò)帶寬不斷提高,使得動畫、音樂、電影的傳輸瓶頸正在逐漸消失。在線實時收看高品質(zhì)畫面將成為現(xiàn)實,而這作為靜態(tài)網(wǎng)頁的優(yōu)勢將不再構(gòu)成優(yōu)勢。在未來雖然

25、純Flash網(wǎng)站不可能代替靜態(tài)網(wǎng)站,但Flash網(wǎng)站的優(yōu)勢卻依舊是靜態(tài)網(wǎng)站無法匹及的。</p><p>  1.3 關(guān)于本課題</p><p>  學(xué)生時代是每一個人所共有的美好回憶,經(jīng)常我們可以看到在畢業(yè)即將到來的時候,很多同學(xué)開始互相發(fā)同學(xué)錄,給同學(xué)留言,合影留念,這些種種跡象表明,大家對自己的班級同學(xué)的感情不言而喻。而如今Flash網(wǎng)站的發(fā)展,使得人們對Flash網(wǎng)站的認(rèn)知認(rèn)可度越

26、來越高。Flash網(wǎng)站相對于普通靜態(tài)網(wǎng)站的優(yōu)勢特點越來越明顯的顯露出來。本課題即是用Flash來制作一個以班級回憶和介紹班級同學(xué)為主題的Flash網(wǎng)站。既要體現(xiàn)出對學(xué)生時代的回憶,感情,渲染出當(dāng)年的青澀氛圍,同時也要借助Flash的優(yōu)勢,體現(xiàn)出很好的人機交互性,F(xiàn)lash的視覺,聽覺多方面的沖擊力。整個Flash網(wǎng)站中的大部分圖片,音樂數(shù)據(jù)將由外部載入,而文字部分則建立在XML的基礎(chǔ)上,由外部進行導(dǎo)入。</p><p

27、>  1.4 本論文所涉及內(nèi)容</p><p>  本論文主要是將作者在制作本Flash網(wǎng)站中的一些技術(shù)層面上的問題一一寫出來,介紹整個網(wǎng)站的結(jié)構(gòu)布局,設(shè)計思路,最后寫出作者自己的感觸以及對幫助者的感謝。</p><p>  第二章 開發(fā)平臺與所用技術(shù)</p><p><b>  2.1 開發(fā)工具</b></p><

28、;p>  本網(wǎng)站的開發(fā)工具為Adobe Flash CS5.5 Professional 和 Adobe Photoshop CS4 Professional。</p><p>  2.1.1 Adobe Flash CS5.5 Professional</p><p>  Adobe Flash(原稱Macromedia Flash,簡稱Flash;前身FutureSplash),

29、是 美國 Macromedia公司(現(xiàn)在已被Adobe公司收購)所設(shè)計的一種二維動畫軟件。通常包括Macromedia Flash,用于設(shè)計和編輯Flash文檔,以及Adobe Flash Player,用于播放Flash文檔。</p><p>  2.1.2 Adobe Photoshop CS4 Professional </p><p>  Photoshop是Adobe公司旗下最為

30、出名的圖像處理軟件之一。集圖像掃描、編輯修改、圖像制作、廣告創(chuàng)意,圖像輸入與輸出于一體。Photoshop的應(yīng)用領(lǐng)域很廣泛,在圖像、圖形、文字、視頻、出版各方面都有涉及。</p><p><b>  2.2 所用技術(shù) </b></p><p>  本網(wǎng)站實現(xiàn)除了大量應(yīng)用了Flash對其主要框架以及效果的構(gòu)造制作,以及Photoshop對網(wǎng)站圖片的制作修改外,還使用了X

31、ML在Flash中的載入、讀取和解析。</p><p>  當(dāng)使用HTML顯示數(shù)據(jù)時,數(shù)據(jù)將被存儲在HTML中。通過XML,數(shù)據(jù)可以被單獨儲存在XML文件中。通過這種方法,你就可以一心一意地使用HTML對數(shù)據(jù)進行排版和顯示,對基本數(shù)據(jù)的改變并不需要對HTML做出任何改變。</p><p>  通過使用XML,可以使用普通的文本文件儲存數(shù)據(jù)。</p><p>  XM

32、L可以在文件或數(shù)據(jù)庫中儲存數(shù)據(jù)。應(yīng)用軟件可以從已存儲的數(shù)據(jù)中儲存、獲取信息。一般的應(yīng)用軟件可以用于顯示數(shù)據(jù)。</p><p><b>  第三章 網(wǎng)站規(guī)劃</b></p><p>  3.1 網(wǎng)站結(jié)構(gòu)圖</p><p>  Flash網(wǎng)站區(qū)別的普通的靜態(tài)網(wǎng)站,所以在結(jié)構(gòu)上小有所區(qū)別。但在在外觀上,區(qū)別于大多數(shù)靜態(tài)網(wǎng)站的規(guī)則布局。以獨特的樣式

33、顯示,這樣可以使每一個游覽者可以更好的去感受網(wǎng)站所要表達的信息。本網(wǎng)站的結(jié)構(gòu)圖如圖3-1所示:</p><p>  圖3-1 Flash網(wǎng)站的基本結(jié)構(gòu)</p><p><b>  3.2 網(wǎng)站內(nèi)容</b></p><p>  本Flash網(wǎng)站共有3個Flash界面,主要內(nèi)容有:關(guān)于我們、照片、聯(lián)系我們這3個模塊,整個網(wǎng)站的內(nèi)容結(jié)構(gòu)如圖3-2所

34、示</p><p>  圖3-2 內(nèi)容規(guī)劃結(jié)構(gòu)圖</p><p>  3.3 網(wǎng)站效果圖</p><p>  圖3-3為引導(dǎo)頁面,游覽者在欣賞完一段小動畫后自動進入網(wǎng)站。該動畫模仿鼠標(biāo)點擊的樣式,從一開始就給瀏覽者了一種視覺的沖擊,這樣可以使瀏覽者對接下瀏覽產(chǎn)生很強的興趣。</p><p>  圖3-3 引導(dǎo)頁面</p>&

35、lt;p>  圖3-4為主頁面。該頁面以一個相冊的形式呈現(xiàn)在瀏覽者的面前,不同于以往普通的靜態(tài)網(wǎng)站的格調(diào)布局,這種新鮮感的創(chuàng)新,不僅呈現(xiàn)了網(wǎng)站所要表達的主題,也將Flash網(wǎng)站的視覺沖擊展露無遺。而且,此時再配以背景音樂的渲染,使得效果更加完美。</p><p><b>  圖3-4 主頁面</b></p><p>  圖 3-5 關(guān)于我們頁面,照片固然直觀,

36、但是,卻比不上文字的細(xì)膩,所以,在介紹班級同學(xué)的這一塊,作者選擇了使用文字來進行表達,瀏覽者在瀏覽的時候,可以拖動文字旁邊的滾動條來瀏覽相關(guān)的內(nèi)容。</p><p>  圖3-5 關(guān)于我們頁面</p><p>  圖3-6為相冊頁面,前面也說到了,照片總是給人以最直觀的感受,所以,除了主頁面上的照片的外,這里是一個照片的詳細(xì)查看。瀏覽者不僅可以點擊主頁面上的照片進入到相應(yīng)的照片內(nèi)容,也可以

37、進入相冊模塊,來進行照片的瀏覽。</p><p><b>  圖3-6 照片頁面</b></p><p>  圖3-7 為聯(lián)系我們頁面,一個網(wǎng)站,必須要有一個聯(lián)系的方式,這樣既有利于網(wǎng)站今后的維護與發(fā)展,也有利于了解瀏覽者的建議以及意見。本Flash網(wǎng)站的聯(lián)系模塊是讓瀏覽者輸入瀏覽者的相關(guān)聯(lián)系方式和對網(wǎng)站的建議意見,或其他留言,然后通過發(fā)送到作者的郵箱來實現(xiàn)的。 &l

38、t;/p><p>  圖3-7 聯(lián)系我們頁面</p><p>  第四章 網(wǎng)站程序?qū)崿F(xiàn)</p><p><b>  4.1 整體設(shè)計</b></p><p>  本Flash網(wǎng)站的主題是對班級的回憶以及展示,介于Flash網(wǎng)站它不受限于傳統(tǒng)靜態(tài)網(wǎng)站的布局格式。本網(wǎng)站采取了一個以晾曬照片為主要背景的一種方式。設(shè)計新穎,瀏覽

39、者可以在初次進入網(wǎng)站就有種眼前一亮的感覺。而照片總是可以給人以最直觀的感受,再輔以背景音樂,可以使瀏覽者切身體會到作者班級的氛圍,仿佛置身于當(dāng)年的學(xué)生時代。這種設(shè)計將本網(wǎng)站所要表達的信息可以很好的表達出來。當(dāng)然了,在直觀的照片給予瀏覽者一定的了解后,文字部分可以讓瀏覽者了解更多有關(guān)作者班級的信息。最后的一個聯(lián)系途徑,可以讓瀏覽者留下自己的聯(lián)系發(fā)與作者的郵箱,便于今后的交流。</p><p><b>  

40、4.2 網(wǎng)站設(shè)計</b></p><p>  4.2.1 引導(dǎo)頁設(shè)計</p><p>  引導(dǎo)頁的作用:Flash動畫能帶來視覺的沖擊!本網(wǎng)站的引導(dǎo)動畫實為一個逐幀動畫,模仿鼠標(biāo)點擊,打開網(wǎng)頁的效果!。大致的設(shè)計步驟如下:</p><p>  1.新建Flash文檔,命名為index.fla。</p><p>  2.創(chuàng)建76

41、6 × 750的背景,將背景圖片(bg1.png)導(dǎo)入到庫中,將圖片放與舞臺中央。</p><p>  3.新建一個圖層,命名為mouse,制作一個鼠標(biāo)的樣子和鼠標(biāo)經(jīng)過的時候殘影的圖樣,在第28幀和第87幀間每一幀定義為關(guān)鍵幀,在此區(qū)間定義鼠標(biāo)從背景右下角移動至中間的每一個位置。在每一幀做相應(yīng)的設(shè)計即可。</p><p>  4.2.2 導(dǎo)航的設(shè)計</p><

42、;p>  導(dǎo)航的作用:一個網(wǎng)站必須需要一個導(dǎo)航條,這樣才能方便瀏覽者去查看想查看的內(nèi)容,F(xiàn)lash網(wǎng)站雖然在外觀形式上不拘一格,但是,依舊需要一個導(dǎo)航條。</p><p>  本Flash網(wǎng)站的導(dǎo)航條為一個逐幀動畫,三個導(dǎo)航按鈕,依次出來。每個按鈕分配有鼠標(biāo)交互功能,即點擊,并放開鼠標(biāo)后,出現(xiàn)的交互動畫!點擊后,要進入相應(yīng)的頁面,大致的設(shè)計步驟如下:</p><p>  1制作一個菜

43、單的元件(menu2),里面分別添加三個按鈕的圖層(item1、 item2、 item3),制作后如圖4-1所示:</p><p><b>  圖4-1 添加圖層</b></p><p>  2 給這三個按鈕分別寫入相應(yīng)的代碼,這里以關(guān)于我們?yōu)槔▓D4-2):</p><p>  2.1 _root.gotoAndPlay("s1

44、"); </p><p>  // 主時間軸跳轉(zhuǎn)到"s1"</p><p>  2.2 分別給三個參數(shù)(在主時間軸第一幀已經(jīng)定于并且賦值)</p><p>  _root.url = "pages1"; // 傳遞參數(shù),對應(yīng)庫里的標(biāo)志符為pages1的電影剪輯(MC),即主時間軸attachMovie 電影剪輯

45、 pages1到主舞臺!</p><p>  _root.x_ = 140;</p><p>  _root.y_ = 200;</p><p>  //此兩變量,當(dāng)pages賦值到 舞臺后(_root),設(shè)置其x和y坐標(biāo)</p><p>  圖4-2 關(guān)于我們按鈕的代碼</p><p>  4.2.3 滾動條的設(shè)計

46、</p><p>  滾動條的作用:關(guān)于我們的頁面中,在對班級同學(xué)進行介紹的時候,一個小小的頁面加載那么多字?jǐn)?shù)的文本后,難以查閱,這對瀏覽者來說是一個不方便地方。所以,一個文本的滾動條在這里就顯得尤為重要。滾動條的設(shè)計過程如下:</p><p>  創(chuàng)建動態(tài)文本框,命名為abouttxt.(圖4-3)</p><p>  圖4-3 動態(tài)文本框abouttxt<

47、/p><p>  2.在文件夾根目錄下創(chuàng)建xml文件命名為contents.xml,并在影片剪輯關(guān)于我們2的圖層2幀1上寫下如下代碼:</p><p>  activity = new XML ();</p><p>  activity.load ("contents.xml");</p><p>  activity.ig

48、noreWhite = true;</p><p>  activity.onLoad = function (success) {</p><p>  if (success){</p><p>  var news:XMLNode = this.firstChild;</p><p>  abouttxt.htmlText=news.ch

49、ildNodes[0];</p><p>  abouttxt.height=1000;</p><p><b>  }</b></p><p><b>  }</b></p><p>  3.打開contents.xml,并設(shè)置動態(tài)文本框abouttxt的html里面的Text內(nèi)容為content

50、s.xml文件中第一個節(jié)點的內(nèi)容。</p><p>  4.選中動態(tài)文本框abouttxt,然后打開組件面板,將窗口—組件—Interface里面的UIScrollBar組件(圖4-5)拖動到動態(tài)文本框abouttxt上,然后調(diào)整UIScrollBar的位置即可。</p><p>  圖4-5 UIScrollBar組件</p><p>  4.2.4 XML外部

51、載入實現(xiàn)</p><p>  XML外部導(dǎo)入的作用:對于一個網(wǎng)站,里面肯定有著許多的信息,無論圖片還是文字,而對于AS2.0,最好的數(shù)據(jù)處理就是xml,本Flash網(wǎng)站,也是利用xml數(shù)據(jù)格式。為了便于修改,用了txt文本裝載。大致的設(shè)計步驟如下:</p><p>  1.先編輯好xml樹結(jié)構(gòu),如下所示:</p><p>  <?xml version=&qu

52、ot;1.0" encoding="UTF-8"?></p><p><b>  <gallery></b></p><p>  <images url="images/1.jpg"></images></p><p>  <images url=

53、"images/2.jpg"></images></p><p>  <images url="images/3.jpg"></images></p><p>  <images url="images/4.jpg"></images></p><

54、;p>  <images url="images/5.jpg"></images></p><p>  <images url="images/6.jpg"></images></p><p>  <images url="images/7.jpg"></im

55、ages></p><p>  <images url="images/8.jpg"></images></p><p>  <about url1="images/a1.jpg" url2="images/a2.jpg" url3="images/a3.jpg">&l

56、t;/about></p><p>  <contact url1="images/c1.jpg"></contact></p><p>  </gallery></p><p><b>  2 數(shù)據(jù)處理部分</b></p><p>  (1)建立一個xml對

57、象,并且忽視空白(即不將xml里的空格鍵當(dāng)成數(shù)據(jù)加載),下載幀1動作里面,具體代碼如下所示:</p><p>  var photoxml = new XML();</p><p>  photoxml.ignoreWhite = true;</p><p>  photoxml.load("data.txt");</p><

58、p>  photoxml.onLoad = function(done) {</p><p>  if (done) {</p><p>  dataset();</p><p>  com = true;</p><p><b>  } else {</b></p><p>  trace

59、("lost");</p><p><b>  }</b></p><p><b>  };</b></p><p>  (2)通過自定義 dataset()函數(shù)處理數(shù)據(jù),本Flash網(wǎng)站的xml只采取一個層級,所以,只需用到一個for循環(huán),即可將所有數(shù)據(jù)讀取并且裝載到相應(yīng)的數(shù)組,相關(guān)代碼如下:<

60、/p><p>  function dataset() {</p><p>  var list = photoxml.firstChild.childNodes;</p><p>  listlen = list.length;</p><p>  trace(listlen);</p><p>  for (k=0;

61、k<=listlen; k++) {</p><p>  if (k<=7) {</p><p>  phobox[k] = list[k].attributes.url;</p><p>  } else if (k == 8) {</p><p>  trace("關(guān)于我們讀取成功");</p>

62、<p>  aboutbox[0] = list[8].attributes.url1;</p><p>  trace(aboutbox[0]);</p><p>  aboutbox[1] = list[8].attributes.url2;</p><p>  aboutbox[2] = list[8].attributes.url3;</

63、p><p>  } else if (k == 9) {</p><p>  trace("聯(lián)系我們讀取成功");</p><p>  contactbox[0] = list[9].attributes.url1;</p><p><b>  }</b></p><p><

64、b>  }</b></p><p><b>  }</b></p><p>  (3)onLoad 方法的功能。</p><p>  通過onLoad方法,偵聽xml內(nèi)容是否加載完畢,當(dāng)加載完畢后,運行dataset()自定義函數(shù)并且處理數(shù)據(jù)。</p><p>  4.2.5 相冊的翻頁設(shè)計</

65、p><p>  相冊的作用:本Flash網(wǎng)站介于是對班級的介紹,而照片是可以讓瀏覽者最直觀的了解信息的途徑之一,而且本Flash網(wǎng)站的就是以一個曬照片的外觀作為背景,所以相冊即是本Flash網(wǎng)站一個亮點之所在。</p><p>  本Flash網(wǎng)站相冊一次顯示4張照片,表現(xiàn)了Flash在交互動畫方面的強大功能。本Flash網(wǎng)站相冊大致設(shè)計過程如下:</p><p>  

66、1 動畫的制作和排版如圖4-6所示:</p><p>  圖4-6 相冊影片剪輯時間軸</p><p>  這里面photo1到photo4為4個空白的電影剪輯,主要用來加載相片;分別命名為pics1,pics2,pics3,pics4;as層為代碼層;3個masker 層,為遮罩動畫。</p><p><b>  2 代碼的控制</b><

67、;/p><p><b>  (1)圖片的加載</b></p><p>  pics1.loadMovie(_root.phobox[_parent.m1]);</p><p>  Pics2.loadMovie(_root.phobox[_parent.m2]);</p><p>  Pics3.loadMovie(_roo

68、t.phobox[_parent.m3]);</p><p>  Pics4.loadMovie(_root.phobox[_parent.m4]);</p><p>  // 此處的代碼,是分別給4個空白電影剪輯加載4張圖片!其中變量_parent.m1,_parent.m2,</p><p>  _parent.m3,_parent.m4 的初始值為,0,1,2

69、,3</p><p><b> ?。?)翻頁的控制:</b></p><p><b>  stop(); </b></p><p>  // 在此幀停止播放,并運行一下代碼。</p><p>  _parent.m1++;</p><p>  if (_parent.m1&g

70、t;=8) {</p><p>  _parent.m1 = 0;</p><p><b>  }</b></p><p>  _parent.m2++;</p><p>  if (_parent.m2>=8) {</p><p>  _parent.m2 = 0;</p>

71、<p><b>  }</b></p><p>  _parent.m3++;</p><p>  if (_parent.m3>=8) {</p><p>  _parent.m3 = 0;</p><p><b>  }</b></p><p>  _pa

72、rent.m4++;</p><p>  if (_parent.m4>=8) {</p><p>  _parent.m4 = 0;</p><p><b>  }</b></p><p>  // _parent.m1,_parent.m2,_parent.m3,_parent.m4每次都遞增1,當(dāng)大于或等于8

73、的時候,重新賦值為0,</p><p> ?。?)按鈕的控制:按鈕的控制非常簡單,每次點擊,都跳轉(zhuǎn)到第一幀,并重新播放。</p><p>  on (release) {</p><p>  gotoAndPlay(1);</p><p><b>  }</b></p><p>  4.2.6

74、郵件發(fā)送的實現(xiàn)</p><p>  聯(lián)系的作用:一個網(wǎng)站,為了可以和用戶瀏覽者有更好的交流,需要留下一些聯(lián)系的方式,本Flash網(wǎng)站也不例外。網(wǎng)站專門設(shè)置了一個聯(lián)系的模塊,方便瀏覽者與網(wǎng)站制作者進行聯(lián)系,留言。該模塊設(shè)置理念是瀏覽者將自己的相關(guān)信息和留言內(nèi)容輸入后,通過發(fā)送,可以將內(nèi)容直接發(fā)送到作者郵箱,這樣,作者可以通過瀏覽者留下的聯(lián)系方式與瀏覽者進行聯(lián)系,也可以就瀏覽者的留言對網(wǎng)站的合理化建議或其它種種對網(wǎng)站

75、進行相關(guān)的修改與更新,總之,聯(lián)系是一個網(wǎng)站不可或缺的一個因素。本Flash網(wǎng)站的聯(lián)系設(shè)計大致如下:</p><p>  1.分別創(chuàng)建動動態(tài)文本框Username, Useremail, UserTel, Usermessage(圖4-7)。</p><p>  圖4-7 創(chuàng)建動態(tài)文本框</p><p>  2.然后創(chuàng)建重寫按鈕與發(fā)送按鈕(圖4-8)</p>

76、;<p>  圖4-8 創(chuàng)建重寫按鈕</p><p>  3.選中重寫按鈕然后寫入代碼,當(dāng)重寫按鈕按下時,動態(tài)文本框中的text值都變?yōu)榭眨_到清空效果。所以在重寫按鈕中寫下如下代碼:</p><p>  on(press){</p><p>  username.text="";</p><p>  use

77、remail.text="";</p><p>  usertel.text="";</p><p>  usermessage.text="";</p><p><b>  }</b></p><p>  4.選中發(fā)送按鈕然后寫入代碼(與重寫安鈕一樣)當(dāng)發(fā)送按

78、鈕按下時,動態(tài)文本框username的text值賦值給變量username, 動態(tài)文本框useemail的text值賦值給變量useremail, 動態(tài)文本框usetel的text值賦值給變量usertel, 動態(tài)文本框usemessage的text值賦值給變量usermessage。然后將四個變量賦值給Contact.asp的四個參數(shù)。發(fā)送按鈕的代碼如下所示:</p><p>  on(press){</

79、p><p>  username=username.text;</p><p>  useremail=useremail.text;</p><p>  usertel=usertel.text;</p><p>  usermessage=usermessage.text;</p><p>  url="Co

80、ntact.asp?name=" + username + "&tel=" + usertel + "&email=" + useremail + "&message=" + usermessage;</p><p>  getURL(url,"_self");</p><p>

81、;<b>  }</b></p><p>  5.在Contact.asp文件中,讀取四個參數(shù),然后通過Jmail組件,發(fā)送到指定郵箱中。</p><p>  4.2.7 背景音樂的控制</p><p>  背景音樂的作用:Flash除了在視覺上給人以沖擊之外,在聽覺上也給人一種享受,本Flash網(wǎng)站為了給瀏覽者渲染一種更好的氛圍,特意設(shè)置了

82、背景音樂。這樣,瀏覽者在瀏覽網(wǎng)頁的途中,不但可以感受到Flash帶來的視覺體驗,也能在聽覺上,得到不一樣的享受。當(dāng)然了,所謂眾口難調(diào),本Flash網(wǎng)站就這人性化的特點,在背景音樂的控制上,制作了音樂的開關(guān),歌曲的選擇,盡最大程度的滿足瀏覽者群體。背景音樂的大致設(shè)計步驟如下:</p><p><b>  1.初始化:</b></p><p>  首先在動畫的第一幀建立聲

83、音對象,并加載聲音,并播放,如下代碼</p><p>  var mysound = new Sound();</p><p>  mysound.loadSound("bgsound/1.mp3",true);</p><p>  mysound.start();</p><p><b>  2.聲音的控制:&

84、lt;/b></p><p>  建立4個按鈕和一個音頻動畫電影剪輯,如圖4-9所示:</p><p>  圖4-9 音樂開關(guān)和控制按鈕</p><p>  其中關(guān)閉音樂按鈕是停止聲音的播放,并且停止音頻動畫電影剪輯(命名為:equalizer)的播放,代碼如下:</p><p>  on(release) {</p>&

85、lt;p>  gotoAndStop(2);</p><p>  _root.soundstatus="off";</p><p>  equalizer.gotoAndStop(2);</p><p><b>  };</b></p><p>  1,2,3 這三個按鈕,是切換聲音的,代碼如下

86、所示:</p><p>  on (release) {</p><p>  _root.mysound.loadSound("bgsound/1.mp3",true);</p><p>  _root.mysound.start();</p><p><b>  }</b></p>&

87、lt;p>  on (release) {</p><p>  _root.mysound.loadSound("bgsound/2.mp3",true);</p><p>  _root.mysound.start();</p><p><b>  }</b></p><p>  on (re

88、lease) {</p><p>  _root.mysound.loadSound("bgsound/3.mp3",true);</p><p>  _root.mysound.start();</p><p><b>  }</b></p><p>  4.2.8 進度條的實現(xiàn)</p>

89、;<p>  進度條的作用:當(dāng)網(wǎng)站的規(guī)模達到一定的時候,加載文件就需要一定的時間,所以,一個進度條,可以讓網(wǎng)站在加載的時候有一個動畫的顯示,這樣可以讓瀏覽者有一個等待的過程,不至于離開瀏覽,所以,一個進度條的設(shè)置就顯得尤其重要,下面是本Flash進度條的大致設(shè)計步驟:</p><p>  1.制作一個進度條的外觀動作如圖4-10所示:</p><p>  圖4-10 進度條的

90、外觀</p><p>  2.在影片剪輯preloader_main中填入如下代碼:</p><p>  onClipEvent (load) {</p><p>  total = _root.getBytesTotal();</p><p><b>  }</b></p><p>  onCl

91、ipEvent (enterFrame) {</p><p>  loaded = _root.getBytesLoaded();</p><p>  percent = int(loaded/total*100);</p><p>  text = percent+"%";</p><p>  //trace(perce

92、nt)</p><p>  this.gotoAndStop(percent);</p><p>  if (loaded == total && total>380 && a<>1 && _root.com == true) {</p><p><b>  a = 1;</b>

93、</p><p>  _root.gotoAndPlay("s8");</p><p><b>  }</b></p><p><b>  }</b></p><p><b>  Flash 發(fā)布</b></p><p>  Flas

94、h發(fā)布是整個Flash網(wǎng)站制作的最后一步,F(xiàn)lash網(wǎng)站畢竟要是在游覽器中顯示的,所以最后這一步也顯得極為重要 。本Flash網(wǎng)站由于是在一個.fla文件中制作的,所以只需要發(fā)布一個文件即可。</p><p>  1.選擇“文件”中的“發(fā)布設(shè)置”,如圖5-1所示:</p><p><b>  圖5-1 發(fā)布設(shè)置</b></p><p>  2.

95、發(fā)布以后,在發(fā)布的html文件中的<body></body>添加一段代碼,保證網(wǎng)頁顯示在屏幕中央,一些不需要顯示的東西隱藏起來,具體代碼如下:</p><p>  <table width="100%" border="0" cellspacing="0" cellpadding="0" align=&

96、quot;center"></p><p><b>  第六章 總結(jié)</b></p><p><b>  6.1 個人總結(jié)</b></p><p>  本次畢業(yè)設(shè)計,也是我大學(xué)學(xué)習(xí)里面的最后一個“作業(yè)”。在老師和同學(xué)的幫助下,磕磕碰碰,跌跌撞撞的總算完成了。雖然Flash并不是我所擅長的,而且學(xué)校的課程

97、中也沒有這門課。但是,既然接下來了這個任務(wù),就必須將它完成好。也許這次設(shè)計是我這四年以來最好的一個設(shè)計作品。我盡我所能,從網(wǎng)絡(luò),書籍中找尋如何制作Flash 的方法。我很用心地去學(xué)、去查、去問、去做、去寫,這期間我獲得了不小的進步,加深了對Flash的理解,以及對制作網(wǎng)站的熟練度??墒菚r間的問題,技術(shù)的問題,以及一些客觀原因。我制作的Flash網(wǎng)站有著許多粗糙不足的地方,沒有達到我最初希望的那樣好。但是,這里面有著我的汗水,我的投入,我

98、希望這次設(shè)計能得到最后評審老師的認(rèn)可。</p><p>  在程序方面,我制作的這個網(wǎng)站還可以繼續(xù)改進。網(wǎng)站的內(nèi)容可以更加的豐富,動畫的表達方式可以更加豐富,對于功能方面,還可以加入一些內(nèi)容,比如全屏的設(shè)計等等,可是,時間的原因,來不及制作了,這也是我這次設(shè)計中的遺憾。</p><p>  在論文方面,還有很多的技術(shù)點沒有詳細(xì)說明與介紹;已寫出的技術(shù)也應(yīng)該可以寫得更加詳細(xì);圖片部分應(yīng)該可以

99、做得更加精致美觀;最后是文字部分,很多地方我的表達還是不夠好,應(yīng)該可以做的更好。</p><p>  畢業(yè)將至,以上諸般的遺憾與想法,可能都將無法再改變了,但看到我的作品完成,我還是有一種小小的成就成就感。這是我的第一個Flash網(wǎng)站,雖然沒有完全完成,但是還是實現(xiàn)了大部分的功能。論文雖然寫得不夠詳細(xì)明了,但這篇文章詳細(xì)記錄了我的制作過程以及我的種種感觸。希望在今后進入社會以后,這次的設(shè)計能給我一種鼓勵與支持,只

100、要用心,努力,下功夫,沒有什么事情能難倒我的。</p><p>  6.2 制作過程中遇到的問題和解決方法</p><p>  1.外部加載Xml中的中文字體無法在Flash中正確顯示,發(fā)現(xiàn)了這一個問題以后,我去了網(wǎng)站上找尋解決方法。可是始終無法解決,后來在老師的幫助下,發(fā)現(xiàn)了一個小細(xì)節(jié)沒有注意到,首先,要把Xml編碼格式改為UTF-8,這點網(wǎng)站上有很多說明,但是,有一個關(guān)鍵點是,在保存

101、Xml文件的時候,不能簡簡單單單獨點擊一個保存,要另存為,在存儲格式里面也要選擇UTF-8,這個小小的關(guān)鍵點取決于最后是否能夠正確的加載。</p><p>  2.代碼的書寫位置不正確,在制作按鈕的過程中,經(jīng)常在編輯完按鈕,開始往里面添加代碼的時候,發(fā)生了按鈕依舊沒有作用的效果,后來,經(jīng)過我上網(wǎng)查詢資料和求助于老師和同學(xué),我知道了原來按鈕的代碼要直接寫在按鈕上,而不是單單的直接寫在幀的上面,這一點直接取決于按鈕的

102、作用是否能實現(xiàn)。</p><p>  6.3 網(wǎng)站改進方向</p><p>  本Flash網(wǎng)站雖然實現(xiàn)了幾個基本的功能,但是,全屏的功能沒有能夠?qū)崿F(xiàn),這是一個遺憾,也是本Flash網(wǎng)站今后可以更新完善的地方。至于網(wǎng)站的內(nèi)容,還可以更加豐富,這次是時間的因素,沒有來的及取材,這也是一個改進的方向。網(wǎng)站的背景也許有些單調(diào),今后可以改進一下,使得整體看起來更加生動形象。</p>

103、<p>  Flash網(wǎng)站的搜索引擎本次因為時間的原因,沒有來得及制作。Flash網(wǎng)站的搜索引擎由于它自身的原因,難以優(yōu)化。所以,今后可以考慮并解決Flash網(wǎng)站的SEO(Search Engine Optimization)問題。</p><p><b>  參考文獻</b></p><p>  [1] 周從軍.XML程序設(shè)計[M].天津大學(xué)出版社,20

104、08.8</p><p>  [2] 顏金沙.閃客實戰(zhàn)—flash高級編程[M].電子工業(yè)出版社,2010.7</p><p>  [3] 龍曉苑. Flash AS 3.0動畫制作[M]. 清華大學(xué)出版社,2008.5</p><p>  [4] 朱志國. Flash Action Script 3.0編》程技術(shù)教程[M].清華大學(xué)出版社,2009.6</p

105、><p>  [5] 田啟明. Flash CS3平面動畫制作案例教程與實訓(xùn)[M].北京出版社,2008.3</p><p>  [6] 方晨. Photoshop CS3 中文版標(biāo)準(zhǔn)教程[M].上海科學(xué)普及出版社,2009.6</p><p>  [7] 何錚.網(wǎng)站設(shè)計手冊[M].中國水利水電出版社,2009.8</p><p>  [8] 張

106、春龍.網(wǎng)頁制作工具教程[M].中國電力出版社,2008.1</p><p>  [9] 王汝義. Flash網(wǎng)站建設(shè)技術(shù)精粹[M].人民郵電出版社,2007.4</p><p>  [10] 張楠.網(wǎng)頁設(shè)計基礎(chǔ)教程與上機指導(dǎo)[M].清華大學(xué)出版社,2006.11</p><p><b>  致 謝</b></p><p

107、>  首先感謝我的指導(dǎo)老師xx老師對我的循循善誘和細(xì)心教導(dǎo),她嚴(yán)謹(jǐn)?shù)闹螌W(xué)態(tài)度、對問題不解決決不罷休的態(tài)度以及對我們的耐心深深感染著我,這將為我今后進入社會,面對未知道路上的種種提供了無盡的幫助。當(dāng)然,也要感謝所有關(guān)心過和幫助過我的老師與同學(xué),因為你們,我的設(shè)計才能如此順利的完成。</p><p><b>  附 錄</b></p><p><b>

108、;  html文件代碼:</b></p><p><b>  <html></b></p><p><b>  <head></b></p><p>  <meta http-equiv="Content-Type" content="text/htm

109、l; charset=gb2312"></p><p>  <title>我的班級</title></p><p><b>  </head></b></p><p><b>  <body></b></p><p>  <tab

110、le width="100%" border="0" cellspacing="0" cellpadding="0" align="center"></p><p><b>  <tr></b></p><p>  <td align=&quo

111、t;center"><object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,29,0" width="766"

112、height="750"></p><p>  <param name="movie" value="index.swf"></p><p>  <param name="quality" value="high"></p><p>  

113、<embed src="index.swf" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="766" height="750"

114、></embed></p><p>  </object></td></p><p><b>  </tr></b></p><p><b>  </table></b></p><p><b>  </body>

115、;</b></p><p><b>  </html></b></p><p><b>  圖層1 幀1代碼</b></p><p><b>  stop();</b></p><p>  var ck = 0;</p><p>

116、  var con = false;</p><p>  var com = false;</p><p>  var conk = 0;</p><p>  var url = "xc";</p><p>  var x_ = 373;</p><p>  var y_ = 370;</p&

117、gt;<p>  //Stage.align = "TL";</p><p>  Stage.scaleMode = "noScale";</p><p>  var phobox:Array = new Array();</p><p>  var aboutbox:Array = new Array();&l

118、t;/p><p>  var contactbox:Array = new Array();</p><p>  var photoxml = new XML();</p><p>  photoxml.ignoreWhite = true;</p><p>  photoxml.load("data.txt");</p

119、><p>  photoxml.onLoad = function(done) {</p><p>  if (done) {</p><p>  dataset();</p><p>  com = true;</p><p><b>  } else {</b></p><p&

120、gt;  trace("lost");</p><p><b>  }</b></p><p><b>  };</b></p><p>  function dataset() {</p><p>  var list = photoxml.firstChild.childNo

121、des;</p><p>  listlen = list.length;</p><p>  trace(listlen);</p><p>  for (k=0; k<=listlen; k++) {</p><p>  if (k<=7) {</p><p>  phobox[k] = list[k]

122、.attributes.url;</p><p>  } else if (k == 8) {</p><p>  trace("關(guān)于我們讀取成功");</p><p>  aboutbox[0] = list[8].attributes.url1;</p><p>  trace(aboutbox[0]);</p&

123、gt;<p>  aboutbox[1] = list[8].attributes.url2;</p><p>  aboutbox[2] = list[8].attributes.url3;</p><p>  } else if (k == 9) {</p><p>  trace("聯(lián)系我們讀取成功");</p>

溫馨提示

  • 1. 本站所有資源如無特殊說明,都需要本地電腦安裝OFFICE2007和PDF閱讀器。圖紙軟件為CAD,CAXA,PROE,UG,SolidWorks等.壓縮文件請下載最新的WinRAR軟件解壓。
  • 2. 本站的文檔不包含任何第三方提供的附件圖紙等,如果需要附件,請聯(lián)系上傳者。文件的所有權(quán)益歸上傳用戶所有。
  • 3. 本站RAR壓縮包中若帶圖紙,網(wǎng)頁內(nèi)容里面會有圖紙預(yù)覽,若沒有圖紙預(yù)覽就沒有圖紙。
  • 4. 未經(jīng)權(quán)益所有人同意不得將文件中的內(nèi)容挪作商業(yè)或盈利用途。
  • 5. 眾賞文庫僅提供信息存儲空間,僅對用戶上傳內(nèi)容的表現(xiàn)方式做保護處理,對用戶上傳分享的文檔內(nèi)容本身不做任何修改或編輯,并不能對任何下載內(nèi)容負(fù)責(zé)。
  • 6. 下載文件中如有侵權(quán)或不適當(dāng)內(nèi)容,請與我們聯(lián)系,我們立即糾正。
  • 7. 本站不保證下載資源的準(zhǔn)確性、安全性和完整性, 同時也不承擔(dān)用戶因使用這些下載資源對自己和他人造成任何形式的傷害或損失。

最新文檔

評論

0/150

提交評論