struttura del programma

//eseguito una volta all'avvio del programma
function setup(){
  createCanvas(800,600); //larghezza,altezza
}

//eseguito continuamente dopo il setup
function draw(){
  //istruzioni di disegno
}

variabili di sistema

windowWidth / windowHeight
//larghezza / altezza della finestra

width / height
//larghezza / altezza dell'area di disegno

mouseX / mouseY
//posizione orizzontale / verticale del mouse

feedback non grafico

print();
//visualizza informazioni nella console

//doppia barra per commentare il codice

colore

fill(120); //grigio: 0-255
fill(100,125,255); //rosso, verde, blu: 0-255
fill(255, 0, 0, 50); //rosso, verde, blu, alfa
fill('red'); //nome colore (in inglese)
fill('#ccc'); //codice esadecimale a 3 cifre
fill('#222222'); //codice esadecimale a 6 cifre
color(0, 0, 255); //oggetto p5.Color

matematica

+ - / *  //operatori matematici di base

random(minimo, massimo); //numero casuale

map(valore, attuale1, attuale2, nuovo1, nuovo2);
//mappa un valore dall'intervallo attuale a uno nuovo

primitive 2d

line(x1, y1, x2, y2); //linea

ellipse(x, y, larghezza, altezza); //ellisse

rect(x, y, larghezza, altezza); //rettangolo

arc(x, y, larghezza, altezza, inizio, fine); //arco

beginShape(); //poligono
  vertex(x1, y1);
  vertex(x2, y2);
  vertex(x3, y3);
  //aggiungi eventuali altri vertici
endShape(CLOSE);

text("testo", x, y, larghezzaParagrafo, altezzaParagrafo);

• coordinate

• line()

• ellipse()

• rect()

• arc()

• vertex()

attributi grafici

background(colore);
//colora l'intera area di disegno

fill(colore);
//imposta il colore di riempimento

noFill();
//disattiva il riempimento

stroke(colore);
//imposta il colore dei contorni

strokeWeight(spessore);
//imposta lo spessore dei contorni in pixel

noStroke();
//disattiva il disegno dei contorni

ellipseMode(ancoraggio);
rectMode(ancoraggio);
//ancoraggi: CENTER, CORNER

textSize(altezzaCarattere);

logica se/allora

if(condizione){
  //istruzioni
}

===  //uguale a
!==  //diverso da
>   //maggiore di
<   //minore di
>=  //maggiore o uguale
<=  //minore o uguale