P5.js mouseIsPressed Simple Sketch

This sketch was a quick exposure to the mousePressed function in P5.js. I also spent some time exploring simple geometric shapes. If you mouse-click on the red canvas the shapes will change.

Here’s a peek at the raw Javascript code to make this sketch work.

function setup() {
	createCanvas(800, 800);
}

function draw() {
  background(214, 21, 48);
  fill(33, 231, 204);

  if (mouseIsPressed) {
    rect(30, 20, 50, 50);
	scale(2.5);
	rect(30, 20, 50, 50);
  } else {
    rect(125, 125, 125, 30); //left, top, length, weight
    rect(150, 150, 75, 30);
    rect(325,125, 125, 30);
    rect(350,150, 75, 30);
    rect(250, 330, 150, 30);
  }

  print(mouseIsPressed);
}

Here’s a link to the Github repository for this P5.js sketch.

P5.js mouseIsPressed Simple Sketch

Submit a Comment