| 三、實(shí)例制作剖析 一般制作流程: 網(wǎng)站結構規劃—> Flash場(chǎng)景規劃—>素材準備—>分別制作—>整體整合 1、本實(shí)例網(wǎng)站結構規劃 網(wǎng)站欄目:News、About、E-mail、Gallery、Cartoon、Animation 子欄目About:Feiying is、Member、Relationship、Contact Us ![]() 紅線(xiàn)部分構成主場(chǎng)景(舞臺),每個(gè)子欄目在首頁(yè)里僅保留名稱(chēng),屬性為按鈕。 藍線(xiàn)部分內容為次場(chǎng)景(演員),可以將次場(chǎng)景內容做在一個(gè)文件內,同時(shí)也可以做成若干個(gè)獨立文件,根據需要導入到主場(chǎng)景(舞臺)內。 2、首頁(yè)場(chǎng)景index.swf的制作 全Flash網(wǎng)站由主場(chǎng)景、子場(chǎng)景、次子場(chǎng)景……構成。 和制作html網(wǎng)站類(lèi)似,一般我們會(huì )制作一個(gè)主場(chǎng)景index.swf,主要內容包括:長(cháng)寬比例、背景、欄目導航按鈕、網(wǎng)站名稱(chēng)等“首頁(yè)”信息。最后發(fā)布成一個(gè)html文件,或者自己做一個(gè)html頁(yè)面,內容就是一個(gè)表格,里面寫(xiě)上index.swf的嵌入代碼即可。 主場(chǎng)景安排: ![]() 藍色線(xiàn)條部分為網(wǎng)站名稱(chēng)、版權等固定信息區,通常所在位置為Flash動(dòng)畫(huà)的邊緣位置。 橙色線(xiàn)條內容為網(wǎng)站欄目導航按鈕,通常也是固定在某個(gè)區域。按鈕可以根據需要做成靜態(tài)或動(dòng)態(tài)效果,甚至可以做成一個(gè)包含MC變化的Button。 綠色線(xiàn)條部分為主場(chǎng)景導入子文件的演示區域。 在子文件的裝載方面主要用到:LoadMovieNum、UnloadMovieNum兩個(gè)控制函數,請參閱前文重要ActionScript代碼控制。 這里我們以子欄目Cartoon的制作為例。主場(chǎng)景文件index中有一個(gè)按鈕Cartoon,當我們點(diǎn)擊Cartoon按鈕時(shí)希望導入cartoon文件夾下的200208.swf文件。所以我們在場(chǎng)景內選擇Cartoon按鈕,添加Action代碼: on (release) { 3、次場(chǎng)景200208.swf的制作 現在確定Cartoon子欄目需要導入的文件200208.swf,該文件計劃包含5個(gè)子文件。所以200208.swf文件的界面只包含用于導入5個(gè)獨立子文件的5個(gè)圖形按鈕和一個(gè)標題。 200208.swf 從圖上大家可以看到,200208.swf文件包含5個(gè)屬性為button的小圖標,分別為Bu_2_frog01到Bu_2_frog05。我們需要的效果是:點(diǎn)擊它們則分別導入相應文件200208_frog01.swf到200208_frog05.swf文件。 我們在場(chǎng)景內選擇Bu_2_frog01,為這個(gè)按鈕添加ActionScript: on (release) { 點(diǎn)擊Bu_2_frog02,為這個(gè)按鈕添加ActionScript: 注意:這里我們設置level為2,是為了保留并區別主場(chǎng)景1而設置的導入的層次數,如果需要導入下一級的層數,則層數增加為3,依次類(lèi)推。 4、二級次場(chǎng)景(200208_frog01~200208_frog05)制作 這里的二級次場(chǎng)景是與上級關(guān)聯(lián)的內容,是本例中三級結構中的最后一級。該級主要為全Flash網(wǎng)站具體內容部分,可以是詳細的圖片、文字、動(dòng)畫(huà)內容。這里需要連接的是具體圖片為內容,但同樣需要做成與主場(chǎng)景比例同等的swf文件。例如: 該場(chǎng)景是最底層場(chǎng)景,為主體內容顯示部分,具體動(dòng)畫(huà)效果大家可以根據需要做更深入。注意要在場(chǎng)景最后一幀處加入停止ActionScript代碼:stop();這樣可以停止場(chǎng)景動(dòng)畫(huà)的循環(huán)動(dòng)作。 完整導入到主場(chǎng)景內的效果
![]()
5、About中的文本導入 查看本例的About子欄目,在文件index.fla里設置About按鈕的action: on (release) { 在aboutus.fla文件中做好顯示文本的文本框,文本框屬性設置為多行(Multiline),Var:aboutus(注意這個(gè)變量名)。 ![]() 將文本文件完整導入到主場(chǎng)景內的效果
![]()
四、注意事項 1、注意所有子文件的長(cháng)、寬屬性 全Flash網(wǎng)站從畫(huà)面層次來(lái)看,非常類(lèi)似Photoshop的層結構,我們可以把每個(gè)子場(chǎng)景看做為一個(gè)層文件,子文件是在背景的長(cháng)寬范圍內出現。為了方便定位,我們可以讓子文件與主場(chǎng)景保持統一的長(cháng)寬比例,這樣非常便于版面安排。否則就必須用setProperty語(yǔ)句小心控制它們的位置。 2、發(fā)布文件時(shí)注意將html選項發(fā)布為透明模式 需要將每個(gè)子文件發(fā)布為透明模式的原因是不能讓子文件帶有背景底色,由于子文件的長(cháng)寬比例與主場(chǎng)景基本是一致的,如果子文件帶有底色,就會(huì )遮蓋主場(chǎng)景的內容。 設置方法:在發(fā)布設置里勾選html選項,在html面板里選擇windows mode:Transparent Windowless, 如圖。 ![]() 3、使用文本導入時(shí),注意文本文件開(kāi)頭的內容必須是“與文本框屬性中Var定義名相同的字符串=正文”。另外需要導入文本的swf文件與被導入的txt文本文件最好在同一目錄內。 4、注意仔細檢查文件之間的調用是否正確,避免出現“死鏈接”。 |
聯(lián)系客服