ActionScriptで描画
夏だ!花火だ!ということで、ActionScriptで花火を描画する方法です。
花火
仕事仕事で花火大会とかに行けないであろうSEのみなさまへ、シンパシーと愛をこめて。
ActionScriptで描画
今日は、ActionScriptで描画する方法。
とはいっても、基本的に、MovieClipのメソッドlineToを抑えれば、幾何学的なものは何でも描画できます。
例えば、物理の積分結果や、公式の図式化などは、計算結果を、onEnterFrame内で、
function onEnterFramme(){
lineTo(次の座標);
}
としてやればいいわけです。
それさえ分かれば、「あとはどんな計算をするか?」だけですので、いろいろ試してみてください。
花火の描画スクリプト
花火のうち、「1方向に飛んでいく火薬1つ」をBallクラスとしました。この軌道を描画していくことになります。
これは「空」のムービークリップにリンクしています。
Ballクラスを、放射状に並べる役割のFireクラスを、「クリック」ボタンにリンクしました。
あとは、線の色や、広がるスピードなどは、乱数を使っています。
Ballクラス
class Ball extends MovieClip{
var speed = 10;
var masatsu = 1;
var angle;
var line_x = 0;
var line_y = 0;
var _stop = false;
function onEnterFrame(){
if( _stop ){//広がったら、フェードアウト
_alpha -= 2;
if( _alpha < 0 ) this.removeMovieClip();
}
else{
var speed_x = (speed)*Math.cos( angle*Math.PI/180 );
var speed_y = (speed)*Math.sin( angle*Math.PI/180 );
if( Math.abs(speed_x) < 1 ) speed_x = 0;
if( Math.abs(speed_y) < 1 ) speed_y = 0;
if( Math.abs(speed_x) <= 1 && Math.abs(speed_y) <= 1 )
_stop = true;
line_x += speed_x
line_y += speed_y;
this.lineStyle(0,pickColor(),100)
this.lineTo(line_x,line_y);
speed -= masatsu;
}
}
var minColor = 0x990000;
var maxColor = 0xFFFFFF;
function pickColor(){ //ランダムに色を決める。
return Math.floor(
Math.random() * (maxColor - minColor + 1)
) + minColor;
}
}
Fireクラス
class Fire extends MovieClip{
function onRelease(){
//いろんな条件を乱数で決める。
var num = pickLines();
var px = pickX();
var py = pickY();
var ps = pickSpeed();
//同じ条件のBallを、放射状に並べる。
for( var i=0; i < num; i++ ){
_root.attachMovie('ball' , 'ball' + i
, _root.getNextHighestDepth()
, {angle:(360/num)*i,_x:px,_y:py,speed:ps});
}
}
function pickLines(){
return Math.floor(Math.random() * (40 - 30 + 1)) + 30;
}
function pickX(){
return Math.floor(Math.random() * (400 - 20 + 1)) + 20;
}
function pickY(){
return Math.floor(Math.random() * (300 - 20 + 1)) + 20;
}
function pickSpeed(){
return Math.floor(Math.random() * (30 - 10 + 1)) + 10;
}
}

