|
6.1 按鈕功能的實現(xiàn)：
如果要添加按鈕功能，首先就得添加按鈕，這個道理連小學生都明白。然而，it's easier said than done，具體如何創(chuàng)建按鈕，就不是那么簡單了。因為圖像的數(shù)目是不確定的，因此需要動態(tài)創(chuàng)建。
創(chuàng)建按鈕其實只需要在載入全部圖像進入第一輪顯示的時候創(chuàng)建一次就可以了，因此，可以把該段創(chuàng)建按鈕的代碼放在第三幀。為了讓美工高手能有發(fā)揮自己才華的機會，筆者在這里就不用代碼寫按鈕了，而是先在庫里手動創(chuàng)建一個，接著通過attachMovie載入。
為了讓按鈕的深度更好管理，筆者建議大家把所有按鈕載入到一個mc里頭。于是，在遮罩層上面新建一個圖層，命名為按鈕。然后放置一個空的mc，元件名和實例名均為button_Field。位置根據(jù)你個人喜好而定。
接著，在第三幀追加代碼：
for (var i in imgabbrs) {
var btn:MovieClip = button_Field.attachMovie("button", "button"+i, i);//從庫里載入button元件，創(chuàng)建方法在后面介紹
btn._x = i*btn._width;
btn._y = 0;//這兩句讓按鈕橫向排列
btn.index=Number(i)+1;//給按鈕定義一個屬性，這個屬性表示第幾張圖片，將在一個動態(tài)文本里顯示
}
6.2 因為按鈕到現(xiàn)在還沒創(chuàng)建，所以大家可能不明白上面的代碼有些到底是用來干啥的。
現(xiàn)在筆者就給大家講述如何先創(chuàng)建一個按鈕。
在庫里右鍵—新建元件，命名為button，類型為mc，打開“高級”對話框，點中“為動作腳本導出”和“在第一幀導出”。
在該元件里，創(chuàng)建兩個圖層。
其中，按鈕圖層放一個按鈕，添加代碼：
on(release){
_parent._parent.lastIndex=_parent._parent.thisIndex //讓新圖片放到舊圖片所在的地方
_parent._parent.thisIndex=(index-1) //獲得新圖片的索引
_parent._parent.gotoAndPlay(43) //跳轉到43幀，從而跳過42幀的自動切換代碼
}
文字圖層放一動態(tài)文本，變量名為index
現(xiàn)在，測試一下，基本效果就出來了，但是還有一個小Bug，就是當圖片切換效果動畫還沒完成的時候，馬上切換下一個圖，動畫效果的過渡就不自然，解決的辦法有兩個，第一個很簡單，就是把44幀的代碼拖后一點，但是不能從根本上解決問題，第二個辦法相對復雜，將在下一帖再作介紹。
6.3 從根本上解決上述的小Bug：
新浪的新聞圖片輪換里，如果遮罩效果運行的時候，點了別的圖片的話，F(xiàn)lash會等效果運行結束，就馬上切換到所點到的圖像。因此，在這里，我們應該讓控制主時間軸幀跳轉的代碼gotoAndPlay(43)放在效果運行結束以后。
那么，效果運行結束之后，怎么知道之前點了按鈕呢？這個很好處理，只要設一個布爾變量havePressed=true就可以了。動畫效果結束以后，檢查havePressed的值就可以了。因此，我們還需要在開始切換圖片的時候，要讓havePressed變回false，否則即使下次不點按鈕，也會在遮罩效果結束后，馬上切換到下一圖。
但是，這樣又會有新的問題。如果在遮罩效果運行結束后，已經(jīng)檢查了havePressed，再點切換按鈕的話，檢查havePressed的操作就不能再在點擊按鈕時進行。導致立即切換圖片的操作失敗。
由此可見，效果運行時和效果運行結束兩種狀態(tài)需要分別處理。故還需要定義一個布爾變量，存放當前的效果運行狀態(tài)是運行時還是運行結束。在遮罩效果開始時，設置running=true，運行結束，讓running=false。
于是，要修改代碼的地方就比較多了。
首先，按鈕代碼需要改為：
on (release) {
_parent._parent.lastIndex = _parent._parent.thisIndex;
//讓新圖片放到舊圖片所在的地方
_parent._parent.thisIndex = (index-1);
//獲得新圖片的索引
if (_parent._parent.running) {
//如果遮罩效果正在運行
_parent._parent.havePressed = true;
//主時間軸不能直接跳轉，而要等到效果運行結束后，檢查到havePressed=true時才可以
} else {
_parent._parent.gotoAndPlay(43);
//跳轉到43幀，從而跳過42幀的自動切換代碼
}
}
主時間軸的第三幀聲明兩個布爾變量：
var running:Boolean;
var havePressed:Boolean;
主時間軸第四幀為切換周期的開始，遮罩效果處于運行時狀態(tài)，而還沒點擊過按鈕。故追加：
running=true;
havePressed=false;
之后，在每個遮罩動畫效果運行結束后，要讓running=false，因為運行已經(jīng)結束。并且檢測是否在效果運行這段時間內(nèi)點過按鈕。因此都追加代碼：
_parent._parent.running=false;//running是在主場景里聲明的，故需要指向于主場景
if(_parent._parent.havePressed){//假如在效果運行時點了按鈕，根據(jù)按鈕代碼，該值一定為true，否則就是false
_parent._parent.gotoAndPlay(43);//檢查到點過的話，就在效果運行結束的這一刻，馬上切換圖片
}
至此，整個圖片輪換的效果完成了。但是，大家也許會提問，為什么那些很眩的百葉窗效果，豐富多彩的形狀變化還沒做出來��？其實那些都是在遮罩mc里做。筆者在這里只拿了個最簡單的效果作為例子，大家完全可以根據(jù)自己的需要，把那里的效果換成自己想要的效果。如果想了解這些效果具體怎么個做法，那么，大家不妨研究下筆者一年前的教程：
http://bbs.blueidea.com/viewthread.php?tid=2272971
經(jīng)典論壇討論：
http://bbs.blueidea.com/viewthread.php?tid=2674755
Flash全站的技術應用系列：
（一）AS+JS的Flash網(wǎng)站無刷新定位技術
（二）Flash網(wǎng)站的SEO
（三）Flash網(wǎng)站的流量統(tǒng)計
（四）讓Flash網(wǎng)站具有IE前進后退的功能
（五）圖片輪換效果 (本文)
出處：藍色理想
責任編輯：moby
上一頁 圖片輪換效果 [5] 下一頁
◎進入論壇Flash專欄版塊參加討論
|
第 1 頁 
第 6 頁 圖片輪換效果 [6]
