Breakdown - Flutter @i/o 2019

Release the kraken…

This article breaks down all the Flutter talks happened @Google I/O 2019..

Disclaimer : This article is a long one. Please read having free mind….

---

Begin….

This article is divided into 5 parts,

Note : 5, because there were 5 talks on Flutter….:)

---

Part 1 : Beyond Mobile: Material Design, Adaptable UIs, and Flutter (Google I/O’19)

• Support for Material Theming in Flutter…

Example for CardThemes and DialogThemes..

Implement the Dark Theme in Flutter using, 

darkTheme : ThemeData.dark();

Customize sliders as per your usecase,

Optional labels on Bottom Navigation Bars :)…..

---

In-built transition for the Extended FAB, if they are present on both the screens.

---

New Widgets :

1. Reorderable list view
2. RangeSlider

3. Expanded Search Bar

4. Enhanced Semantics…

5. Improved Contrast Ratios

Applicable to RadioButtons, Checkbox and Switches..Earlier 2.42 : 1

Now 7.62 : 1

6. Touch Targets defaulted to 48×48 for material buttons.

7. Test if widget passes the TextContrastRatios and TapTargetGuidelines…

8. Introducing Platform Adaption for Switches..

Switch.adaptive();

For more info on adaptions, https://flutter.dev/docs/resources/platform-adaptations

9. Introduction to adaptive components:

Increase the size of your text globally,

Part Two : Building for iOS with Flutter (Google I/O’19)

1. Scrolling physics : Always bouncing in iOS.
2. Cupertino Widgets in Flutter

For detailed info, please check out this link…

3. App demo by the presenters:

Src code: https://github.com/RedBrogdon/building_for_ios_IO19

4. Fill a Cupertino-Button

CupertinoButton.filled()

Platform specific app decisions :

1. Between iOS and Android:

2. Page Navigation decision :

3. Choose platform specific slider :

4. Want to interact natively with Swift or Java, yes you can using Platform or Event Channels…

One such package was demonstrated, path_provider.

Part Three : Beyond Mobile: Building Flutter Apps for iOS, Android, Chrome OS, and Web (Google I/O’19)

Src code : https://github.com/2d-inc/developer_quest

Apps running on Web, Developer Quest by 2-Dimensions

1. Listen to keyboard events on Web, using RawKeyboardListener

2. Listen for mouse hover events using Listener

3. Hands on with Flutter Web — Technical Preview

Framework for Flutter Web

All the flutter web widgets are currently under 

package:flutter_web

It will be eventually merged under package:flutter,……

Hot-reload not present in web, but hot-restart is..

Page auto-responsive in flutter web and routes are taken care by flutter 🙂

Widget Inspector present for Flutter Web…

Part Four : Dart: Productive, Fast, Multi-Platform — Pick 3 (Google I/O’19)

If you want to your class to accept any data type , see below :

 — — Always wanted this sample :p

How to pass data to this generic class,:

Richness of Dart :

What’s New in Dart 2.3 : (Right side)

One of the Google apps using Dart -> Google AdWords…

Flutter architecture for Web :

Features Dart Team is working on :

1. Non-nullable types
2. Union of late init in Kotlin and lazy in Swift
3. Definitive assignment analysis for uninitialized local variables
4. Extension methods (getters, setters, operators)
5. Foreign function interfaces for objective C, C++.

Last…..Pragmatic State Management in Flutter (Google I/O’19)

Introducing new package for state management : (Provider)

Team recommends using ChangeNotifierProvider, which implements the dispose method itself..

Tip : You can have different elements of screen reacting to different providers..

You can have multiple providers too, like

Testing providers as :