ProcessingのAS版ライブラリ「Frocessing」 
Published by alt on 9月 30, 2008 10:14 pm Category[ サンプル ] Tag[ AS3, Frocessing, ソースコード ]




アート/デザインのためのプログラミング環境に「Processing」というものがありますが
これのAS版ライブラリ「Frocessing」を使ってみました。
※移植ではなくリファレンス実装なので、本家と違う振る舞いをする部分もあるそうです。
Spark Projectからライブラリを落としてきます。
http://www.libspark.org/wiki/nutsu/Frocessing
ドキュメント:http://www.libspark.org/htdocs/as3/frocessing/
Processingもろくに触ったことがないウンコ野郎なので、
「千葉商科大学人工言語入門(A)の講義資料 / 第3回:Processing入門 II、色について、繰り返し」
を参考にさせていただき、Frocessingに置き換えて実装してみました。
同心円をくりかえし描画(マウスの位置によって大きさが変化) ソースコード

package
{
import flash.display.*;
import frocessing.display.F5MovieClip2D;
public class frocessing1 extends F5MovieClip2D
{
private var count:int = 50;
private var addNum:int = 1;
public function frocessing1()
{
stage.frameRate = 30;
stage.align = StageAlign.TOP_LEFT;
stage.scaleMode = StageScaleMode.NO_SCALE;
super();
QBest();
}
public function draw():void
{
clear();
size(550, 400);
colorMode(HSB, 360, 100, 100, 100);
background(0,0,0,100);
noStroke();
fill(210,100,100,10);
translate(0, 0);
var ellipse_size:int = 400;
var left:int = 270;
var top:int = 200;
//同心円を描いて行く
for(var i:int = 0; i < 16; i++)
{
ellipse(left, top, ellipse_size, ellipse_size);
ellipse_size = ellipse_size - count + mouseX/10;
}
if (count > 100) addNum = -2;
else if (count < 50) addNum = 2;
count += addNum;
}
}
}
多数の円を描画(マウスの位置によって大きさが変化) ソースコード

package
{
import flash.display.*;
import frocessing.display.F5MovieClip2D;
public class frocessing2 extends F5MovieClip2D
{
private var count:int = 50;
private var addNum:int = 1;
public function frocessing2()
{
stage.frameRate = 30;
stage.align = StageAlign.TOP_LEFT;
stage.scaleMode = StageScaleMode.NO_SCALE;
super();
QBest();
}
public function draw():void
{
clear();
size(550, 400);
background(0);
colorMode("HSB", 360, 100, 100, 100);
noStroke();
for(var i:int = 0; i < 100; i++)
{
var ellipse_size:int;
fill(random(200,240), random(50,100), random(50,100), 50);
ellipse_size = random(20, mouseX);
ellipse(random(550), random(400), ellipse_size, ellipse_size);
}
}
}
}
多数の四角形を描画(マウスの位置によって大きさが変化) ソースコード

package
{
import flash.display.*;
import frocessing.display.F5MovieClip2D;
public class frocessing3 extends F5MovieClip2D
{
private var count:int = 50;
private var addNum:int = 1;
public function frocessing3()
{
stage.frameRate = 30;
stage.align = StageAlign.TOP_LEFT;
stage.scaleMode = StageScaleMode.NO_SCALE;
super();
QBest();
}
public function draw():void
{
clear();
size(550, 400);
background(0);
colorMode("HSB", 360, 100, 100, 100);
rectMode(CENTER);
noStroke();
for(var i:int = 0; i < 100; i++)
{
scale(1, 1);
rotate(0);
fill(random(0,40), random(50,100), random(50,100), 50);
rect(random(550), random(400), random(5,mouseX), random(5,100));
}
}
}
}
マウス座標を基点に線を描画(マウスの位置によって基点が変化) ソースコード

package
{
import flash.display.*;
import frocessing.display.F5MovieClip2D;
public class frocessing4 extends F5MovieClip2D
{
private var count:int;
public function frocessing4()
{
stage.frameRate = 30;
stage.align = StageAlign.TOP_LEFT;
stage.scaleMode = StageScaleMode.NO_SCALE;
super();
QBest();
}
public function draw():void
{
clear();
background(255);
translate(fg.width/2 + mouseX-275, fg.height/2 + mouseY-200);
fill(0, 153, 230, 0.1);
stroke(0, 153, 230, 0.4);
strokeWeight(0);
scale(1, 1); //スケール
rotate(0); //回転
color(360,100,100,0);
for (var i:int = 0; i < 150; i++)
{
var x:Number = random(fg.width, -fg.width) * 2;
var y:Number = random(fg.height, -fg.height) * 2;
var r:Number = cos(radians(0));
drawLine(x,y,r,0);
}
count++;
}
}
}
このようなものが簡単にできました。
本当は3Dやカメラワークなど、もっと発展させたものを作らないと。
取り急ぎ、開発者のnutsu様に感謝感謝。
alt

