Processingで四角形を3つくっつけてハコをつくる

今度は四角形を3つくっつけて、ハコをつくってみました。
forの使い方がポイントですね。

一定間隔で図形を並べる場合はforを使いますが、うちわけは下記のようになります。
これはサイズ100の四角形を50ずつ空けて、3つ描いています。
30は上と左の空き量(描画開始位置)、150はサイズ+空けたい間隔になります。

 size(600, 600 );

for( int i = 0; i < 3; i++ ) {
  for( int j = 0; j < 3; j++ ) {
//描画開始位置の設定+(図形サイズ+図形の間隔)この場合だと大きさが100で隙間が50
       rect( 30 + 150 * i, 30 + 150 * j, 100, 100);
}
}

これに気をつけてハコをランダムに描くと以下のようになります。
マウスクリックで再描画します。

void setup() {
 size(600, 600 );
  background(#FFFFFF);

smooth();
noStroke();
colorMode( HSB, 360, 100, 100);
  noLoop();  
 
}

void draw() {
    background(#FFFFFF);

    //左と上の空き量の設定=描画開始位置の設定,図形の間隔の設定(図形サイズ+隙間。この場合だと大きさが100で隙間が50)
  tileMoz(30,30,150);
}

void tileMoz(int posiX,int posiY,int space) {
for( int i = 0; i < 3; i++ ) {
  for( int j = 0; j < 3; j++ ) {



//上の四角の右下・下の四角の右上、上の四角の左下・下の四角の左上をランダムに
     int posiYran = int(random(posiY+30,posiY+70));
   int posiXran = int(random(posiX+30,posiX+70));

   //全体のサイズが100、隙間の間隔が50
 
       
    noStroke();
       fill(int(random(360)),90,90);
        quad( posiX+ j * space, posiY+ i * space,
          posiXran+ j * space, posiY+ i * space,
          posiXran+ j * space, posiYran+ i * space,
          posiX+ j * space,  posiY + 100+ i * space);
   

                  noStroke();
       fill(int(random(360)),90,90);
    quad(posiXran+ j * space, posiY+ i * space,
          posiX + 100+ j * space, posiY+ i * space,
          posiX + 100+ j * space, posiYran+ i * space,
          posiXran+ j * space, posiYran+ i * space);
          
          
           noStroke();
       fill(237,78,38);
       quad(posiXran+ j * space, posiYran+ i * space,
          posiX + 100+ j * space, posiYran+ i * space,
          posiX + 100+ j * space, posiY + 100+ i * space,
          posiX+ j * space,  posiY + 100+ i * space);
          
             noFill();
      strokeWeight(5);
      stroke(237,78,38);
      //左と上の空き量の設定=描画開始位置の設定+(図形サイズ+図形の間隔)この場合だと大きさが100で隙間が50
       rect( 30 + 150 * i, 30 + 150 * j, 100, 100);
      
      strokeWeight(3);
      stroke(237,78,38);
      line(posiXran+ j * space, posiY+ i * space, posiXran+ j * space, posiYran+ i * space);
     



  }
}
  }


  void mousePressed() {
  redraw();
}