Flash AS3 連鎖反應的粒子動畫
我要評論演示：
1、新建Flash文檔，設置：寬、高為 400 × 400 ，保存。
2、用橢圓工具在舞臺上畫一個 20 × 20 大小的圓。 (你能選擇任意的顏色）
3、右鍵單擊圓形，把它轉(zhuǎn)換成影片剪輯，注冊點居中。
4、在ActionScript導出的復選框中打勾 ，做類鏈接，類名為" Particle " 。圖1：
5、把圓形從舞臺刪除，新建ActionScript 3.0文件。圖2：
6、我們編寫一個外部的Particle類。在編譯器中輸入代碼：
package{
importflash.display.MovieClip;
publicclassParticleextendsMovieClip{
//Weneeddifferentspeedsfordifferentparticles.
//Thesevariablescanbeaccessedfromthemainmovie,becausetheyarepublic.
publicvarspeedX:Number;
publicvarspeedY:Number;
publicvarpartOfExplosion:Boolean=false;
functionParticle():void{
}
}
}
7、保存在fla文件的同一目錄下，名為 " Particle " 。圖3：
8、切換到我們的fla主文檔。首先我們在舞臺上生成粒子實例。在第一幀輸入代碼：
//Weneedfewimportsforthecolor
importfl.motion.Color;
importflash.geom.ColorTransform;
/*Wewant20particlesatthestart
particlesArrayisusedwhenweanimateeachparticle*/
varnumberOfParticles:Number=20;
varparticlesArray:Array=newArray();
//Eachtimeahitoccurs,wewanttocreate10newparticles
varnumberOfExplosionParticles:uint=10;
//Thisloopcreatesthefirstparticlesandgivesthemspeedandcoordinates
for(vari=0;i<numberOfParticles;i++){
varparticle:Particle=newParticle();
//Wewanttheparticlestostayattheiroriginalposition
particle.speedX=0;
particle.speedY=0;
//Setthestartingposition
particle.y=Math.random()*stage.stageHeight;
particle.x=Math.random()*stage.stageWidth;
//Addtheparticletothestageandpushittoarrayforlateruse.
addChild(particle);
particlesArray.push(particle);
}
9、測試你的影片，效果如圖。圖4：
10、隨機地選擇一個粒子產(chǎn)生爆炸效果。爆炸后，生成新的粒子。最后，刪除舞臺上爆炸的粒子。把下列代碼塊加入到動作面板：
//CallforthefirstexplosionstartExplosions();
/*Thisfunctionmakesarandomparticletoexplode.
Fromhere,thechainreactionbegins.*/
functionstartExplosions():void{
//Selectarandomparticlefromanarray
varindex=Math.round(Math.random()*(particlesArray.length-1));
varfirstParticle:Particle=particlesArray[index];
//Setarandomtint
varct:Color=newColor();
ct.setTint(0xFFFFFF*Math.random(),1);
//Create10newparticlesbecauseofexplosion
for(vari=0;i<numberOfExplosionParticles;i++){
varparticle:Particle=newParticle();
/*Giverandomxandyspeedtotheparticle.
Math.randomreturnsarandomnumbern,where0<=n<1.*/
particle.speedX=Math.random()*10-5;
particle.speedY=Math.random()*10-5;
//Applytherandomlyselectedtinttoeachparticle
particle.transform.colorTransform=ct;
//Setthestartingposition
particle.y=firstParticle.y;
particle.x=firstParticle.x;
//Particleispartofanexplosion
particle.partOfExplosion=true;
//Addtheparticletothestageandpushittoarrayforlateruse.
addChild(particle);
particlesArray.push(particle);
}
//Let’sremovetheparticlethatexploded(removefromstageandfromthearray)
removeChild(firstParticle);
particlesArray.splice(index,1);
addEventListener(Event.ENTER_FRAME,enterFrameHandler);
}
11、添加方法 enterFrameHandler，更新粒子坐標，使粒子動起來。輸入下列代碼：
functionenterFrameHandler(e:Event):void{
//Loopthrougheveryparticle
for(vari=0;i<particlesArray.length;i++){
varparticleOne:Particle=particlesArray[i];
//Updatetheparticle’scoordinates
particleOne.y+=particleOne.speedY;
particleOne.x+=particleOne.speedX;
/*ThisloopcallsacheckForHitfunctiontofindifthetwoparticlesarecolliding*/
for(varj:uint=i+1;j<particlesArray.length;j++){
varparticleTwo:Particle=particlesArray[j];
/*Makesuretheparticlesareonstage,onlythencheckforhits*/
if(contains(particleOne)&&contains(particleTwo)){
checkForHit(particleOne,particleTwo);
}
}
}
}
12、方法 " checkForHit" 是最難的部份，碰撞檢測。輸入代碼：
/*Thisfunctioncheckswhethertwoparticleshavecollided*/
functioncheckForHit(particleOne:Particle,particleTwo:Particle):void{
/*Let’smakesureweonlycheckthoseparticles,whereoneismovingandtheother
isstationary.Wedon’twanttwomovingparticlestoexplode.*/
if((particleOne.partOfExplosion==false&&particleTwo.partOfExplosion==true)||
particleOne.partOfExplosion==true&&particleTwo.partOfExplosion==false){
//CalculatethedistanceusingPythagoreantheorem
vardistanceX:Number=particleOne.x-particleTwo.x;
vardistanceY:Number=particleOne.y-particleTwo.y;
vardistance:Number=Math.sqrt(distanceX*distanceX+distanceY*distanceY);
/*Ifthedistanceissmallerthanparticle’swidth,wehaveahit.
Note:iftheparticleswereofdifferentsize,thecalculationwouldbe:
distance<((particleOne.width/2)+(particleTwo.width/2))
*/
if(distance<particleOne.width){
//Setarandomtinttotheparticlesthatexplode
varct:Color=newColor();
ct.setTint(0xFFFFFF*Math.random(),1);
//Create10newparticlesbecauseofanexplosion
for(vari=0;i<numberOfExplosionParticles;i++){
varparticle:Particle=newParticle();
particle.speedX=Math.random()*10-5;
particle.speedY=Math.random()*10-5;
//Applytint
particle.transform.colorTransform=ct;
//Setthestartingposition
particle.y=particleOne.y;
particle.x=particleOne.x;
particle.partOfExplosion=true;
//Addtheparticletothestageandpushittoarrayforlateruse.
addChild(particle);
particlesArray.push(particle);
}
/*Checkwhichofthetwoparticleswasstationary.
We’llremovetheonethatwasstationary.
*/
if(particleOne.partOfExplosion==false){
vartemp1=particlesArray.indexOf(particleOne);
particlesArray.splice(temp1,1);
removeChild(particleOne);
}
else{
vartemp2=particlesArray.indexOf(particleTwo);
particlesArray.splice(temp2,1);
removeChild(particleTwo);
}
}
}
}
13、代碼全部完成，測試你的影片。也可以設置不同背景的舞臺，畫任意的圖形。
最后完整的代碼：
importfl.motion.Color;
importflash.geom.ColorTransform;
/*Wewant20particlesatthestart
particlesArrayisusedwhenweanimateeachparticle*/
varnumberOfParticles:Number=20;
varparticlesArray:Array=newArray();
//Eachtimeahitoccurs,wewanttocreate10newparticles
varnumberOfExplosionParticles:uint=10;
//Thisloopcreatesthefirstparticlesandgivesthemspeedandcoordinates
for(vari=0;i<numberOfParticles;i++){
varparticle:Particle=newParticle();
//Wewanttheparticlestostayattheiroriginalposition
particle.speedX=0;
particle.speedY=0;
//Setthestartingposition
particle.y=Math.random()*stage.stageHeight;
particle.x=Math.random()*stage.stageWidth;
//Addtheparticletothestageandpushittoarrayforlateruse.
addChild(particle);
particlesArray.push(particle);
}
//Callforthefirstexplosion
startExplosions();
/*Thisfunctionmakesarandomparticletoexplode.
Fromhere,thechainreactionbegins.*/
functionstartExplosions():void{
//Selectarandomparticlefromanarray
varindex=Math.round(Math.random()*(particlesArray.length-1));
varfirstParticle:Particle=particlesArray[index];
//Setarandomtint
varct:Color=newColor();
ct.setTint(0xFFFFFF*Math.random(),1);
//Create10newparticlesbecauseofexplosion
for(vari=0;i<numberOfExplosionParticles;i++){
varparticle:Particle=newParticle();
/*Giverandomxandyspeedtotheparticle.
Math.randomreturnsarandomnumbern,where0<=n<1.*/
particle.speedX=Math.random()*10-5;
particle.speedY=Math.random()*10-5;
//Applytherandomlyselectedtinttoeachparticle
particle.transform.colorTransform=ct;
//Setthestartingposition
particle.y=firstParticle.y;
particle.x=firstParticle.x;
//Particleispartofanexplosion
particle.partOfExplosion=true;
//Addtheparticletothestageandpushittoarrayforlateruse.
addChild(particle);
particlesArray.push(particle);
}
//Let’sremovetheparticlethatexploded(removefromstageandfromthearray)
removeChild(firstParticle);
particlesArray.splice(index,1);
addEventListener(Event.ENTER_FRAME,enterFrameHandler);
}
//Thisfunctionisresponsiblefortheanimation
functionenterFrameHandler(e:Event):void{
//Loopthrougheveryparticle
for(vari=0;i<particlesArray.length;i++){
varparticleOne:Particle=particlesArray[i];
//Updatetheparticle’scoordinates
particleOne.y+=particleOne.speedY;
particleOne.x+=particleOne.speedX;
/*ThisloopcallsacheckForHitfunctiontofindifthetwoparticlesarecolliding*/
for(varj:uint=i+1;j<particlesArray.length;j++){
varparticleTwo:Particle=particlesArray[j];
/*Makesuretheparticlesareonstage,onlythencheckforhits*/
if(contains(particleOne)&&contains(particleTwo)){
checkForHit(particleOne,particleTwo);
}
}
}
}
/*Thisfunctioncheckswhethertwoparticleshavecollided*/
functioncheckForHit(particleOne:Particle,particleTwo:Particle):void{
/*Let’smakesureweonlycheckthoseparticles,whereoneismovingandtheother
isstationary.Wedon’twanttwomovingparticlestoexplode.*/
if((particleOne.partOfExplosion==false&&particleTwo.partOfExplosion==true)||
particleOne.partOfExplosion==true&&particleTwo.partOfExplosion==false){
//CalculatethedistanceusingPythagoreantheorem
vardistanceX:Number=particleOne.x-particleTwo.x;
vardistanceY:Number=particleOne.y-particleTwo.y;
vardistance:Number=Math.sqrt(distanceX*distanceX+distanceY*distanceY);
/*Ifthedistanceissmallerthanparticle’swidth,wehaveahit.
Note:iftheparticleswereofdifferentsize,thecalculationwouldbe:
distance<((particleOne.width/2)+(particleTwo.width/2))
*/
if(distance<particleOne.width){
//Setarandomtinttotheparticlesthatexplode
varct:Color=newColor();
ct.setTint(0xFFFFFF*Math.random(),1);
//Create10newparticlesbecauseofanexplosion
for(vari=0;i<numberOfExplosionParticles;i++){
varparticle:Particle=newParticle();
particle.speedX=Math.random()*10-5;
particle.speedY=Math.random()*10-5;
//Applytint
particle.transform.colorTransform=ct;
//Setthestartingposition
particle.y=particleOne.y;
particle.x=particleOne.x;
&nbs,p;particle.partOfExplosion=true;
//Addtheparticletothestageandpushittoarrayforlateruse.
addChild(particle);
particlesArray.push(particle);
}
/*Checkwhichofthetwoparticleswasstationary.
We’llremovetheonethatwasstationary.
*/
if(particleOne.partOfExplosion==false){
vartemp1=particlesArray.indexOf(particleOne);
particlesArray.splice(temp1,1);
removeChild(particleOne);
}
else{
vartemp2=particlesArray.indexOf(particleTwo);
particlesArray.splice(temp2,1);
removeChild(particleTwo);
}
}
}
}
附件下載：Particle.rar 粒子.rar
相關文章
flash cs6想要實現(xiàn)鼠標跟隨效果？該怎么制作呢？今天我們就來看看使用as2.0實現(xiàn)鼠標跟隨效果的教程，需要的朋友可以參考下2019-05-19
Flash cs6怎么使用代碼輸入中英文文本？Flash cs6中可以使用文字工具直接輸入文本，也可以使用代碼來輸入文本，該怎么使用代碼輸入文本呢？請看下文詳細的教程，需要的朋友2018-03-11
flash as3.0抽象類怎么定義？ as3.0中有很多抽象類，該怎么定義抽象類和抽象方法呢？下面我們就來看看簡單的例子，需要的朋友可以參考下http://www.fzitv.net/softs/408402.2018-02-28
flash cs6中怎么使用ActionScript3.0?
flash cs6中怎么使用ActionScript3.0？flash cs6中想要使用ActionScript3.0功能，該怎么使用呢？下面我們就來看看詳細的教程，需要的朋友可以參考下2018-01-25
本教程給大家分享一個Flash小教程，教大家在Flash CS6中怎么實現(xiàn)鼠標點擊決定圖像位置？方法很簡單，感興趣的朋友歡迎前來一起分享學習2018-01-12
本教程教腳本之家的ActionScript教程學習者在Flash中如何用代碼將圖片放在自己想要的舞臺位置，教程講解的詳細，感興趣的朋友歡迎前來分享學習2017-11-20
在Flash CS6中使用with函數(shù)繪制背景圖教程
本教程教腳本之家的ActionScript教程學習者如何在Flash CS6中使用with函數(shù)繪制背景圖？教程一步步講解的挺詳細，方法也不難，非常適合Flash新手入門學習2017-11-18
Flash怎么設置元件坐標?flash使用代碼設置元件的坐標的教程
Flash怎么設置元件坐標？flash中導如的元件需要添加坐標，該怎么定位元件坐標呢？下面我們就來看看flash使用代碼設置元件的坐標的教程，需要的朋友可以參考下2017-10-11
Flash怎么制作來回搖擺的花朵的動畫？Flash中想要給花朵制作一段搖擺的動畫效果，該怎么制作呢？下面我們就來看看詳細的教程，很簡單，需要的朋友可以參考下2017-05-23
Flash怎么制作流動七彩色的文字？想要讓文字動起來，該怎么使用flash給文字制作一個流動七彩色的動畫呢？下面我們就來看看詳細的教程，需要的朋友可以參考下2017-04-23
