當前位置:編程學習大全網 - 人物素材 - 誰知道flash網頁制作教程

誰知道flash網頁制作教程

Flash網站制作剖析

經過壹段時間的Flash學習之後,很多朋友開始對那些全Flash網站的制作發生興趣。全Flash網站基本以圖形和動畫為主,所以比較適合做那些文字內容不太多,以平面、動畫效果為主的應用。如:企業品牌推廣、特定網上廣告、網絡遊戲、個性網站等。

制作全Flash網站和制作html網站類似,事先應先在紙上畫出結構關系圖,包括:網站的主題、要用什麽樣的元素、哪些元素需要重復使用、元素之間的聯系、元素如何運動、用什麽風格的音樂、整個網站可以分成幾個邏輯塊、各個邏輯塊間的聯系如何、以及妳是否打算用Flash建構全站或是只用其做網站的前期部分等等,都應在考慮範圍之內。

從技術方面講,如果妳已經掌握了不少單個Flash作品的制作方法,再多了解壹些swf文件之間的調用方法,制作全Flash網站並不會太復雜。

參考流程:網站結構規劃—>Flash場景規劃—>素材準備—>分別制作—>整體整合

壹、全Flash網站和單個Flash作品制作的區別

二、常用技術

1、重要ActionScript代碼控制

2、Loading的制作

3、文本導入

三、實例制作剖析

1、本實例網站結構規劃

2、首頁場景index.swf的制作

3、次場景Cartoon(200208.swf)的制作

4、二級次場景(200208_frog01~200208_frog05)制作

5、About中的文本導入

四、註意事項

以上我們通過實例剖析的方式大略介紹了全Flash網站的基本制作方法,希望給喜歡Flash的朋友們壹點實實在在的幫助,期望不久以後能看到大家做出的精彩Flash網站!本文Flash網站實例源文件下載

壹、全Flash網站和單個Flash作品制作的區別

1、文件結構不同

單個Flash作品的場景、動畫過程及內容都在壹個文件內,而全Flash網站的文件由若幹個文件構成,並且可以隨發展的需要繼續擴展。全Flash網站的文件動畫分別在各自的對應文件內。通過Action的導入和跳轉控制實現動畫效果,由於同時可以加載多個SWF文件,它們將重疊在壹起顯示在屏幕上。

2、制作思路不同

單個Flash作品的制作壹般都在壹個獨立的文件內,計劃好動畫效果隨時間線的變化或場景的交替變化即可。全Flash網站制作則更需要整體的把握,通過不同文件的切換和控制來實現全Flash網站的動態效果,要求制作者有明確的思路和良好的制作習慣。

3、文件播放流程不同

單個Flash作品通常需要將所以的文件做在壹個文件內,在觀看效果是必須等文件基本下載完畢才開始播放。但全Flash網站是通過若幹個文件結合在壹起,在時間流上更符合Flash軟件產品的特性。文件可以做的比較小,通過陸續載入其它文件更適合Internet的傳播,這樣同時避免了訪問者因等待時間過長而放棄瀏覽。

二、常用技術

1、重要ActionScript代碼控制

這是全Flash網站實現的關鍵,尤其是FlashMX新增了很多功能強大的命令,關於這部分,請大家可以參看看看其它的資料,這裏只介紹部分制作全Flash網站需要使用的比較重要的ActionScript函數。

loadMovieNum("url",level[,variables])

loadMovie("url",level/target[,variables])

功能說明:

在播放原來加載的影片的同時將SWF或JPEG文件加載進來。

參數說明:

url要加載的SWF或JPEG文件的絕對或相對URL,不能包含文件夾或磁盤驅動器說明。

level把swf文件以層的形式載入到Movie裏,若載入0層,則載入的swf文件將取代當前播放的Movie,。2層高於1層。

Target可用路徑拾取器取得並替換目標MC,載入的電影將擁有目標MC的位置、大小和旋轉角度等屬性。(個人認為用Target好些,在控制載入.swf位置時比較方便)

variables可選參數,指定發送變量所使用的網站類似,壹般我們會制作壹個主場景index.swf,主要內容包括:長寬比例、背景、欄目導航按鈕、網站名稱等“首頁”信息。最後發布成壹個html文件,或者自己做壹個html頁面,內容就是壹個表格,裏面寫上index.swf的嵌入代碼即可。

主場景安排:

藍色線條部分為網站名稱、版權等固定信息區,通常所在位置為Flash動畫的邊緣位置。

橙色線條內容為網站欄目導航按鈕,通常也是固定在某個區域。按鈕可以根據需要做成靜態或動態效果,甚至可以做成壹個包含MC變化的Button。

綠色線條部分為主場景導入子文件的演示區域。

在子文件的裝載方面主要用到:LoadMovieNum、UnloadMovieNum兩個控制函數,請參閱前文重要ActionScript代碼控制。

這裏我們以子欄目Cartoon的制作為例。主場景文件index中有壹個按鈕Cartoon,當我們點擊Cartoon按鈕時希望導入cartoon文件夾下的200208.swf文件。所以我們在場景內選擇Cartoon按鈕,添加Action代碼:

on(release){

loadMovieNum("cartoon/200208.swf",1);

unloadMovieNum(2);

}

註意這裏我們設置level為1。

3、次場景200208.swf的制作

現在確定Cartoon子欄目需要導入的文件200208.swf,該文件計劃包含5個子文件。所以200208.swf文件的界面只包含用於導入5個獨立子文件的5個圖形按鈕和壹個標題。

200208.swf

從圖上大家可以看到,200208.swf文件包含5個屬性為button的小圖標,分別為Bu_2_frog01到Bu_2_frog05。我們需要的效果是:點擊它們則分別導入相應文件200208_frog01.swf到200208_frog05.swf文件。

我們在場景內選擇Bu_2_frog01,為這個按鈕添加ActionScript:

on(release){

loadMovieNum("cartoon/200208_frog01.swf",2);

}

點擊Bu_2_frog02,為這個按鈕添加ActionScript:

on(release){

loadMovieNum("cartoon/200208_frog02.swf",2);

}

依次將5個button分別設置好相對應的action以便調用相應的文件。

註意:這裏我們設置level為2,是為了保留並區別主場景1而設置的導入的層次數,如果需要導入下壹級的層數,則層數增加為3,依次類推。

4、二級次場景(200208_frog01~200208_frog05)制作

這裏的二級次場景是與上級關聯的內容,是本例中三級結構中的最後壹級。該級主要為全Flash網站具體內容部分,可以是詳細的圖片、文字、動畫內容。這裏需要連接的是具體圖片為內容,但同樣需要做成與主場景比例同等的swf文件。例如:

200208_frog01

200208_frog02

該場景是最底層場景,為主體內容顯示部分,具體動畫效果大家可以根據需要做更深入。註意要在場景最後壹幀處加入停止ActionScript代碼:stop();這樣可以停止場景動畫的循環動作。

完整導入到主場景內的效果

5、About中的文本導入

查看本例的About子欄目,在文件index.fla裏設置About按鈕的action:

on(release){

loadMovieNum("aboutus.swf",1);

unloadMovieNum(2);

}

在aboutus.fla文件中做好顯示文本的文本框,文本框屬性設置為多行(Multiline),Var:aboutus(註意這個變量名)。

為文本框所在的幀加ActionScript代碼:

loadVariables("aboutus.txt","");

在aboutus.swf文件所屬目錄下編寫壹個純文本文件about.txt,文本開頭為“aboutus=”,“=”後面寫上正式的文本內容。

將文本文件完整導入到主場景內的效果

四、註意事項

1、註意所有子文件的長、寬屬性

全Flash網站從畫面層次來看,非常類似Photoshop的層結構,我們可以把每個子場景看做為壹個層文件,子文件是在背景的長寬範圍內出現。為了方便定位,我們可以讓子文件與主場景保持統壹的長寬比例,這樣非常便於版面安排。否則就必須用setProperty語句小心控制它們的位置。

2、發布文件時註意將html選項發布為透明模式

需要將每個子文件發布為透明模式的原因是不能讓子文件帶有背景底色,由於子文件的長寬比例與主場景基本是壹致的,如果子文件帶有底色,就會遮蓋主場景的內容。

設置方法:在發布設置裏勾選html選項,在html面板裏選擇windowsmode:TransparentWindowless,如圖。

3、使用文本導入時,註意文本文件開頭的內容必須是“與文本框屬性中Var定義名相同的字符串=正文”。另外需要導入文本的swf文件與被導入的txt文本文件最好在同壹目錄內。

4、註意仔細檢查文件之間的調用是否正確,避免出現“死鏈接”

  • 上一篇:二類電商信息流優化有什麽方法沒?
  • 下一篇:如何教學生寫作文時審題
  • copyright 2024編程學習大全網