Sono felice di condividere il mio primo progetto da sviluppatore: una semplice ma significativa applicazione dedicata alla Formula 1. L’app mostra i 20 piloti della scorsa stagione e permette all’utente di assegnare un voto personalizzato a ciascuno di loro.
Questa applicazione è nata come progetto d’esame di fine corso durante il mio percorso formativo in Flutter. È stata interamente sviluppata in Dart, e utilizza una web API per recuperare i dati dei piloti, oltre a un database SQFLite per gestire e salvare le votazioni. Il design si ispira al colore simbolo della Formula 1: il rosso, che caratterizza gran parte dell’interfaccia.
La Home Page
La schermata iniziale dell’app presenta un’appBar rossa con il titolo dell’app e un pulsante per tornare alla schermata precedente (nella schermata Home questo tasto non è presente dato che non dobbiamo tornare da nessuna parte).
Al centro della pagina troviamo un’immagine accattivante che richiama subito il tema della Formula 1, seguita da un pulsante che conduce alla seconda sezione dell’app: la griglia dei piloti.
La Griglia Piloti
La pagina presenta nuovamente la stessa appBar vista in precedenza. Scorrendo verso il basso, troviamo il titolo e, subito dopo, la griglia dei 20 piloti.
I piloti non sono ordinati secondo una classifica specifica, ma seguono semplicemente l’ordine con cui arrivano dall’API (purtroppo l’API ci fornisce dati non completamente aggiornati).
Questa è la sezione più complessa e articolata dell’app. Qui viene gestita la chiamata all’API, con relativo parsing dei dati.
Ogni elemento della griglia include:
- Un pulsante che porta alla terza pagina: la scheda personale del pilota
- L’immagine del pilota
- Il suo nome
- Il nome della scuderia
Il Pilota
L’ultima pagina dell’app mostra le informazioni dettagliate del pilota selezionato.
Qui ritroviamo:
La parte più delicata da gestire è stata proprio l’integrazione con il database: creare la struttura, collegare ogni pilota al suo voto e garantire che le valutazioni fossero persistenti e modificabili.
Infine, sotto la sezione voto, c’è uno spazio dedicato ad alcune informazioni aggiuntive, e un pulsante che apre una modale in overlay per assegnare o modificare il voto.
- Il nome del pilota
- Una sua immagine
- Una breve descrizione
- Una sezione dedicata al voto personalizzato, con salvataggio e lettura dei dati dal database locale
Inoltre in questa pagina sono riuscito ad utilizzare per ogni pilota il colore della sua scuderia di appartenenza fornitomi dall’API, in modo da colorare lo sfondo della pagina ed il suo testo (modificandone opportunamente la trasparenza) e rendere ogni pilota e la sua tuta in palette con la pagina.
In conclusione
Nonostante le difficoltà, sono riuscito a completare l’applicazione in circa una settimana, lavorando fuori orario lezione. È stato un grande traguardo personale: la mia prima app Flutter completamente autonoma!
Sono molto soddisfatto del risultato, soprattutto perché è frutto del lavoro appreso durante il corso tenuto dal professor Dario Di Toro, a cui va un ringraziamento speciale per l’insegnamento e la guida.
