itsukichang

フロントエンドが得意なエンジニア.ダーツと旅行とギターが好き

createjsはじめました

とりあえず.

[06/11 22:53, たっち対応したった]

  • Main.hx
package;

import createjs.easeljs.Shape;
import createjs.easeljs.Stage;
import createjs.easeljs.Ticker;
import createjs.easeljs.BoxBlurFilter;
import createjs.easeljs.Touch;

import js.Lib;

class Main
{
	private var stage:Stage;
	private var _shape:Shape;
	
	private var _rad:Float;
	private var _ball:Ball;
	
	private var _arr:Array<Ball>;
 
	public static function main():Void {
		new Main();
	}
 
	public function new() {
		Lib.window.onload = init;
	}
	private function init(_):Void {
                
                _arr = new Array();
		_rad = 20;
		Ticker.useRAF = true;
		Ticker.setFPS(60);
		Ticker.addListener(onTick);
 
		stage = new Stage(cast js.Lib.document.getElementById("canvas"));
		stage.compositeOperation = "lighter";

                if (Touch.isSupported()) {
 			 Touch.enable(stage);
		}

		var i = 0;
		while(i < 10) {
			_ball = new Ball(10 + Math.floor(Math.random()*30));
			stage.addChild(_ball);
			_ball.x = Math.random() * stage.canvas.width;
			_ball.y = Math.random() * stage.canvas.height;
			_ball.alpha = Math.random();
			_arr.push(_ball);
			_ball.name = Std.string(i);
			
			var blurStrong = 0.5+_ball.get_Radius()/5;
			var blurFilter = new BoxBlurFilter(blurStrong, blurStrong, 2);
			_ball.filters = [blurFilter];
			var margins = blurFilter.getBounds();
			_ball.cache(-_ball.get_Radius()+margins.x-7, -_ball.get_Radius()+margins.y-7, _ball.get_Radius()*2+margins.width+14, _ball.get_Radius()*2+margins.height+14);
			i++;
		}
	}
 
	private function onTick():Void {
		
		var i = 0;
		while(i < _arr.length) {
			_arr[i].x += ((stage.mouseX) - _arr[i].x) / _arr[i].get_Speed();
			_arr[i].y += ((stage.mouseY) - _arr[i].y) / _arr[i].get_Speed();
			i++;
		}
		stage.update(); //だいじ
	}
}
  • Ball.hx
package;
import createjs.easeljs.Shape;

class Ball extends Shape {
	
	private var _rad:Float;
	private var _speed:Int;
	
	public function new(s:Int) {
		super();
		_speed = s;
		_rad = 10 + Math.random() * 100;
		init();
	}
	
	private function init():Void {
		var col = "#" + StringTools.hex(Std.int((Math.random()*0xFFFFFF)),6);
		
		graphics.beginFill(col);
		graphics.drawCircle(0, 0, _rad);
		graphics.endFill();
	}
	
	public function get_Speed():Int {
		return _speed;
	}
	public function get_Radius():Float {
		return _rad;
	}
}

あ,haxeで書いてます.
Haxeでcreatejs使ってなんか作るまでの導入記事をそのうち書きたいと思っていますです.