開発日誌

AS3 ランダムに配置したSpriteオブジェクトを整列させる

ActionScript3.0で、ステージ上にランダムに矩形を生成し、その後均一に整列させるコードを紹介したいと思います。
なお、Tweenライブラリの「Tweener」を利用しているため、Tweenerについても簡単に紹介します。
今回使用するソースコード(flaファイル)はこちらからダウンロードできます。→sample_sprite.zip

【サンプル】

【ソースコード】
import caurina.transitions.Tweener;

//画面に表示する矩形の数
var N:int = 300;

//矩形にTween処理を割当て
for (var i = 0 ; i < N ; i++ ){
 Tweener.addTween(
  createSprite(),
   {
    x: (i + 1) * 25 - (500 * int(i/20)),
    y: ( int(i/20) + 1 ) * 25,
    rotation: 180,
    time: 5,
    transition: 'easeInOutQuint'
   }
 );
}

//矩形を生成して画面に配置 
function createSprite():Sprite{
 var size:int = 25; //矩形の1辺の長さ
 var mySprite:Sprite = new Sprite();
 mySprite.graphics.beginFill( Math.floor( Math.random() * 0xFFFFFF ) + 1 );
 mySprite.graphics.drawRect(-size/2, -size/2, size, size);
 addChild(mySprite);

 //ステージサイズ 550x400
 mySprite.x = Math.floor( Math.random() * 1100 ) + 1 -275;
 mySprite.y = Math.floor( Math.random() * 800 ) + 1 -200;
 return mySprite;
}

【解説】
1.Tweenerについて
Tweenerとは、ムービークリップなどに簡単にトゥイーン処理を割り当てられる、
オープンソースのライブラリです。

以下のサイトでライブラリが配布されていますので、そちらからダウンロードします。
http://code.google.com/p/tweener/
※「Downloads」から、使用するASのバージョンに合ったものをダウンロードして下さい。
 AS2版とAS3版があります。

ダウンロードしたzipフォルダを解凍して出てきたcaurinaフォルダを
そのままflaファイルと同じディレクトリに配置します。

これで、Tweenerを使用する準備は完了です。
スクリプトに、
import caurina.transitions.Tweener;
を記載すれば使うことが出来ます。

なお、TweenerはMITライセンスなので、無償で使用できます。
MITライセンスについては、以下をご参照ください。
http://code.google.com/p/tweener/wiki/License(Tweenerのライセンスについての記述)
http://www.opensource.org/licenses/mit-license.php(MITライセンスの原文)
http://sourceforge.jp/projects/opensource/wiki/licenses%2FMIT_license(日本語参考訳)

2.ソースコードの解説
矩形を生成する関数を作り、Spriteを返すようにしています。
この関数をTweener.addTweenの第一引数で呼び出すことで、 生成した矩形にTween処理を割り当てることができます。
addTweenメソッドで、トゥイーン後の座標を指定することで、 ランダムに配置した矩形を、指定の位置に整列させています。

※通常、Spriteオブジェクトを動的に生成する場合、以下のようなコードになると思います。
//オブジェクトを生成
var mySprite:Sprite = new Sprite();
//矩形の色
mySprite.graphics.beginFill( Math.floor( Math.random() * 0xFFFFFF ) + 1 );	
//矩形の範囲
mySprite.graphics.drawRect(-25/2, -25/2, 25, 25);	
//矩形の座標(ランダムに配置)
mySprite.x = Math.floor( Math.random() * 1100 ) + 1 -275;	
mySprite.y = Math.floor( Math.random() * 800 ) + 1 -200;
//ステージに配置
addChild(mySprite);

ただし大量にSpriteを生成したい場合、上記のコードをSpriteの数だけ書いてしまうと
とても長いスクリプトになってしまいます。
そのため、関数としてまとめて記述しています。

関数内でaddChildしただけでは、インスタンス名が無い状態なので、
Tweener.addTweenメソッドで指定することができません。
そのため、インスタンス名をつけなくてもSpriteオブジェクトを指定できるよう、
関数の戻り値をSpriteオブジェクトにしています。

(kenta)

Webシステムのツボとは

オープンソースの紹介や、プログラミング講座、フリーソフトのレビューなど、Webエンジニアが送る、つれづれ日記。
【隔週金曜日更新】

運営会社:株式会社ジーピーオンライン

RSSを購読する

Monthly Archive