First Glance at Flutter from an Android Native App Developer

Scaffold( appBar: AppBar( title: Text('Welcome to Flutter'), ), body: Center( child: Text('Hello Flutter'), ) ) 

 ) ]), )) ], ), ), ], ), )); } } 

// https://flutter.io/docs/cookbook/navigation/passing-data Navigator.push( context, MaterialPageRoute( builder: (context) => DetailScreen(todo: todos[index]), ), ); 

/// api.dart ////////////////////////////////////////////////////////////////// abstract class Api { Future<user> login(String email, String pwd); } /// user.dart ///////////////////////////////////////////////////////////////// part &#39;user.g.dart&#39;; @JsonSerializable() class User { @JsonKey(name: &#39;id&#39;) int id; @JsonKey(name: &#39;name&#39;) String name; @JsonKey(name: &#39;email&#39;) String email; @JsonKey(name: &#39;auth_token&#39;) String authToken; User(this.id, this.name, this.email, this.authToken); factory User.fromJson(Map<string, dynamic=""> json) =&gt; _$UserFromJson(json); Map<string, dynamic=""> toJson() =&gt; _$UserToJson(this); } /// repos.dart //////////////////////////////////////////////////////////////// @override Future<user> login(String email, String pwd) async { final response = await http.post( kApiLoginEndpoint, headers: { &#39;Content-Type&#39;: &#39;application/json&#39;, }, body: jsonEncode({ &#39;email&#39;: email, &#39;password&#39;: pwd }), ); if (response.statusCode == 200) { return User.fromJson(json.decode(response.body));; } else { throw ApiException(response.statusCode, response.reasonPhrase); } } /// login_page.dart /////////////////////////////////////////////////////////// void _login(String name, String pwd) { repos.login(name, pwd) .then((user) { print(&quot;Login succeed: $user&quot;); }).catchError((e) { print(&#39;Failed to login: ${e.toString()}&#39;); }); } ``` 

The codes above are not well polished and have boilerplate codes. I still have some questions like: - How to log requests and responses? - Is there Retrofit&#39;s method(get, delete, post, put) annotations equivalent in Flutter? - How to intercept requests or responses to handle network status, API error, oAuth, header centralized? - How to implement type adapter factory? say if all the API response payloads are wrapped with `data`, like `{ &quot;data&quot;: { ... } }` - How to chain APIs like RxJava `flatMap`? I found a 3rd package [dio](https://pub.dartlang.org/packages/dio): &gt; is a Http client for Dart, supports Interceptors, Global configuration, FormData, Request Cancellation, File downloading, Timeout etc. I am not sure if it meets all the requirements but just give it a try. ## Animation ---- I cannot say for sure, but Flutter animation looks quite simple at my first glance, compared the Hero animation in Flutter with the equivalent shared element transition animation in Android, just simply wrap the widgets with a `Hero` widget and set with the same tag, that&#39;s it! (As you see, &quot;Everything&rsquo;s a Widget&quot; comes again). ## Dart VS Kotlin ---- Dart doesn&#39;t have data class, sealed class, extension function, when expression, lack of null-safe types,... which Kotlin has, it&#39;s a pain, however, as a Java Dev, we know that language is just a tool, some fine to use, some not. ## Others ---- - [Display images from the internet](https://flutter.io/docs/cookbook/images/network-image) Flutter has [cached network image](https://pub.dartlang.org/packages/cached_network_image) package, something like Picasso in Android. - [Internationalization and Localization Facilities](https://flutter.io/docs/development/accessibility-and-localization/internationalization) Flutter provide a built-in package for it, including message translation, plurals and genders, date/number formatting and parsing, and bidirectional text. - Depend Injection: not tried yet :( ## How to learn ---- In Flutter, everything&rsquo;s a widget. Flutter also provides a ton of widgets, to be honest, I almost get lost in composing widgets, but don&#39;t worry, there are several sample Apps that show the widget catalog: [Flutter Gallery](https://github.com/flutter/flutter/tree/master/examples/flutter_gallery)，[Flutter Catalog](https://github.com/X-Wei/flutter_catalog), [Flutter Go](https://github.com/alibaba/flutter-go). [Flutter Widget of the Week](https://www.youtube.com/playlist?list=PLOU2XLYxmsIL0pH0zWe_ZOHgGhZ7UasUE) on YouTube contains a list of one-minute lovely videos showing how to use these widgets. [Search &quot;Flutter cheat sheet&quot; on Google](https://www.google.com/search?q=flutter+cheet+sheet&amp;oq=flutter+cheet+sheet&amp;aqs=chrome.0.69i59j69i60j69i64j69i60l2j35i39.1918j0j4&amp;sourceid=chrome&amp;ie=UTF-8) you will get articles which are short, sweet and simple with loads of visual examples. [Flutter Codelabs](https://codelabs.developers.google.com/?cat=Flutter) provides a guided, tutorial, hands-on coding experience. [The official Flutter documentation](https://flutter.io/docs) is the most important, **Get started** part guide you set up the dev environment, **Cookbook** part contains recipes that demonstrate how to solve common problems while writing Flutter apps, each recipe is self-contained and provides complete code and running results in image or gif. ## Summary ---- Flutter gives me a quite different experience compared with Android App development. I am not sure if it&#39;s the future, but just give it a try. You will probably also find different things.</user></string,></string,></user>