Les nouveautés Flutter depuis la Google I/O 2019

Transcript

1. Les nouveautés Flutter Edouard Marquez (Développeur freelance Flutter & Android)
2. Un petit rappel sur Flutter
3. Les nouveautés de la Google I/O 2019 Paris Android User Group La notion de "declarative UI" SwiftUI iOS / iPad OS / Mac OS / TV OS / Watch OS Jetpack Compose Android
4. Les nouveautés de la Google I/O 2019 Paris Android User Group La notion de "declarative UI" SwiftUI iOS / iPad OS / Mac OS / TV OS / Watch OS Jetpack Compose Android import SwiftUI struct Content : View { @State var model = Themes.listModel var body: some View { List(model.items, action: model.selectItem) { Image(item.image) VStack(alignement: .leading) { Text(item.title) Text(item.subtitle) .color(.gray) } } } }
5. Les nouveautés de la Google I/O 2019 Paris Android User Group En résumé, qu'est-ce que Flutter ? OpenSource Toutes les couches Multiplateforme Android (4.1+) & iOS (8.0+) Code natif = performances Dart Langage de programmation Inspiré du web Hot Reload, concepts…
6. Introduction à Flutter Meetup Abbeal Le paradigme : Flutter Code natif Canvas Evénements Application Plateforme Position GPS Bluetooth Audio Capteurs Caméra Etc Services Widgets, Rendu Platform Channels
8. Et donc les nouveautés ?
9. 1 Une nouvelle version stable de Flutter est disponible g123k@localhost:~$ flutter doctor Doctor summary (to see all details, run flutter doctor -v): [✓] Flutter (Channel stable, v1.5.4-hotfix.2, on Mac OS X 10.14.4 18E226, locale en-FR) [✓] Android toolchain - develop for Android devices (Android SDK version 28.0.3) [✓] iOS toolchain - develop for iOS devices (Xcode 10.2.1)
10. Collection if Collection for Null-aware spread operator 2 Une nouvelle version de Dart est disponible Nouvelles possibilités sur les collections "UI as code" Spread operator Ajouter une liste dans une liste Ajouter une liste non- nulle dans une liste Ajouter par condition Ajouter en itérant
11. 2 Avant Dart 2.3 class MyWidget extends StatelessWidget { @override Widget build(BuildContext context) { List<Widget> widgets = []; if (myCondition) { widgets.add(const Icon(Icons.people, size: 40.0)); } if (myOtherCondition) { widgets.add(const Text('Hello Paris')); } return Column( children : widgets );
12. 2 Depuis Dart 2.3 class MyWidget extends StatelessWidget { @override Widget build(BuildContext context) { return Column( children : <Widget>[ if (myCondition) const Icon(Icons.people, size: 40.0), if (myOtherCondition) const Text('Hello Paris') ] ); } }
13. 3 Flutter pour l'embarqué Perhaps one of the most pervasive embedded platforms where Flutter is already running is on the smart display operating system that powers the likes of Google Home Hub. “ “ Within Google, some Google-built features for the Smart Display platform are powered by Flutter today. And the Assistant team is excited to continue to expand the portfolio of features built with Flutter for the Smart Display in the coming months; the goal this year is to use Flutter to drive the overall system UI. “ “
14. 3 Flutter pour l'embarqué
15. 4 Flutter sur le desktop Windows Mac Linux ChromeOS
16. 5 Flutter sur le web (Hummingbird) Material Cupertino Widgets Rendering Foundation Animation Painting Gestures Framework (Dart) Skia Dart Text Engine (C++) Canvas JS Engine DOM Navigateur
17. 5 Flutter sur le web (Technical preview) Pas de plugin Temporairement à accès à des API de substitution API incomplètes Toutes les API Flutter ne sont pas disponibles Chrome uniquement Pour l'aspect développement 2 modes de fonctionnement Dev / prod Ca marche !
18. 6 Résultats du concours Flutter Create
19. 6 Résultats du concours Flutter Create
21. 6 Résultats du concours Flutter Create
22. Merci ! Questions ? @g123k @FlutterFr Meetup Kotlin (04/07) Kotlin multiplatform + Flutter & PWA