You are on page 1of 17

L'ambiente di programmazione PROCESSlNG

Processng un ambente d programmazone svuppato a Meda Lab de MIT, cu scopo d


permettere ad artst, desgner ed n generae a persone con scarse cognzon d nformatca
ma attratte dae possbt d appcazone de'nformatca a'arte e a desgn d poter scrvere
de programm, p o meno sofstcat, n breve tempo, utzzando uno strumento face da
usare ma suffcentemente potente per fare dee spermentazon ne settore dea "computer
art" e de' "nteracton desgn".
Processng un prodotto open source dsponbe per e pattaforme Wndows, Macntosh e
Lnux; o s pu scarcare da sto uffcae.
Potete scarcare sommaro, 'ndce anatco, acun capto e g esemp d programmazone
de bro pubbcato dag autor d processng
Processng moto sempce da usare: s scrve testo d un programma e o s esegue (con
comando "run" o premendo pusante "Pay" a'estrema snstra dea fnestra
de'appcazone). I programm scrtt possono ovvamente essere savat e successvamente
modfcat. I tutto s fa n modo sempce e ntutvo, cos che anche un utente nesperto possa
mparare n poch mnut ad usaro.
IondamentI dI nIormatIca - 04 - IementI dI IrogrammazIone LIe.///home/steIano/ocuments/pubIIc_htmI_Iatest/I_04_IrogrammazIone.htmI
1 oI 34 09/30/2010 11.15 AM
Come abbamo detto, Processng un ambente d programmazone, ovvero un pacchetto
software per scrvere programm.
IondamentI dI nIormatIca - 04 - IementI dI IrogrammazIone LIe.///home/steIano/ocuments/pubIIc_htmI_Iatest/I_04_IrogrammazIone.htmI
2 oI 34 09/30/2010 11.15 AM
I nguaggo n cu ta programm devono essere scrtt chamato Processng (qund
attenzone: ambente d programmazone e nguaggo hanno o stesso nome) ed basato su
nguaggo d programmazone |ava.
Infatt a sntass d Processng rcorda moto quea d |ava, ma moto p sempce scrvere
un programma con Processng che un programma |ava, anche se quest'utmo ha una
maggore fessbt (e qund compesst) ed un nguaggo d appcabt generae, basato
su paradgma d programmazone a oggett.
In effett, nguaggo Processng dvso n tre ve d compesst: eementare, ntermedo,
avanzato. Ouest'utmo veo concde sostanzamente con nguaggo |ava stesso. La
maggor parte deg esemp d programmazone che vedremo rcadono ne due prm ve.
Primi esempi di programmazione
Abbamo vsto n una ezone precedente che un programma o s scrve partendo da struzon
eementar e combnandoe n tre mod possb, usando opportune strutture d controo.
Le strutture d controo d un nguaggo d programmazone sono de costrutt (fras) de
nguaggo che controano ordne d esecuzone dee struzon d un programma.
Sequenza: e struzon sono esegute n sequenza una dopo atra.
Selezione: sceta destruzone da esegure tra p aternatve.
lterazione: rpetzone (un certo numero d vote) d un gruppo d struzon.
Sequenza
Sequenza : gustapposzone d struzon separate da ";" (punto e vrgoa)
Una o p struzon possono essere raggruppate tra parentes graffe
{T

, ., T

,}
IondamentI dI nIormatIca - 04 - IementI dI IrogrammazIone LIe.///home/steIano/ocuments/pubIIc_htmI_Iatest/I_04_IrogrammazIone.htmI
3 oI 34 09/30/2010 11.15 AM
per formare una sngoa struzone. Le struzon sono esegute neordne n cu appaono:
I
1
, . , I
n
Esempio
I prmo esempo d programma Processng dsegna cnque rette obque tra oro paraee.
IondamentI dI nIormatIca - 04 - IementI dI IrogrammazIone LIe.///home/steIano/ocuments/pubIIc_htmI_Iatest/I_04_IrogrammazIone.htmI
4 oI 34 09/30/2010 11.15 AM
'struzone s1ze{200, 200) crea una fnestra d 200 per 200 pxe entro cu avvene
dsegno,
IondamentI dI nIormatIca - 04 - IementI dI IrogrammazIone LIe.///home/steIano/ocuments/pubIIc_htmI_Iatest/I_04_IrogrammazIone.htmI
5 oI 34 09/30/2010 11.15 AM
'struzone backgJouhd{0) scege nero come coore deo sfondo,
'struzone s1Joke{255) scege banco come coore per dsegno dee nee,
'struzone s1JokeWe1gh1{5) mposta o spessore dee nee a 5 pxe,
'struzone smoo1h{)arrotonda 'estremt dee nee.
Cascuna dee 5 nee d codce che seguono dsegna una nea, ad es. 'struzone 1he{10,
80, 30, 40)dsegna una nea con estrem ne punt d coordnate (10, 80) e (30, 40).
I sstema d coordnate d Processng pone 'orgne deg ass ne'angoo superore snstro
dea fnestra d dsegno, per cu spostandos verso destra aumenta vaore dea prma
coordnata d un punto, mentre spostandos verso basso aumenta vaore dea seconda
coordnata.
S not che 'mmagne appare n banco e nero, poch stato sceto d dsegnare con
mmagn a ve d grgo, scet tra 256 tonat dverse: 0 per nero e 255 per banco.
Ogn struzone de programma seguta da un commento, un testo nserto come
documentazone de programma, che non vene consderato come codce, ma vene scartato
durante 'esecuzone de programma. I comment usat n questo programma sono monoriga,
IondamentI dI nIormatIca - 04 - IementI dI IrogrammazIone LIe.///home/steIano/ocuments/pubIIc_htmI_Iatest/I_04_IrogrammazIone.htmI
6 oI 34 09/30/2010 11.15 AM
ovvero nzano dopo smbo "//" e termnano n fondo aa rga.
Uso delle variabili
Se s osserva attentamente programma precedente, e cnque rghe paraee sono
dsegnate ncrementando d 10 unt a prma componente de punt estrem d ogn retta.
I prossmo esempo dffersce da precedente per 'ntroduzone d una varabe ntera d nome
x a cu s assegna nzamente vaore 0 con a dichiarazione
1h1 x = 0
e dopo dsegno d ogn nea ncrementata d 10 unt con comando di assegnamento
x=x+10 .
Una dichiarazione ha il compito di creare una variabile stabilendo il nome e l'insieme dei
valori che la variabile pu assumere (ovvero il tipo della variabile, in questo caso di tipo
int che denota i numeri interi), nonche di riservare nella memoria del calcolatore lo
spazio necessario per memorizzare il valore corrente della variabile.
In Processng come n |ava e tant atr nguagg, una varabe non pu essere usata se non
prma dcharata. Invece vedremo che n |avaScrpt a dcharazone d una varabe non
necessara.
L'effetto fnae de programma sempre o stesso, ma, a dfferenza de programma
precedente, codce mette bene n evdenza a reazone tra e coordnate dee 5 nee.
IondamentI dI nIormatIca - 04 - IementI dI IrogrammazIone LIe.///home/steIano/ocuments/pubIIc_htmI_Iatest/I_04_IrogrammazIone.htmI
7 oI 34 09/30/2010 11.15 AM
lterazione
I costrutt d terazone eseguono un certo numero d vote un'struzone, detta corpo. Un
IondamentI dI nIormatIca - 04 - IementI dI IrogrammazIone LIe.///home/steIano/ocuments/pubIIc_htmI_Iatest/I_04_IrogrammazIone.htmI
8 oI 34 09/30/2010 11.15 AM
costrutto d terazone anche detto istruzione di ciclo, o sempcemente ciclo.
No esamneremo due tp d costrutt d terazone:
comando while
wh1e {<espJess1ohe og1ca> ) T
L'esecuzone d un comando whe causa 'esecuzone de'struzone T ( corpo de whe) se
espressone ogca (a guardia de whe) vera, po s vauta d nuovo espressone ogca:
se vera s esegue d nuovo struzone, e cos va nch espressone ogca dventa fasa.
Esempio di uso del comando while
IondamentI dI nIormatIca - 04 - IementI dI IrogrammazIone LIe.///home/steIano/ocuments/pubIIc_htmI_Iatest/I_04_IrogrammazIone.htmI
9 oI 34 09/30/2010 11.15 AM
Osservando codce deg esemp precedent, e cnque rghe paraee sono dsegnate
ncrementando d 10 unt a prma componente de punt estrem d ogn retta.
S ha qund una rpetzone (5 vote) de'esecuzone de comando d traccatura dee nee.
La traccatura dee nee pu avvenre senza scrvere 5 vote o stesso comando, usando
comando whe.
IondamentI dI nIormatIca - 04 - IementI dI IrogrammazIone LIe.///home/steIano/ocuments/pubIIc_htmI_Iatest/I_04_IrogrammazIone.htmI
10 oI 34 09/30/2010 11.15 AM
I corpo de cco whe dsegna una nea ed ncrementa vaore dea varabe ntera x d 10
unt.
Pertanto, a varabe x assume vaor 0, 10, 20, 30, 40, n corrspondenza de qua una nea
vene dsegnata. Ouando x assume vaore 50, a guarda de cco whe dventa fasa e
IondamentI dI nIormatIca - 04 - IementI dI IrogrammazIone LIe.///home/steIano/ocuments/pubIIc_htmI_Iatest/I_04_IrogrammazIone.htmI
11 oI 34 09/30/2010 11.15 AM
'esecuzone de cco termna.
La fgura seguente mostra come cco whe possa essere usato per cacoare numer
trangoar, ovvero numer nter postv ottenut come somma de numer nter compres tra 1
e un ntero postvo n.
IondamentI dI nIormatIca - 04 - IementI dI IrogrammazIone LIe.///home/steIano/ocuments/pubIIc_htmI_Iatest/I_04_IrogrammazIone.htmI
12 oI 34 09/30/2010 11.15 AM
I programma funzona n modo anaogo a dagramma a bocch dscusso n una ezone
precedente (teora deg agortm).
IondamentI dI nIormatIca - 04 - IementI dI IrogrammazIone LIe.///home/steIano/ocuments/pubIIc_htmI_Iatest/I_04_IrogrammazIone.htmI
13 oI 34 09/30/2010 11.15 AM
comando for
1oJ {T

, E , T

) T

I
1
struzone d nzazzazone;
E a guarda de for ;
I
2
struzone d ncremento o aggornamento;
I
3
corpo de for ;
'esecuzone d un comando for avvene come segue: nnanz tutto eseguta 'struzone I
1
d
nzazzazone (che d soto assegna un vaore ad una varabe, detta varabe d controo de
cco for); se a guarda vera s esegue corpo I
3
e aggornamento I
2
, po s vauta d nuovo
a guarda: se vera s esegue d nuovo corpo e aggornamento, nch a guarda dventa
fasa.
IondamentI dI nIormatIca - 04 - IementI dI IrogrammazIone LIe.///home/steIano/ocuments/pubIIc_htmI_Iatest/I_04_IrogrammazIone.htmI
14 oI 34 09/30/2010 11.15 AM
Esempio di uso del comando for
Ouesto esempo una rscrttura de programma precedente usando cco for. S not che
IondamentI dI nIormatIca - 04 - IementI dI IrogrammazIone LIe.///home/steIano/ocuments/pubIIc_htmI_Iatest/I_04_IrogrammazIone.htmI
15 oI 34 09/30/2010 11.15 AM
'struzone che assegna 0 aa varabe x 'struzone d nzazzazone de cco for, mentre
'struzone che ncrementa d 10 unt vaore d x 'struzone d aggornamento de cco for.
I corpo de for costtuto daa soa struzone d traccatura d una nea e vene rpetuto 5
vote.
IondamentI dI nIormatIca - 04 - IementI dI IrogrammazIone LIe.///home/steIano/ocuments/pubIIc_htmI_Iatest/I_04_IrogrammazIone.htmI
16 oI 34 09/30/2010 11.15 AM
Attenzione: le istruzioni di ciclo non sono solo dei semplici sostituti del comando di
sequenzializzazione che permettono di abbreviare i programmi, ma permettono di fare
molto di pi. Se non usiamo i cicli e vogliamo disegnare J0 righe anziche 5, dobbiamo
modificare il programma, aggiungendo 5 nuovi comandi di disegno.
I prossmo esempo mostra come con e struzon d terazone sa possbe dsegnare un
numero d nee che dpende da numero d second de tempo n cu s anca 'esecuzone de
programma: non pertanto stabre a pror quante nee s devono dsegnare e un tae
programma non s pu reazzare con a soa sequenzazzazone d comand.
IondamentI dI nIormatIca - 04 - IementI dI IrogrammazIone LIe.///home/steIano/ocuments/pubIIc_htmI_Iatest/I_04_IrogrammazIone.htmI
17 oI 34 09/30/2010 11.15 AM
Aa varabe ntera s assegnato numero de second ett da'oroogo de cacoatore.
Ne'mmagne precedente testo che appare nea fnestra de termnae ndca che vaore
assegnato ad s 4. I programma dsegner pertanto quattro rghe, come mostrato nea
fgura seguente:
IondamentI dI nIormatIca - 04 - IementI dI IrogrammazIone LIe.///home/steIano/ocuments/pubIIc_htmI_Iatest/I_04_IrogrammazIone.htmI
18 oI 34 09/30/2010 11.15 AM
I corpo
1ne{5*x+16, 46, 5*x+16, 86)
de comando for successvo che esegue a traccatura d una nea vertcae eseguto un
numero d vote par a vaore dea varabe s: nfatt, a varabe x d conteggo de for
nzazzata a 0 e fntanto che suo vaore mnore d queo d s, s tracca una nea e s
ncrementa vaore d x.
ln generale, se s una variabile intera con un valore definito, l'esecuzione del ciclo
1or{n1 x = 6 x<s x=x+1){
/* corpo de1 1or */
)
provoca l'esecuzione ripetuta s volte del corpo del for.
Con e struzon d cco, s pu ncappare ne cosdetto "fencepost error" (errore deo
steccato e de pa), che consste ne'esegure corpo de cco una vota n p o n meno de
numero corretto d terazon. Per essere scur che programma funzon correttamente,
provate ad assegnare de vaor pcco aa varabe s, ad es. 0 o 1 e vedete cosa succede: se
IondamentI dI nIormatIca - 04 - IementI dI IrogrammazIone LIe.///home/steIano/ocuments/pubIIc_htmI_Iatest/I_04_IrogrammazIone.htmI
19 oI 34 09/30/2010 11.15 AM
e prove hanno successo, aora programma dovrebbe essere corretto.
Per concudere 'anas d quest'esempo, s not commento multiriga n fondo a codce. S
tratta d un tpo d commento che nza con smbo "/*" , termna con smbo "*/" e pu
occupare un numero arbtraro d rghe d testo.
Selezione
I costrutt d seezone scegono d esegure un'struzone puttosto che un'atra n base a
vaore d un'espressone ogca ( espressone che assume soo due vaor, vero o falso, e
pertanto una tae espressone anche detta espressione booleana, da George Booe,
matematco e ogco de dcannovesmo secoo).
No esamneremo due tp d costrutt d seezone:
comando if
11 {<espJess1ohe og1ca> ) T

L'esecuzone d tae comando causa 'esecuzone de'struzone I


1
se espressone ogca
(detta guardia) vera
IondamentI dI nIormatIca - 04 - IementI dI IrogrammazIone LIe.///home/steIano/ocuments/pubIIc_htmI_Iatest/I_04_IrogrammazIone.htmI
20 oI 34 09/30/2010 11.15 AM
Esempio di uso del comando if
I seguente programma dsegna 5 rghe paraee d coore grgo se, a momento
de'esecuzone de programma, 'oroogo de cacoatore ndca un'oraro n cu vaore de
second nferore a 30; n caso contraro, e rghe sono d coore banco. La decsone d
quae coore appcare fatta con costrutto f.
IondamentI dI nIormatIca - 04 - IementI dI IrogrammazIone LIe.///home/steIano/ocuments/pubIIc_htmI_Iatest/I_04_IrogrammazIone.htmI
21 oI 34 09/30/2010 11.15 AM
IondamentI dI nIormatIca - 04 - IementI dI IrogrammazIone LIe.///home/steIano/ocuments/pubIIc_htmI_Iatest/I_04_IrogrammazIone.htmI
22 oI 34 09/30/2010 11.15 AM
I coore dee nee da traccare vene prempostato con a terza rga d codce
s1Joke{255)
che scege coore banco. I successvo comando f
1 {s<36){
s1roke{128) // 5e1 1ne va1ue 1o gray
)
mposta con 'struzone s1Joke{128) coore grgo come coore d traccatura se numero
de second, contenenuto nea varabe s mnore d 30.
comando if-else
11 {<espJess1ohe og1ca> ) T1
ese T2
L'esecuzone d tae comando causa 'esecuzone de'struzone I
1
se espressone ogca
vera; de'struzone I
2
n caso contraro.
IondamentI dI nIormatIca - 04 - IementI dI IrogrammazIone LIe.///home/steIano/ocuments/pubIIc_htmI_Iatest/I_04_IrogrammazIone.htmI
23 oI 34 09/30/2010 11.15 AM
Esempio di uso del comando if-else
IondamentI dI nIormatIca - 04 - IementI dI IrogrammazIone LIe.///home/steIano/ocuments/pubIIc_htmI_Iatest/I_04_IrogrammazIone.htmI
24 oI 34 09/30/2010 11.15 AM
I seguente programma dsegna 5 rghe paraee d coore grgo se, a momento
de'esecuzone de programma, 'oroogo de cacoatore ndca un'oraro n cu vaore de
second nferore a 30; n caso contraro, e rghe sono d coore banco. La decsone d
quae coore appcare fatta con costrutto f-ese
IondamentI dI nIormatIca - 04 - IementI dI IrogrammazIone LIe.///home/steIano/ocuments/pubIIc_htmI_Iatest/I_04_IrogrammazIone.htmI
25 oI 34 09/30/2010 11.15 AM
IondamentI dI nIormatIca - 04 - IementI dI IrogrammazIone LIe.///home/steIano/ocuments/pubIIc_htmI_Iatest/I_04_IrogrammazIone.htmI
26 oI 34 09/30/2010 11.15 AM
A dfferenza de'esempo precedente, coore dee nee da traccare non vene prempostato,
ma vene determnato da comando f-ese
1 {s<36){
s1roke{128) // 5e1 1ne va1ue 1o gray
)
e1se {
s1roke{255) // 5e1 1ne va1ue 1o Wh1e
)
che mposta con 'struzone s1Joke{128) coore grgo come coore d traccatura se
numero de second, contenenuto nea varabe s mnore d 30, mentre n caso contraro
coore d traccatura mpostato a coore banco con 'struzone s1Joke{255).
Primo esempio di grafica 2D
I prossmo sempcssmo programma mostra come dsegnare sempc fgure geometrche. Per
un approfondmento, s veda nk GRAFICA 2D e per nformazon su'uso dee prmtve
grafche 2D (struzon per dsegno d fgure geometrche bdmensona, s consut 'eenco
denomnato "2D Prmtves" aa pagna de manuae d rfermento d Processng .
IondamentI dI nIormatIca - 04 - IementI dI IrogrammazIone LIe.///home/steIano/ocuments/pubIIc_htmI_Iatest/I_04_IrogrammazIone.htmI
27 oI 34 09/30/2010 11.15 AM
IondamentI dI nIormatIca - 04 - IementI dI IrogrammazIone LIe.///home/steIano/ocuments/pubIIc_htmI_Iatest/I_04_IrogrammazIone.htmI
28 oI 34 09/30/2010 11.15 AM
I programma quas autoespcatvo. G unc comment rguardano comand stroke() e fill(),
che stabscono coore d dsegno de contorn e rspettvamente de'area nterna d una
fgura. I tre numer nter che costtuscono g argoment d queste struzon rappresentano un
coore n formato RGB (Red, Green, Bue) . A contraro, metod no5troke() e noFill()
nbscono dsegno de contorno o de'nterno d una fgura, fno a'esecuzone d un nuovo
comando stroke() o fill().I comando bezier() dsegna una curva d Bezr, defnta da quattro
punt: punt estrem e due punt d controo che ne determnano a curvatura.
Per comprendere mego e curve d Bezr, segu questo nk.
Per determinare il codice RGB di un colore o viceversa per determinare il colore di
una tripla RGB di numeri interi, si pu usare nel menu "Tools" di Processing
l'opzione "Color selector".
I rsutato de'esecuzone de programma seguente
IondamentI dI nIormatIca - 04 - IementI dI IrogrammazIone LIe.///home/steIano/ocuments/pubIIc_htmI_Iatest/I_04_IrogrammazIone.htmI
29 oI 34 09/30/2010 11.15 AM
Esercizi
1) Scrvere un programma che produce seguente dsegno
IondamentI dI nIormatIca - 04 - IementI dI IrogrammazIone LIe.///home/steIano/ocuments/pubIIc_htmI_Iatest/I_04_IrogrammazIone.htmI
30 oI 34 09/30/2010 11.15 AM
2) Scrvere un programma bersago che rproduce dsegno seguente:
IondamentI dI nIormatIca - 04 - IementI dI IrogrammazIone LIe.///home/steIano/ocuments/pubIIc_htmI_Iatest/I_04_IrogrammazIone.htmI
31 oI 34 09/30/2010 11.15 AM
Suggermento: usare un cco teratvo (for o whe). In fondo a questa pagna trovate
rfermento "dsegno bersago" a una possbe souzone. PROVATE A SVOLGERE L'ESERCIZIO
SENZA GUARDARE LA SOLUZIONE!
Note sull'esecuzione dei programmi
Come abbamo vsto, Processng d a possbt d scrvere ed esegure programm n modo
mmadato. I codce de programm scrtt memorzzato n un fe con estensone ".pde" (sga
d Processng Deveopment Envronment).
A momento dea sua esecuzone, tae fe vene tradotto n un codce detto bytecode,
contenuto nseme ad atr fe a'nterno d un fe con estensone ".|ar" (sga d |ava ARchve).
I bytecode a'nterno de fe |ar vene eseguto da'nterprete |ava, detto anche |RE (sga d
]ava Run-time Environment) o |VM (sga d ]ava Virtual Machine).
Le fas d traduzone (detta comunemente compilazione) de codce sorgente ( fe pde) e d
esecuzone de bytecode avvengono n modo trasparente per 'utente. Tutt fe prodott
mantengono o stesso nome, cambando soo 'estensone.
In reat, bytecode prodotto da Processng un programma d tpo specae, detto applet,
IondamentI dI nIormatIca - 04 - IementI dI IrogrammazIone LIe.///home/steIano/ocuments/pubIIc_htmI_Iatest/I_04_IrogrammazIone.htmI
32 oI 34 09/30/2010 11.15 AM
che pu essere nserto a'nterno d una pagna web con un'apposto marcatore <appet>. In
questo modo, programma una vota compato nserto a'nterno d una pagna web e, a
momento dea vsuazzazone dea pagna, 'appet eseguto. L'unca cosa necessara per a
vsuazzazone deg appet che su cacoatore sa nstaato 'nterprete |ava, (|RE o |VM).
Attenzione, Processing crea l'applet solo se si esegue il comando "export".
In ta caso, esso genera bytecode de'appet ed una sempce pagna web d nome
ndex.htm contenente un rfermento a'appet medante marcatore omonmo.
D seguto sono eencat coegament ae pagne web contenent g esemp vst fnora, p
acun esemp suppementar.
Processing pu anche creare un'applicazione se si esegue il comando "export
application".
In ta caso, esso genera otre a bytecode de'appet un fe esegube che avva a sua vota
'esecuzone de'appet. L'appcazone pu essere generata per sstem Wndows, Mac e
Lnux.
D seguto sono eencat coegament ae pagne web contenent g esemp vst fnora, p
acun esemp suppementar.
Collegamenti ai programmi discussi
esempo sequenza
atro esempo sequenza
esempo f
esempo f-ese
esempo whe
esempo for
esempo for n. 2
esempo d grafca
dsegno bersago
IondamentI dI nIormatIca - 04 - IementI dI IrogrammazIone LIe.///home/steIano/ocuments/pubIIc_htmI_Iatest/I_04_IrogrammazIone.htmI
33 oI 34 09/30/2010 11.15 AM
numer trangoar
IondamentI dI nIormatIca - 04 - IementI dI IrogrammazIone LIe.///home/steIano/ocuments/pubIIc_htmI_Iatest/I_04_IrogrammazIone.htmI
34 oI 34 09/30/2010 11.15 AM

You might also like