Starting with Flutter from Android Dev perspective
Introduction
Most developers want to start with flutter but don’t know how to begin or if it is really worth learning. I´m one of those, and in this article, my focus is to explain the advantages and disadvantages, comparing Android Kotlin development and Flutter Dart.
The first and main reason to start developing with Flutter is the native cross-platform functionality, meaning that you can write a single code that can run both on Android and IOS systems. That is great but why not always develop with Flutter if you can simplify a development from two platforms in one? What are the difficulties that an Android developer faces when starting to develop Flutter? First, let’s start introducing the Flutter platform.
Flutter platform
The Flutter platform is composed of the Flutter Framework which uses Dart (the programming language) and the Flutter SDK which is a set of tools to compile the code to native machine code. Flutter is built in a concept of “widget tree” where we create widgets in combination to display components on the screen.
All these widgets are compiled into the flutter sdk which handles the platform you are running the app.
Comparing Android x Flutter
The first thing I noticed when I started developing on Flutter is that it doesn’t have an UI design screen as we see on Android – to see the widget that you just created you have to compile and run the app. The good thing here is that we can use Fast Reload feature that really expedites the process. Based on that information we can see that Flutter there is no “help” to design the components on the screen. On android studio we can create a component and see the previous and therefore adjust the padding, distance to another component, color, background… On Flutter, we have to write the code, run the app and see where it goes on the screen, and then adjust the attributes of the widget.
Above there is an example of a “hello word” using dart language. Dart allows Flutter to avoid the need of a separate declarative layout language like XML in Android, or separate visual interface builders, because Dart’s declarative programming language.
Declarative Programming Language
As is quoted on the Android site: “Manipulating views manually (like findViewById(int)) increases the likelihood of errors. If a piece of data is rendered in multiple places, it’s easy to forget to update one of the views that shows it. It’s also easy to create illegal states when two updates conflict in an unexpected way. For example, an update might try to set a value of a node that was just removed from the UI. In general, the software maintenance complexity grows with the number of views that require updating”.
Based on that assumption Android has recently launched the Jetpack Compose, which uses a declarative way of programming on Android. Over time I think it will replace the xml on android and that will be the standard way of programming.
Conclusion
When starting with flutter you will be faced with two major things to learn: Dart language and how declarative language works. As an Android developer, you get used to creating UIs using xml which we can use like Constraint Layouts to attach one component to another and personalize them inside the design screen or directly on xml. On Flutter, we don’t have that and we have to use the widgets and their attributes to build the screen, that can be a little tricky to learn in the beginning but will save a lot of xml code.
Dart language is not difficult, is very similar to java(yes, using a comma) but with new features, the indentation is something very important to make code more readable.
I think as an Android Developer the first step to do is start building screens using jetpack compose in your android app, which is less verbose than a flutter and you will start to learn declarative programming.
References
Flutter course: https://www.udemy.com/course/learn-flutter-dart-to-build-ios-android-apps/
Android and Flutter: https://blog.codemagic.io/why-android-developers-should-pay-attention-to-flutter-in-2020/
https://flutter.dev/docs/get-started/flutter-for/android-devs
Declarative programming: https://developer.android.com/jetpack/compose/mental-model?hl=pt-br
Dart x Jetpack Compose: https://medium.com/@jolanda.verhoef/take-aways-comparing-flutter-to-jetpack-compose-a26775617e38
Jetpack Compose: https://developer.android.com/jetpack/compose
