【Processing】四角を描く。

＊Processing 3.0以上での動作になります

長方形や正方形を描くには次の関数を用います。

rect(基準のx座標, 基準のy座標, 横幅, 縦幅)

例えばこんな感じです。

void setup(){
   // 画面サイズ
   size(300, 300);
}

void draw(){
   // (10, 100)を基準に横幅150 縦幅200の四角を描く
   rect(10, 100, 150, 200);
}

他にも、

rect(基準のx座標, 基準のy座標, 横幅, 縦幅, 角の半径)

rect(基準のx座標, 基準のy座標, 横幅, 縦幅, 左上, 右上, 右下, 左下)

で角を丸くすることができます。

例です。（画面サイズ300）

// 白い四角形
fill(255);
rect(30, 20, 110, 110, 20);

// 黒い四角形
fill(100);
rect(150, 160, 90, 90, 20, 0, 5, 40);

四角形の描き方を変更するには

rectMode(mode)

mode... CORNER, CORNERS, CENTER, RADIUS

を用います。

CORNER: 1,2つ目の引数で左上座標を指定し、3つ目で横幅、４つ目で縦幅を与えます。標準の描き方。

CORNERS: 1,2つ目の引数で左上座標、3,4つ目の引数で右下の座標を指定します。

CENTER: 引数の1,2つ目で中心座標を指定し、3つ目で横幅、４つ目で縦幅を与えます。

RADIUS: 引数の1,2つ目で中心座標を指定し、3,4つ目の引数で半径を指定します。

例です。（画面サイズ300）

// 白い四角形
fill(255);
rectMode(CORNER);
rect(50, 50, 100, 100);

// 黒い四角形
fill(100);
rectMode(CORNERS);
rect(50, 50, 100, 100);

// 白い四角形
fill(255);
rectMode(RADIUS);
rect(150, 150, 100, 100);

// 黒い四角形
fill(100);
rectMode(CENTER);
rect(150, 150, 100, 100);