Controlli condizionali II: operatori logici

NdA: da oggi, nei post della categoria Processing troverete gli screenshot aggiornati alla versione 3. Se volete scoprire quali sono le principali novità di quest’ultima versione, potete fare riferimento a questo post.

La scorsa settimana abbiamo imparato a utilizzare i controlli condizionali if, else if ed else per fare in modo che i nostri programmi eseguano determinate azioni al verificarsi di condizioni prestabilite.

Operatori Logici

Oggi approfondiamo l’argomento introducendo gli Operatori Logici. Può capitare, infatti, di avere la necessità di concatenare insieme più controlli condizionali: immaginiamo, ad esempio, di voler realizzare un programma in cui il colore dello sfondo cambia in base sia alla posizione X che Y del mouse.

In italiano dovremmo scrivere una cosa simile a:

SE la posizione X del mouse è inferiore alla metà della larghezza della finestra E la posizione Y del mouse è inferiore alla metà dell'altezza della finestra ALLORA colora lo sfondo di nero.

Possiamo tradurre in codice la frase di prima così:

void setup() {
  size(500, 500);
}

void draw() {
  if(mouseX < width/2) {
    if(mouseY < height/2 {
    }
  }
}

Oppure, in modo più elegante:

void setup() {
  size(500, 500);
}

void draw() {
  if((mouseX < width/2) && (mouseY < height/2)) {
  }
}

Gli operatori logici che possiamo utilizzare sono fondamentalmente 3:

  • && (AND) quando entrambe le condizioni devono essere true
  • || (OR) quando è sufficiente che una delle due condizioni sia true
  • ! (NOT) per testare se la condizione è not true oppure not false

Faccio una precisazione: benché non sia richiesto, se non in casi particolari, che le condizioni prima e dopo l'operatore logico siano racchiuse tra parentesi, io preferisco sempre aggiungere delle parentesi tonde per essere sicuro di rendere chiaro quali condizioni sto testando.

Ecco un esempio:

void setup() {
  size(500, 500);
  stroke(255);
}

void draw() {
  if((mouseX < width/2) && (mouseY < height/2)) {
    background(255, 0, 0);
  } else if((mouseX > width/2) && (mouseY < height/2)) {
    background(0, 255, 0);
  } else {
    background(0);
  }
  line(width/2, 0, width/2, height);
  line(0, height/2, width, height/2);
}

Traduco il codice in italiano:

Imposto una finestra di dimensioni 500x500px e che le linee di riferimento disegnate saranno di colore bianco. SE la posizione X del mouse sarà inferiore alla metà della larghezza della finestra E la posizione Y del mouse sarà inferiore alla metà dell'altezza della finestra allora lo sfondo sarà rosso ALTRIMENTI SE la posizione X del mouse sarà superiore alla metà della larghezza della finestra E la posizione Y del mouse sarà inferiore alla metà dell'altezza della finestra allora lo sfondo sarà verde ALTRIMENTI lo sfondo sarà nero.

Questo è il risultato:

Utilizzo degli operatori Logici in Processing

Utilizzo degli operatori logici in Processing

Compiti per casa

Prendendo spunto dal codice che abbiamo scritto oggi, scrivete un programma in cui la finestra, con lo sfondo di colore nero, sia divisa in 4 quadranti (consiglio di fare delle linee di riferimento di colore bianco). L'obiettivo del vostro programma è fare in modo che si evidenzi con il colore bianco il quadrante su cui passate sopra con il mouse facendo in modo che gli altri 3 rimangono di colore nero.

Buon lavoro!

Le novità di Processing 3

Il 30 settembre è stata rilasciata una nuova major release di Processing: la versione 3. Prendendo spunto dal video ufficiale con cui Daniel Shiffman illustra le principali novità del software, ho deciso di scrivere questo post, soprattutto per chi ha difficoltà con l’inglese.

Nuova icona, nuovo editor

Una volta scaricato e installato sul vostro computer noterete subito che Processing 3 ha una nuova icona. Le novità grafiche non sono, però, finite qui: quando avviate il programma comparirà un welcome screen che, la prima volta, vi consiglierà di creare una nuova cartella sketchbook dove tenere i vostri sketch. È consigliabile tenere separati i programmi realizzati per la versione 2 e la versione 3 perché, a causa di alcuni cambiamenti nel linguaggio, alcuni vecchi sketch potrebbero non funzionare.

Welcome screen di Processing 3
Il nuovo “Welcome screen”

Oltre alla nuova icona e all’inedito welcome screen, una delle prime cose che notiamo è il design dell’editor che è stato completamente rivisto: anche in questa finestra troviamo delle nuove icone e, finalmente, i numeri delle linee di codice a sinistra oltre a delle nuove tab in basso.

Il nuovo editor di Processing 3

Error Checking e Warning

Il nuovo sistema di error checking sarà di grande aiuto soprattutto per chi sta iniziando a programmare: i messaggi di errore sono stati rivisti in modo da essere più “leggibili”. Di default verranno visualizzati nella console gli errori mentre digitiamo il codice invece che alla pressione del comando Run come accadeva nella versione precedente.

In questo modo sarà molto più difficile dimenticarsi un punto e virgola alla fine di un’istruzione o una parentesi. I programmatori più esperti possono disabilitare questa opzione andando nel pannello delle preferenze e deselezionando Continuously check for errors.

Nel caso in cui nel nostro codice ci fosse più di un errore, cliccando sulla nuova tab Errors, presente nella parte inferiore della finestra,abbiamo una panoramica di tutti i problemi presenti nel nostro codice.

Un’altra novità sono i Warning: non si tratta di veri e propri errori ma di messaggi che ci avvisano che nel nostro codice c’è qualcosa di strano. Ad esempio, se creiamo e inizializziamo una variabile che, però, non usiamo da nessuna parte nel nostro programma, ci verrà restituito un messaggio di avviso. A differenza degli errori, evidenziati in rosso, i warning vengono sottolineati in giallo.

Code completion

Questa opzione non è attiva di default ma è selezionabile nelle preferenze: grazie a essa, premendo Ctrl+spazio l’editor ci darà dei suggerimenti su come completare il nostro codice. Se utilizzate OS X, verificate che la combinazione Ctrl+spazio sia libera perché su alcuni computer potrebbe lanciare la ricerca Spotlight.

Processing 3: code completion

Tweak

Oltre alla modalità Run, in Processing 3 è stata aggiunta la modalità Tweak. Una volta lanciato il nostro sketch in questa modalità (su Mac la scorciatoia è ⇧⌘T), possiamo modificare “in diretta” alcuni parametri del nostro sketch e avere un feedback immediato senza interrompere il programma.

Una volta stoppata la modalità tweak, l’editor ci chiederà se vogliamo mantenere le modifiche apportate al nostro codice oppure se vogliamo tornare alla versione originale.

Debugger

Anche questa novità è mutuata da altri linguaggi di programmazione: attivando il debugger, il pulsante a forma di insetto presente in alto a destra, possiamo far girare il nostro programma una linea alla volta verificando, dunque, in quali punti viene generato un errore. Per capire meglio come sfruttare questa novità, consiglio questo video, sempre realizzato da Dan che ne illustra il funzionamento nel dettaglio.

OpenGL, fullScreen() e pixelDensity()

Prima di parlare di due nuove funzioni molto interessanti sottolineo che gli sviluppatori hanno lavorato molto per rendere Processing 3 molto più veloce rispetto alla versione precedente. Questo risultato è dovuto principalmente alla nuova engine di rendering che non si basa più su PApplet, una tecnologia ormai in disuso, ma su OpenGL.

Venendo alle nuove funzioni, fullScreen() sostituisce size(displayWidth, displayHeight) e ci permette di far girare i nostri sketch a pieno schermo. Questa nuova funzione, però, non fa soltanto questo: se abbiamo uno schermo collegato possiamo passare il parametro fullScreen(1) oppure fullScreen(2) per decidere su quale display verrà presentato il nostro programma.

Se, invece, abbiamo più schermi collegati al computer con fullScreen(SPAN) lo sketch si adatterà automaticamente al setup multidisplay occupando tutto lo spazio disponibile. Una cosa importante da sottolineare è, grazie a questa nuova funzione, size() non accetta più variabili ma solo parametri hard-coded.

Se siete possessori di un computer con schermo Retina, la nuova funzione pixelDensity() vi piacerà molto: grazie a essa possiamo aumentare la densità di pixel del nostro sketch per adattarlo all’alta risoluzione del nostro schermo. La differenza è davvero notevole!

Contribution Manager

Processing 3 - Contribution ManagerSe utilizzate librerie o tool aggiuntivi nei vostri sketch, il nuovo Contribution Manager sarà una novità che vi piacerà parecchio. In questa nuova finestra potrete cercare, installare, disinstallare e aggiornare tutti gli strumenti aggiuntivi che utilizzate e verificarne la compatibilità con la versione di Processing che state utilizzando.

Tutte le altre novità

Come anticipavo all’inizio del post, lo scopo di questo articolo era fare una panoramica sulle principali novità introdotte in quest’ultima versione di Processing. Se siete interessati a scoprire nel dettaglio quali sono tutte le novità introdotte in quest’ultima versione, vi consiglio di visitare questa pagina su GitHub.