Former

Det aller første du skal få lære i Processing er å tegne rektangler og ellipser. Eller firkanter og rundinger som vi sier til vanlig.

Når vi skal få Processing til å tegne noe må vi gi en kommando. De ser ut noe sånt som dette: kommando(innstillinger); For eksempel, hvis vi skal tegne en ellipse som er på plass 5, 5 og er 10 bred og 10 høy skriver vi ellipse(5, 5, 10, 10);

Under til høyre kan du skrive inn kode som kjøres når du trykker på den grønne knappen hvor det står "Kjør". Vi har allerede satt inn koden til én ellipse og én rektangel. Prøv om du kan lage to til!

ellipse(5, 5, 10, 10);
rect(100, 100, 50, 50);

Farger

Kommandoen fill(r, g, b); bestemmer fargen ting vi tegner fylles med. Man setter inn tall for r, g og b som sier hvor rød, hvor grønn og hvor blå fargen skal være.

Under har vi skrevet koden for to sirkler. En rød og en grønn. Klarer du å lage én til som er blå?

Hva med andre farger?

fill(255, 0, 0);
ellipse(100, 180, 50, 50);

fill(0, 255, 0);
ellipse(300, 180, 50, 50);

Bevegelse

Hittil har vi bare lagd ting som står stille. Men ting blir jo mye mer spennende når de beveger seg!

Koden vi har skrevet til nå skjer én gang, og så stopper den. Hvis vi vil at den skal kjøres om igjen og om igjen helt til vi stopper den pakker vi den inn på denne måten:

void draw() {
    Koden vår plasseres her
}

I koden under har vi pakket inn kode som tegner en sirkel. I tillegg er det et par andre nye ting. mouseX og mouseY er det vi kaller variabler. Ting vi kan sette inn i stedet for tall. Akkurat disse to sier oss hvor musepekeren peker akkurat nå.

Hva skjer om du bytter om på X og Y? Eller hvis du setter inn mouseX og mouseY i stedet for tall i fill-kommandoen?

void draw() {
    ellipse(mouseX, mouseY, 80, 80);
}