Flutter Study Jam Reloaded

Il piccolo Flutter, SDK made in Google per la realizzazione di app multipiattaforma native, sta ormai crescendo. Scopriamolo insieme in questo codelab base, nel quale inizieremo a muovere i primi passi con i Widget e la Navigazione!

Le slide sono una versione rivisitata del workshop svolto al Mikamai l'8 giugno 2019.
This is a revisited version of the workshop that took place in Milan, at Mikamai on the 8th of June, 2019.

This workshop was held at Milan Campus Party 2019 on the 27th of July.

Transcript

1. Introduzione a Flutter Realizzazione di un biglietto da visita virtuale
2. About me Flutter Developer 
 @Crispy Bacon Google fanboy Constantly learning Antonello Galipò @magicleon94
3. Cosa è Flutter? Flutter è la nuova tecnologia made in Google che permette di creare applicazioni cross-platform native • Creazione semplice e veloce della UI • Deploy per Android, iOS, desktop e web • Hot reload per un flusso di lavoro veloce e fluido • Semplice debugging della UI
5. • Experience • Expo • Experiment • Expert
6. Heraklion, Grecia 27 settembre 2019 https://flutterexp.com
7. Introduzione alla programmazione
8. Variabili Possiamo pensare alle variabili come “contenitori” utilizzati per consentire al nostro software di memorizzare dei valori. Ogni contenitore ha un suo tipo, ad esempio: • Età: numero intero. Variabile di tipo Integer o int • Nome: un testo. Variabile di tipo String • “Hai fratelli?”: una domanda/condizione. Variabile di tipo booleano o bool.
9. Variabili In Dart, dichiariamo delle variabili con la seguente sintassi: tipo nomeVariabile = valore;
10. Variabili In Dart possiamo anche omettere il tipo della variabile ed utilizzare la parola chiave var.
11. Funzioni Se ripetere più volte le stesse istruzioni nel tempo, come nel caso di un’addizione, possiamo creare una funzione che prende degli input ed eventualmente restituisce un output. tipoDiRitorno nomeFunzione(inputs) { // commands return output; }
12. Funzioni Possiamo lasciare dei commenti che non influiscono sul comportamento dell’applicazione utilizzando // prima del testo
13. Classi In programmazione, possiamo utilizzare delle istanze o oggetti che rappresentano un’entità dotata di determinati comportamenti. Definiamo questi oggetti mediante l’utilizzo di classi class nomeClasse { // variabili e funzioni }
14. Classi Ogni classe ha un costruttore, che ci permette di inizializzare le variabili di un nuovo oggetto.
15. Utilizzo di un oggetto Una volta creata una classe, ne possiamo creare una istanza. Una volta fatto, potremo accedere alle sue funzioni (metodi) ed alle sue variabili pubbliche. var dog = Dog(name:“Alfred”,age:1); print(dog.speak()); //bau bau print(dog.name) //Alfred
16. Ereditarietà • Comportamenti comuni • La parola chiave extends • Gli override
17. Widgets in Flutter
18. Stateful Widget • Costruiti secondo valori di variabili di stato • Ricostruiti più volte
19. Stateless Widget • Privi di stato • Costruiti una sola volta • Più leggeri
20. Scaffold
21. Container
22. Image •From file •From network •From asset •From a buffer
23. Row
24. Column
25. ListView
26. GridView
27. Icon
28. RaisedButton
29. Text
30. Card
31. Hands on!
32. Struttura di una schermata Scaffold
33. Struttura di una schermata AppBar Body
34. Struttura di una schermata Column Image Button
35. BIVI - BIglietto da VIsita
36. Let’s start!
37. Risorse • GitHub repository: https://github.com/magicleon94/ flutter_study_jam_base • Codelab: https://magicleon94.github.io/ flutter_study_jam_base • Flutter widgets: https://flutter.dev/docs/development/ ui/widgets
38. QR codes Link al codelab
39. Bananas! • Animazioni staggered 
 di scorrimento • Animazioni di rotazione • BIVI on steroids
40. Grazie!