p5.js Processing Programmation

Understand and play with translate() and rotate()

p5.js and Processing both have a translate() and rotate() function that basically allows to change default position and orientation of axis.

The p5.js sketch available below allows to play with their parameters and immediately see the result as in this demonstration video.

Processing Programmation

Resize event in Processing sketch

Here is how to make the Processing window resizable AND get an event when the window is resized.

Tested with Processing 3.

// For resize event
import java.awt.Canvas;
import java.awt.event.ComponentEvent;
import java.awt.event.ComponentAdapter;

void setup() {

  ((Canvas)surface.getNative()).addComponentListener(new ComponentAdapter() {
    @Override public void componentResized(ComponentEvent e) {
      println("resized " + width + " " + height);