本教程主要用Flash CS4來(lái)制作漂亮的氣泡動(dòng)畫(huà)教程,制作出來(lái)氣泡真的很好看,制作效果是采用代碼形式實(shí)現(xiàn),覺(jué)得很不錯(cuò),轉(zhuǎn)發(fā)過(guò)來(lái),感興趣的朋友可以一起來(lái)學(xué)習(xí)。
先看看效果圖:
詳細(xì)代碼:
function ball(r:int):MovieClip {//自定義函數(shù) ball,參數(shù)為 r,整數(shù)型,返回值為 MovieClip
var col:uint=0xffffff*Math.random();//聲明一個(gè)無(wú)符號(hào)整數(shù)型變量 col,獲取任意顏色
var sh:MovieClip=new MovieClip();//聲明一個(gè)影片剪輯類實(shí)例 sh
sh.graphics.beginGradientFill(GradientType.RADIAL,[0xffffff,col,col],[0.5,1,1],[0,200,255]);//在 sh 中設(shè)置漸變填充樣式(放射狀漸變,顏色,透明度,色塊位置)
sh.graphics.drawCircle(0,0,r);//在 sh 中畫(huà)圓(圓心坐標(biāo)(0,0),半徑為參數(shù)r)
sh.graphics.endFill();//結(jié)束填充
return sh;//返回 sh
}
var ballArr:Array=[];//聲明一個(gè)空數(shù)組 ballArr
for (var i:int=0; i<10; i++) {//創(chuàng)建一個(gè) for 循環(huán),循環(huán) 10次
var balls:MovieClip=ball(Math.random()*20+20);//聲明一個(gè)影片剪輯類實(shí)例balls,調(diào)用函數(shù) ball(參數(shù)r 半徑的值為 20-40 之間的隨機(jī)值)
addChild(balls);//把 balls添加到顯示列表
balls.x=Math.random()*(stage.stageWidth-balls.width)+balls.width/2;//balls 的 X 坐標(biāo)
balls.y=Math.random()*(stage.stageHeight-balls.height)+balls.height/2;//balls 的 Y坐標(biāo),使它出現(xiàn)在舞臺(tái)的任意位置
balls.vx=Math.random()*2-1;//為 balls 設(shè)置自定義屬性 vx,數(shù)值為-1-1 之間的隨機(jī)數(shù),表示 X 方向的速度
balls.vy=Math.random()*2-1;//為 balls 設(shè)置自定義屬性 vy,數(shù)值為-1-1 之間的隨機(jī)數(shù),表示 Y 方向的速度
ballArr.push(balls);//把 balls 添加到數(shù)組 ballArr 中
}
addEventListener(Event.ENTER_FRAME,frame);//添加幀頻事件偵聽(tīng),調(diào)用函數(shù) frame
function frame(e) {//定義幀頻事件函數(shù) frame
for (var i:int=0; i<ballArr.length; i++) {//創(chuàng)建一個(gè) for循環(huán),循環(huán)次數(shù)為數(shù)組 ballArr 的元素?cái)?shù)
var balls:MovieClip=ballArr[i];//聲明一個(gè)影片剪輯類實(shí)例 balls,獲取數(shù)組 ballArr 的元素
balls.x+=balls.vx;//balls的 X 坐標(biāo)每幀增加balls.vx
balls.y+=balls.vy;//balls的 Y 坐標(biāo)每幀增加balls.vy
if (balls.x<balls.width/2) {//如果balls 出了舞臺(tái)左邊緣
balls.x=balls.width/2;//balls 的 X坐標(biāo)獲取balls 寬度的一半
balls.vx*=-1;//balls.vx 獲取它的相反數(shù)
}
if (balls.x>stage.stageWidth-balls.width/2) {//如果 alls 出了舞臺(tái)右邊緣
balls.x=stage.stageWidth-balls.width/2;//balls 的 X 坐標(biāo)獲取場(chǎng)景寬度與 balls 寬度一半的差
balls.vx*=-1;//balls.vx 獲取它的相反數(shù)
}
if (balls.y<balls.height/2) {//如果 balls出了舞臺(tái)上邊緣
balls.y=balls.height/2;//balls 的 Y坐標(biāo)獲取 balls 高度的一半
balls.vy*=-1;//balls.vy 獲取它的相反數(shù)
}
if (balls.y>stage.stageHeight-balls.height/2) {//如果 balls 出了舞臺(tái)下邊緣
balls.y=stage.stageHeight-balls.height/2;//balls 的 Y 坐標(biāo)獲取舞臺(tái)高度與 balls 高度一半的差
balls.vy*=-1;//balls.vy 獲取它的相反數(shù)
}
}
for (var j:int=0; j<ballArr.length-1; j++) {//創(chuàng)建一個(gè) for 循環(huán),循環(huán)次數(shù)比數(shù)組 ballArr 元素?cái)?shù)少 1
var ball0:MovieClip=ballArr[j];//聲明一個(gè)影片剪輯類實(shí)例 ball0,獲取數(shù)組 ballArr 的元素
for (var m:int=j+1; m<ballArr.length; m++) {//創(chuàng)建一個(gè) for 循環(huán),
var ball1:MovieClip=ballArr[m];//聲明一個(gè)影片剪輯類實(shí)例 ball1,獲取數(shù)組 ballArr 的元素
var dx:Number=ball1.x-ball0.x;//聲明一個(gè)數(shù)值型變量 dx,獲取
var dy:Number=ball1.y-ball0.y;//聲明一個(gè)數(shù)值型變量 dy,獲取
var jl:Number=Math.sqrt(dx*dx+dy*dy);//聲明一個(gè)數(shù)值型變量 jl,獲取小球的距離
var qj:Number=ball0.width/2+ball1.width/2;//聲明一個(gè)數(shù)值型變量獲取小球半徑之和
if (jl<=qj) {//如果 jl 小于等于 qj
var angle:Number=Math.atan2(dy,dx);//聲明一個(gè)數(shù)值型變量angle,獲取ball1 相對(duì)于 ball0 的角度
var tx:Number=ball0.x+Math.cos(angle)*qj*1.01;//聲明一個(gè)數(shù)值型變量 tx,獲取目標(biāo)點(diǎn)的 X坐標(biāo)
var ty:Number=ball0.y+Math.sin(angle)*qj*1.01;//聲明一個(gè)數(shù)值型變量 ty,獲取目標(biāo)點(diǎn)的 Y坐標(biāo)
ball0.vx=- (tx-ball1.x);//ball0 在X 方向的速度
ball0.vy=- (ty-ball1.y);//ball0 在Y 方向的速度
ball1.vx=(tx-ball1.x);//ball1 在 X方向的速度
ball1.vy=(ty-ball1.y);//ball1 在 Y方向的速度
}
}
}
}
教程結(jié)束,以上就是Flash CS4來(lái)制作漂亮的氣泡動(dòng)畫(huà)過(guò)程,希望大家喜歡,并有所幫助!