DART: muovere i primi passi con il linguaggio di programmazione di Google
DART è un linguaggio di programmazione giovane che ha già preso piede, soprattutto nel mondo dello sviluppo di applicazioni mobile. Google ha creato un Software Development Kit (SDK) basato su DART chiamato Flutter, favorendo così l’adozione e la diffusione del proprio linguaggio di programmazione. Un importante vantaggio è che può essere utilizzato per sviluppare applicazioni per tutti i sistemi operativi mobili, quindi per Apple iOS, Google Android e Microsoft Windows Phone.
Se desiderate imparare a programmare con DART, il nostro tutorial vi renderà l’apprendimento un gioco da ragazzi. Per un’infarinatura generale sul linguaggio di programmazione di Google prima di muovere i primi passi, potete consultare il nostro articolo Cos’è DART?. Maggiori informazioni sono inoltre disponibili nel nostro articolo sul Software Development Kit Flutter di Google.
Le origini di DART
Inizialmente DART era stato pensato per colmare le lacune di JavaScript che non potevano più essere modificate internamente al linguaggio di programmazione. A partire da questo presupposto, gli sviluppatori ricercavano quindi modi per semplificare o unire determinate logiche interne di JavaScript, senza però perdere di vista l’ampia gamma di possibilità che offre. Consideriamo il seguente esempio. In JavaScript ritroviamo i seguenti elementi:
getElementsById()
getElementsByTagName()
getElementsByName()
getElementsByClassName()
querySelector()
querySelectorAll()
document.links
document.images
document.forms
document.scripts
formElement.elements
selectElement.optionsMentre in DART restano solo:
elem.query('#foo');
elem.queryAll('.foo');Primi passi con DART
Un linguaggio di programmazione è composto da una serie di “vocaboli” che consentono di strutturare e dare forma a dati e processi (algoritmi). A questo scopo, il linguaggio sfrutta un numero stabilito di comandi (le variabili), che non devono essere utilizzati per altri scopi. Alcuni esempi di comandi in DART sono “var”, “int”, “if”, “else” o “while”. Altri dettagli sull’architettura dei linguaggi di programmazione sono disponibili nella nostra guida sui linguaggi di programmazione web. Dalla combinazione tra variabili, operatori, condizioni, funzioni e molto altro ancora emerge il codice che deve fornire un determinato risultato.
DART nella pratica
Vi presentiamo innanzitutto una serie di esempi facili per imparare la programmazione con DART, che potrete poi ampliare a vostro piacere e utilizzare per fare degli esperimenti. Ogni routine di programmazione inizia con la richiesta della funzione principale. Qui nell’esempio vedete la richiesta classica del mondo della programmazione:
void main () {
print("Hello World!");
}Prima della funzione “main” troviamo il tipo restituito “void”, che non restituisce alcun valore. Le parentesi tonde “()” indicano una funzione, mentre nelle parantesi graffe “{...}” viene eseguito il codice DART, in questo caso, il comando per eseguire qualcosa sullo schermo. Ciò che appare dopo le barre oblique “//” è un commento che rimane invisibile; lo stesso risultato si ottiene con “/*questo è un commento su più righe...*/”, già noto da PHP. Questo permette di commentare in modo strutturato il codice, come promemoria per sé stessi o per gli altri sviluppatori, facilitando notevolmente il lavoro di squadra.
Come in Java, C e PHP, tutti gli statement di DART devono terminare con un punto e virgola.
Provate a eseguire gli esempi che seguono. Per farlo potete utilizzare la piattaforma gratuita open source DartPad, la quale offre anche il vantaggio di numerare le righe del programma e di visualizzare eventuali messaggi di errore. In un menu a scomparsa sono inoltre disponibili diversi esempi di programmazione.
Nei seguenti esempi di codice, il testo “void main() {…}” non viene più riportato.
Definizione e uso delle variabili
Le variabili vengono utilizzate per definire le singole grandezze. Cominciamo con i numeri.
var mySize = 174;Abbiamo definito una nuova variabile, “mySize” (in italiano “la mia taglia”), a cui è stato assegnato il valore “174”. Questa variabile viene conservata nel codice con il suo valore fino a quando non viene modificata attivamente da operatori o funzioni. Per eseguire il valore entra in gioco il comando “print”.
var mySize = 174;
print(mySize);
int yourSize = 174;
print(yourSize);
double thisSize = 1.74;
print(thisSize);
dynamic oneSize = 'Onehundredseventyfor' + ': ' + '174';
print(oneSize);Dall’insieme delle righe 3, 6, 9 e 12 e del comando “print” nel DartPad ottenete il risultato mostrato nella console:
Esistono diversi tipi di variabili in DART. Possono essere numeri interi (“int”) o numeri a virgola mobile (“double”). Il tipo di variabile “dynamic” può assumere diversi valori ed espressioni nel codice. Di righe vuote, tabulatori o paragrafi invece non viene tenuto conto nell’esecuzione della routine. Per questo motivo, i valori vengono riportati uno sotto all’altro nella console a destra.
Se si assegna un valore sbagliato a un determinato tipo di variabile si riceverà nel DartPad un messaggio di errore con una descrizione corrispondente:
int mySize = 1.74; // integer is expected, but double comes
print(mySize);
Gli identificatori (Identifier) delle variabili utilizzate non devono contenere parole riservate. Anche numeri in posizioni iniziali, così come spazi e caratteri speciali, sono da evitare. Fanno eccezione il trattino basso “_” e il simbolo del dollaro “$”. Gli identificatori distinguono tra maiuscole e minuscole e devono essere univoci.
Stringhe di caratteri
Con le stringhe di caratteri, ovvero il tipo di dato “String” (attenzione alla S maiuscola), è possibile elaborare qualunque carattere nella programmazione DART. A questo proposito, vi mostriamo subito come programmare diverse righe formattate in DART.
String text1 = 'this is a single line string';
String text2 = '''this is a multiline
line string with a break''';
print(text1);
print(text2);
Per riprodurre il testo mediante String è necessario racchiudere il contenuto desiderato tra virgolette semplici o normali: ' o ". Se il testo inizia e finisce invece con tre virgolette (''' o """), DART inserirà in quel punto del testo un ritorno a capo. Dunque avete la possibilità di formattare la visualizzazione del testo.
Le virgolette tipografiche (spesso nella corretta versione inglese) possono essere inserite facilmente nel testo con le combinazioni da tastiera di Windows [Alt] + 0147 (di apertura) e [Alt] + 0148 (di chiusura). Queste vengono anche visualizzate come tali in una stringa di DART. In macOS è possibile digitare queste virgolette con le combinazioni da tastiera [Alt] +[Shift] + [W] e [Alt] + [2].
Numeri
Ora che abbiamo imparato a definire le variabili, vediamo come utilizzarle per eseguire dei calcoli. Numeri o anche espressioni possono essere sommate. Per calcolare i risultati, DART sfrutta gli operatori aritmetici. Uno scenario possibile potrebbe, ad esempio, essere quello di un cliente che aggiunge 3 volte lo stesso articolo al carrello nel negozio online. In questo caso, la funzione carrello deve moltiplicare il prezzo unitario per “3” e indicare alla fine del calcolo il prezzo totale. Nel codice seguente potete vedere i diversi metodi per unire i dati, oltre ai commenti rilevanti nelle singole righe:
String product = 'calendar';
String curr = 'EUR';
String isFor = 'for'; // 3 strings for later print use
double singlePrice = 7.96; // floating comma for single price
int amount = 3; // number of ordered calendars
var totalPrice = (amount*singlePrice); // calculation of the total price with multiplier *
var invTotal = '$totalPrice $curr'; /* Merging of two variables in a new one by adding a $ sign before the old variables.*/
var result = '$amount $product\s'; //also plus adding a letter “s” for plural
print (invTotal); // creating the screen output
print (isFor);
print (result);
Possiamo vedere Strings, numeri interi e a virgola mobile, nonché l’unione di elementi di programmazione che danno luogo a variabili nuove. Quando unite due variabili esistenti per crearne una nuova dovete fare attenzione a una particolarità per ottenere sullo schermo il risultato sperato: le variabili già definite devono essere precedute dal simbolo del dollaro “$” (righe 8 e 9 nell’immagine di DartPad di sopra).
Impostare condizioni
Le condizioni giocano un ruolo importante nella programmazione. Vi spieghiamo come programmare una condizione in DART. Il risultato di una condizione è sempre una decisione, nel senso che se (if) si verifica il caso A, compare la visualizzazione X sullo schermo; se si verifica il caso B (elseif), allora appare la visualizzazione Y; se si verificano entrambe (else), compare la vista Z. Con i comandi DART inseriti tra parentesi ottenete il codice seguente:
var tOol = 'Glove';
if (tOol == 'Pliers' || tOol == 'Ruler')
{ print('That is a tool.');
} else if (tOol == 'brush')
{ print('That is a tool.');
} else { print('That is not a tool.');
}
}che si presenta così in DartPad:
Ampliate voi stessi le vostre conoscenze nel DART tutorial e sostituite nel DartPad la parola “guanto” a turno con “pinza”, “riga” o “pennello” e osservate i cambiamenti della visualizzazione pianificata sulla console. Potete ampliare questo esempio a piacere e applicarlo a diversi casi. Una novità è l’operatore “||”, che sta per l’espressione logica “o”, che in DART non deve essere usato come la parola “OR”.
Sali e scendi
Per programmare la sezione seguente, dobbiamo conoscere i cosiddetti incrementi e decrementi di DART. Si tratta dell’ingrandimento o della riduzione graduali di un valore di partenza. Nell’esempio, modificheremo il numero 50 con l’aiuto degli operatori “++” e “--”.
var upAndDown = 50;
print (upAndDown);
print('----');
++upAndDown;
print (upAndDown);
print('----');
upAndDown++;
print (upAndDown);
print('----');
--upAndDown;
print (upAndDown);
print('----');
upAndDown--;
print (upAndDown);
Qui vedete inoltre che è possibile visualizzare una stringa di caratteri semplice anche senza definirla in anticipo, inserendola semplicemente tra parentesi tonde con virgolette per ciascun “print” nel codice. In questo caso serve soltanto per dare al risultato una struttura visiva. Arrivati a questo punto siete pronti per programmare dei cicli.
Cicli
I cicli sono importanti routine di programmazione utili, ad esempio, per effettuare confronti con le dimensioni esistenti. A tale scopo, si utilizza la seguente “formulazione”: abbiamo un valore A, che modifichiamo fino a quando non viene raggiunta la grandezza (lo stato) B. Tradotto in codice DART, otteniamo questo:
String myLabel = ' pieces';
var piece = 3;
while (piece < 12) {
var allThisStuff = '$piece $myLabel';
print(allThisStuff);
piece++;
}Ma cosa succede in DART?
Anche in questo esempio potremmo utilizzare delle condizioni, se abbiamo, ad esempio, termini che sono differenziati in singolare e plurale:
int amount = 1;
var itemSing = 'blouse';
var itemPlural = 'blouses';
if (amount == 1)
{ print(itemSing);
} else { print(itemPlural);
}Per imparare a programmare in DART, copiate questo esempio di codice nel DartPad e sostituite la variabile a numero intero “quantità” in modo che l’articolo “camicetta” appaia al singolare o al plurale.
Panoramica degli operatori DART
Abbiamo già conosciuto diversi operatori per programmare in DART. Nella tabella seguente vi forniamo una panoramica degli operatori più importanti.
La variabile “muster” nella tabella è impostata sul valore 35.
var muster = 35;| Tipo di operatore | Identificatore | Simbolo | Esempio | Risultato | ||||
|---|---|---|---|---|---|---|---|---|
| Calcoli | Addizione | + | var muster + 2; | 37 | ||||
| Sottrazione | - | var muster - 2; | 33 | |||||
| Moltiplicazione | * | var muster * 3; | 105 | |||||
| Divisione | / | var muster / 7; | 5 | |||||
| Divisione numeri interi | ~/ | var muster ~/ 7; | 11 | |||||
| Incremento di | += | var muster += 6; | 41 | |||||
| Riduzione di | -= | var muster -= 7; | 28 | |||||
| Moltiplicazione per | *= | var muster *= 2; | 70 | |||||
| Divisione per | /= | var muster /= 7; | 5 | |||||
| Comparazioni | Identico | == | var muster == 35; | True | ||||
| Diverso | != | var muster != 44; | True | |||||
| Minore di | < | var muster < 44; | True | |||||
| Minore o uguale | <= | var muster <= 33; | False | |||||
| Maggiore di | > | 44 > var muster; | True | |||||
| Maggiore o uguale | >= | var muster>=23; | False | |||||
| Modifiche | Incremento | ++ | ++var muster; | 36 | ||||
| Incremento | ++ | var muster++; | 36 | |||||
| Riduzione | -- | --var muster; | 34 | |||||
| Riduzione | -- | var muster--; | 34 | |||||
| Valore rimanente | % | %var muster%3; | 2 | |||||
| Logica | E | && | muster1 && muster2 | … e | ||||
| O | muster1 | muster2 | … o | |||||
| Negazione | ! | muster1 ! muster2 | … non è | |||||
| Condizioni | Se allora | ? … : | var y = muster < 34 ? 15 : 10; | 10 | ||||
| Se allora | ? … : | var y = muster < 36 ? 15 : 10; | 15 | |||||
| Controllo per Null | ?? | var y = muster ?? 9; | 35 | |||||
| Controllo per Null | ?? | var z = 0 ?? muster; | 35 |
Con queste conoscenze di base avete gli strumenti per continuare lo studio di DART e l’obiettivo di sviluppare la vostra app non è più così lontano.
Articoli simili
Flutter tutorial: come sviluppare app con l’SDK di Google
Negli ultimi anni Google non ha soltanto rilasciato numerosi servizi utili come Gmail, Maps o la Google Workspace, ma ha anche immesso sul mercato diversi strumenti per la programmazione di software. Uno di questi è Flutter, il pacchetto di sviluppo per applicazioni, interessante soprattutto per gli sviluppatori di app mobili. Nel seguente tutorial su Flutter vi mostreremo come creare una semplice…
Billion PhotosShutterstock Caricare un’app su Google Play Store: creare una propria app nativa – parte 5.1
Chi vorrebbe caricare un’app su Google Play Store, ha quasi raggiunto l’obiettivo: l’applicazione Android si trova nella versione di produzione, pronta per essere pubblicata e usata su molti dispositivi mobili. Tuttavia, la procedura per la pubblicazione di un’app nell’app store ufficiale di Google richiede un po’ di tempo e diversi passaggi. Tra questi rientra anche la creazione di account dei…
Billion PhotosShutterstock Il design di un’app: creare una propria app nativa – parte 3
Il design di un’applicazione non è determinato solo da forme e colori, ma sono ugualmente importanti anche altri componenti del design di un’app come il posizionamento dei contenuti del programma o la sua usabilità. Il tempo investito per realizzare il design fa la differenza e determinerà se la vostra app verrà utilizzata dagli utenti o se verrà, invece, disinstallata dopo il download.
Billion PhotosShutterstock Programmare o utilizzare un creatore di app? Creare una propria app nativa – parte 2
Se volete creare un’app nativa, dovete partire dall’ambiente di sviluppo. Visto che sono necessarie anche conoscenze in materia di sviluppo dei software, questa soluzione non è adatta per i principianti. Gli sviluppatori di app meno esperti possono ricorrere a creatori di app appositi, che non presuppongono la conoscenza dei linguaggi di programmazione, ma offrono comunque una relativamente ampia…
REDPIXEL.PLShutterstock Tutorial su Lua
Avete già sentito parlare del linguaggio di scripting Lua? Questo linguaggio dal Brasile viene utilizzato per i motori grafici dei videogiochi e sui server web. In quanto linguaggio integrato, Lua consente di programmare con un formato omogeneo, indipendentemente dall’ambiente specifico in cui viene utilizzato. Lua è quindi un’interfaccia efficace anche per i sistemi più complessi.
