Flash AS 實例進階 圖片滾動效果

基本思路
① 在 MC 的中心點的左右兩側,同時擺放相同的一組圖片,中心點也是首尾相接處
?、?測得鼠標和場景水平中心點的距離 ,判斷 MC 向左或右及以怎樣速度運動。
?、?當 MC 左端抵場景左端或 MC 右端抵場景右端時,令 MC 回到一定位置,實現(xiàn)持續(xù)循環(huán)滾動
新知識點Stage.width// 場景的寬度,是隨意老師教我的,我找半天都沒找到。
Stage.height// 場景的高度,練習要用到。
MovieClip._width//MC 的寬度。
MovieClip._height // MC 的高度。
實例說明
?、僭?MC 注冊點的左右都擺放同一組圖片,在 主場景中若 MC 運動到邊端時刻,即由中心點替代,播放影片時看圖片是一致的,但又不是盡頭,會形成循環(huán)播放的效果。
?、?取得場景和 MC 的寬度,以進行計算比較,用鼠標偏離場景水平中線的距離作 MC 移動的參數(shù),當鼠標正在此線,數(shù)值為 0 , MC 靜止不動,距離大運動速度則快。
?、?設 2 個條件判斷,是在 MC 運動到邊端時,重新定位。
編寫動作腳本
?、?在第 1 幀上輸入:
m=Stage.width;// 取得場景的寬度
n=tu._width/2;// 取得 MC 的寬度的 1/2 的值
tu._x = tu._x-(m/2-_xmouse)/10;// 將鼠標與水平中心線的差值的 1/10 加到 MC 的位置上,再賦值到新的 MC 位置。
② 在第 2 幀上輸入:
if (tu._x>=n) {//MC 左端抵場景左端時
tu._x = tu._x-n;//MC 重新定位到自身中心點在場景左端
}
if (tu._x<=(m-n)) {//MC 右端抵場景右端時
tu._x = tu._x+n; //MC 重新定位到自身中心點在場景右端
}
要點分析
?、賵D片 MC 的制作,中心點是該元件的注冊點,又是圖片首尾交接處,依據這點判斷元件位置,在重新定位后又可以保證圖片的準確銜接。
?、?tu._x = tu._x-(m/2-_xmouse)/10 ,依鼠標在中心點的左側或右側及距離的大小,為 MC 設定運動方向及步長。
小結本講語句不多,用最簡潔的腳本實現(xiàn)所需效果正是我們學習的方向,課后可以在網上搜索一些圖片滾動的源文件進行比較分析,從而開拓出自己的編程思路。
課后練習還是老套路:由橫向改為縱向,范例效果:
補充實例有更多的時候我們希望有一組圖片自動勻速滾動,點擊某張圖片即進入相應網頁,這里用上面腳本作一點改動實現(xiàn)如下的效果:
①將原來兩幀上的語句改寫到MC上.
onClipEvent (load) {
m = Stage.width;
n = this._width/2;
x = 1;
}
onClipEvent (enterFrame) {
this._x -= x; //要向右移動就改"-="為"+=".
if (this._x>=n) { //向右移動此句起作用
this._x = this._x-n;
}
if (this._x<=(m-n)) { //向左移動此句起作用
this._x = this._x+n;
}
}
?、诜謩e在各小圖上加隱形按鈕寫腳本,下例是第一個圖的按鈕上的命令:
on (rollOver) {
x = 0;
}
on (rollOut) {
x = 1;
}
on (press) {
getURL(“http://www.dbjr.com.cn”, "_blank");
}
相關文章
- 要讓幾張圖片循環(huán)滾動,最簡的原理就是把連續(xù)圖片再復制一份接到尾部,待第一張圖片滾完之后被復制的接著滾動,下面就一起來看看吧2014-04-04