p56_Blobs01
イメージからアプレットを起動
円が重なると円の外郭が一緒になる表現
FlashでのMovieClipにあたるオブジェクトをクラスで生成するのがポイント。これからこのような書き換えが基本的なメソッドになると思う。
Flashの方ではMovieClipのインスタンス名によってレイヤーが操作でき、白抜きのための円オブジェクト群を外郭にあたるオブジェクトより上の階層に位置するようにすれば、難しいことは無いサンプルプログラムでした。
Processingでは、フレーム毎にプログラムでは上から順に描画して行くのが一般で、先に描画されたものはそのあとに描画されるものによって上書きされてしまいます。
一つの円ごとに描画すると、外郭がひとつになるのではなく円が単に重なるようになってしまうので、まず、外郭となる円を描画してから、白抜きとなる円を描画するという順番になりました。
難しいと感じたポイントは、クラス設計でContainerとBallとEdgeという３つのクラスを用意したのですが、Containerにどんな役割を持たせるかが難しいところでした。
クラスをファイルで分けるのを止めてみました。いまいちどちらが良いのが判断のつかないプログラムです。02, 03,..と続けてみて、良くなさそうだったらファイルで分けるのに戻そうと思っています。
[java]
int total = 20;
Container container;
void setup(){
size(400, 400);
colorMode(HSB, 360, 100, 100, 100);
ellipseMode(CENTER);
noStroke();
smooth();
frameRate(20);
background(0, 0, 100);
container = new Container(width, height);
}
void draw(){
background(0, 0, 100);
container.bdraw();
}
class Container{
//property
int canvasWidth, canvasHeight;
float leftBounds, rightBounds;
Ball[] ball;
Edge[] edge;
int ballSize = 98;
int edgeSize = 100;
float posX, posY;
float vx, vy;
//constructor
Container(int canvasWidth, int canvasHeight){
this.canvasWidth = canvasWidth;
this.canvasHeight = canvasHeight;
leftBounds = -edgeSize;
rightBounds = edgeSize + canvasWidth;
ball = new Ball[total];
edge = new Edge[total];
for(int i=0; i
posY = random(0, canvasHeight/2) + canvasHeight/4;
vx = random(0, 60);
ball[i] = new Ball(ballSize, posX, posY);
ball[i].setVelocity(vx, 0);
edge[i] = new Edge(edgeSize, posX, posY);
}
}
//method
void bdraw(){
for(int i=0; i
if(ball[i].posX > rightBounds) ball[i].posX = leftBounds;
edge[i].posX = ball[i].posX;
ball[i].vx *= 0.8;
if(ball[i].vx < 0.00001) {
ball[i].vx = random(0, 60);
}
}
for(int i=0; i
}
for(int i=0; i
}
}
}
class Ball{
//property
int objSize;
float posX, posY;//position
float vx, vy;//velocity
//constructor
Ball(int objSize, float posX, float posY){
this.objSize = objSize;
this.posX = posX;
this.posY = posY;
}
//method
void setVelocity(float vx, float vy){
this.vx = vx;
this.vy = vy;
}
void bdraw(){//begin draw
fill(0, 0, 100);
ellipse(posX, posY, objSize, objSize);
}
}
class Edge extends Ball{
//constructor
Edge(int objSize, float posX, float posY){
super(objSize, posX, posY);
}
//method
void bdraw(){
fill(0, 60, 60);
ellipse(posX, posY, objSize, objSize);
}
}
void keyPressed(){
if(key ==’q'){
save(“p56_Blobs01.jpg”);
exit();
}
}
[/java]
タグ: processing