Flutter 1.0, go or no-go by Samuel Dionne

Now that flutter have been in version 1.0 for a couple of months. Is it ready for prime-time? We’ll look at some good use cases for it and some less ideal situation. Hopefully this talk will get you excited and you might consider flutter for your next project that fits with the previous points.

https://android-montreal.com/2019/04/09/april-meetup-2019/

Transcript

1. Flutter 1.0 Go or No-Go
2. Flutter 1.0 1.2 Go or No-Go
3. - Chris Sells, at MWC ‘19 “Flutter is Google’s new UI toolkit, helping developers quickly build high- quality, high-performance native apps across multiple platforms.”
4. Full native
5. Web views
6. React native
7. Flutter
8. Flutter architectural overview
9. Plugins ‘cause a lazy dev is a good dev
10. Plugins ‘cause a lazy dev is a good dev - Firebase - Location - Maps - Camera - File picker - Shared preferences - more widgets - … ( 1400+ more )
11. Examples
12. 1. Quickly - Your choice of IDE (IntelliJ, VS Code, xCode, VIM) - Lot of small, simple and composable widgets - Bunch of plugins availables - Dart VM for JIT compiling - Stateful hot reload + Single code base + Same UI no matter the OS and the version + Free and easy to configure CI/CD (yes, you read that right: FREE)
13. 2. High quality - Material design - Animations at 60 FPS - Lots of different easing - Easy to do custom UI
14. 3. High performance - DART - Generational garbage collection - Free tree shaking - AOT Compiler - C++ 2D rendering engine SKIA
15. The good
16. Hot-reload demo
18. Async is easy - Dart is a reactive language - known library available e.g. RxDart - async / await Future<void> printDailyNews() async { var newsDigest = await getReports(); print(newsDigest); } Future<String> getReports() => Future.delayed(oneSec, () => news);
19. - Native Android - Shared Element Transition - Min SDK 21 - Janky on most device - Activity vs Fragments XML: android:transitionName="profile" Java: ActivityOptionsCompat .makeSceneTransitionAnimation(this, ivProfile, "profile"); Hero animation are easy
20. - Flutter - Hero widget - Min SDK 16 - 60 FPS Hero( tag: "DemoTag", child: Icon( Icons.add, size: 70.0, ), ), Hero animation are easy
21. Code is small I implemented a limited version of Transit’s home screen - Using an HTTP API - Location plugin - Google Maps - Simple model
22. Code is small I implemented a limited version of Transit’s home screen - Using an HTTP API - Location plugin - Google Maps - Simple model 660 LoC !!
23. The less good
24. Composition can be messy
25. Architecture • Lifting State Up (Vanilla)
26. Architectures • Lifting State Up (Vanilla) • InheritedWidget
27. Architecturess • Lifting State Up (Vanilla) • InheritedWidget • BLoC
28. Architecturesss • Lifting State Up (Vanilla) • InheritedWidget • BLoC • Redux • scoped_model • Redux and Firestore • MVU • ReduRx • MVI • MVC Example • Frideos library
29. Architectures • Lifting State Up (Vanilla) • InheritedWidget • BLoC • Redux • scoped_model • Redux and Firestore • MVU • ReduRx • MVI • MVC Example • Frideos library
30. Architectures • Lifting State Up (Vanilla) • InheritedWidget • BLoC • Redux • scoped_model • Redux and Firestore • MVU • ReduRx • MVI • MVC Example • Frideos library class MoviesBloc { final _repository = Repository(); final _fetcher = PublishSubject<ItemModel>(); Observable<ItemModel> get allMovies => _fetcher.stream; getAllMovies() async { ItemModel itemModel = await _repository.getAllMovies(); _fetcher.sink.add(itemModel); } dispose() { _fetcher.close(); } }
31. Should we use it?
32. Should we use it? don’t rewrite everything, but YES
33. Should we use it? don’t rewrite everything, but YES - Added to an existing project - Target a new platform coming to - Web, Windows, Mac OS, Linux
34. - https://itsallwidgets.com - https://medium.com/flutterpub - https://codelabs.developers.google.com/ - YouTube channel: Flutter - https://flutter.dev/get-started An awesome community