Meet Flutter, the Tool for Creating iOS and Android Applications

Flutter is a Google-developed open source UI framework for creating native multi-platform applications. Flutter has evolved into a process, philosophy, and a community since the first version was released in 2017.

This tool has all the advantages of existing multi-platform tools, particularly because it targets many platforms. Flutter can create applications for iOS and Android as well as websites and desktop applications for macOS, Windows, and Linux from a single codebase. This functionality makes building applications quicker and easier.

Flutter applications are developed in the Dart programming language. Dart is an object-oriented language in the C family: if you are familiar with C#, Kotlin, Swift, or Java, you will find Dart similar and relatively easy to pick up. You can compile Dart to native code, which speeds up your application. The Skia visual rendering engine also provides Flutter apps with a performance that is comparable, if not identical, to native language applications (Swift or Kotlin).

What are the Benefits of Flutter?

This tool has several benefits to explain why developers choose Flutter:

Flutter is open source. This means you can contribute to the framework’s source code, monitor its developments, and even try out new features as they are being developed.
Flutter provides excellent animations and elaborate transitions. You can also design your own UI elements. You can compose widgets for a more creative and versatile user interface.
Flutter uses a declarative approach to design the screens. The only difference from SwiftUI or Jetpack Compose is that you can target all platforms from the same codebase.
Dart is a modern programming language that focuses on user interfaces. It is compiled in ARM or x86 native code or JavaScript. It supports all of the language’s core features that developers have learned to appreciate (and expect!), such as async/await for managing type inference and execution processes.
You can update the code and user interface with hot reload, which recreates the widget tree structure. It can then be distributed directly to the emulators and devices without reloading the state or recompiling the application.

The Disadvantages of Flutter

While Flutter provides many advantages, there are a few drawbacks to using this tool.

Flutter is not the right tool for every application. Let’s look at two areas where it has limits.

Flutter Was Not Designed for Video Games

Although you can create simple 2D games with Flutter, for complex 2D and 3D games, a multi-platform games engine technology such as Unity would be better. The latter has more field-specific features, such as physics, sprites (graphical elements that can move around the screen), resource management, multi-player support, and more.

Applications Requiring a Specific Native SDK

Flutter supports a wide range of native features. If your application relies heavily on the functionality of a device and the platform’s SDKs, it may be advantageous to code the application using platform-specific tools. Fortunately, you can usually bridge to the platform’s native code. However, Flutter does not work on all existing device types. It does not yet support watchOS, tvOS, or iOS 14 widgets, and its web support is currently limited.

Cellenza’s Recommendations for Using Flutter

Are you a Tech Lead or Head of Mobile? Follow our recommendations on using, developing, and approaching this tool to make sure you are getting the most out of Flutter.

Recommendation 1: Keep Widgets Under Control

We recommend effectively trimming your views and business logic code to avoid dealing with lengthy, illegible code with hundreds of complicated lines to read. Trimming your widgets will make your code more readable. Remember to avoid large trees and trim your code into small widgets instead. This method will also make reusing the code easier.

Recommendation 2: Unit Testing and Widget Testing

A unit test can check that a piece of code follows best practice guidelines. You can use unit testing and widget testing to ensure that a code change will not affect the existing logic. Unlike most mobile frameworks, Flutter lets you perform UI testing just as easily as unit testing.

Recommendation 3: Consider Animations

Flutter offers various tools to improve the user experience:

Rive and Lottie: two external tools that can be integrated into Flutter
AnimationController: included with the framework

Using these will allow you to create stunning animations easily and make your application more appealing to users.

Recommendation 4: Limit Packages

Packages are existing external sources and features that can be used without rebuilding them (e.g., camera file access, database access, etc.). Although incredibly useful, you should only use them where necessary. Packages can be a good choice if you want to speed up your development process and pub (the Dart programming language package manager) has a large number of them. However, be cautious when using packages: if not thoroughly researched, they can significantly impact your application in the medium and long term.

Flutter Use Case

I developed a “DSM Manager” application for the Cellenza Mobile Academy. The idea behind this application was to manage meetings within an agile team. The purpose of the application? To timebox meetings to prevent daily stand-up meetings from overrunning!

The app was created using the Flutter framework for iOS and Android. It took six weeks to complete the project.

Flutter example of app

Several needs were identified:

Ability to manage multiple sessions simultaneously
Session configuration as needed (duration, number of participants, etc.)
Light/dark mode

The project’s main steps:

Choice of architecture: Flutter offers a wide range of architectures (Business Logic Component [BLoC è find out more about Flutter State Management ]/Redux/Provider/Inherited Widget, etc.). For this particular application project, I chose BLoC since it is the most suitable, cleanest, and most native approach for mobile developers (the closest, in my opinion, to the Model-View-ViewModel [MVVM] pattern).
Animation integration: You can incorporate animations into your applications very easily with Flutter. This can have a major impact for your users. I tested various application types in the DSM Manager project: Hero, AnimationController, and Lottie. I used Hero for the screen transitions, Lottie for the icon and button animations, and AnimationController for the other animations.
Continuous integration/continuous delivery: I decided to host the application code in an AzureDevOps repository for my project. I configured the build and release pipelines to deploy my application in AppCenter (find out more about Flutter + AzureDevOps).

Flutter: Key Takeaways

Flutter is a new approach to developing multi-platform native apps with a strong visual identity. A modern, progressive, robust, and fast tool that will make the work of mobile developers easier.

Read our other posts about mobile application: