透過色

色の不透明度を指定する

fill 関数や stroke 関数で図形や線の色を指定する際に、引数を１つ付け足すと、その値は不透明度の値として使われます。不透明度を指定することで、透明な色を使うことができます。

fill();　図形の輪郭にアンチエイリアスをかける
　例：fill( 0, 128 ); // グレースケール値 0 に加え、不透明度 128 を指定
　例：fill( 0, 255, 0, 128 ); // RGB値に加え、不透明度 128 を指定

サンプル

画面上でマウスカーソルを動かしてみて下さい

コード

void setup(){
  size( 600, 400 );
  noStroke();
}
  
void draw(){
  background( 0 );
  
  // 不透明度を指定して半透明な図形を描く
  fill( 255, 128 );
  rect( 275, 100, 50, 200 );
  
  fill( 0, 100, 255, 128 );
  rect( 200, 175, 200, 50 );
  
  fill( 255, 255, 100, 128 );
  ellipse( mouseX, mouseY, 200, 200 );

  // 通常の不透明な色
  fill( 255, 255, 100 ); 
  ellipse( mouseX, mouseY, 80, 80 );
}

カーソル中心の小さな黄色い円は不透明であるため後ろの図形が見えませんが、それ以外の図形については後ろにある図形や色が透けて見えます。