What is Flutter? Mobile app development for Android, iOS, and more
By Martin Heller
There was a time when you had to choose between creating universal mobile apps and native apps. Universal apps used web technologies like HTML and JavaScript, which often performed badly in mobile devices. Native apps performed better because they were written separately for each platform you wanted to support, but they were expensive and required a specialized development team for each platform.
Flutter, an open source framework developed by Google, changed that. Today, developers have more options for creating fast mobile apps that run on multiple platforms, including Ionic, React Native, and Xamarin. Flutter and its built-in programming language, Dart, remain popular and widely used.
Multiplatform development with Flutter 3
Flutter is an open source framework developed by Google that lets you build natively compiled, multiplatform applications from a single codebase. Flutter 3 supports six platform targets: Android, iOS, Windows, macOS, Linux, and web applications.
Flutter widgets are built using a modern framework inspired by React. As shown in Figure 1 below, the most used widgets and layouts are text widgets, Flexbox row and column layouts, stack absolute positioning layouts, positioned widgets, and container widgets.
Let's say that you are building a multiplatform application that starts with the Flutter MaterialApp widget. This widget builds various other useful widgets at the root of your application, including a navigator. The navigator manages a stack of widgets identified by strings, also known as routes in Flutter. The navigator lets you transition smoothly between application screens.
To create an iOS-centric design, see the Cupertino components package. The Flutter team recommends only using the Cupertino components on iOS-only apps; for multiplatform apps, consider using another set of widgets; for example, the Material Design set.
The first three screenshots below show stateless widgets, gesture handling, and stateful widgets. It’s worthwhile to go through the entire Flutter development tutorial, starting with the widgets intro we’ve started here. It’s also worth trying the DartPad samples and viewing the Flutter gallery, as well as trying the Flutter codelabs.
Beyond widgets and layouts, Flutter has navigation and routing, animations, actions and intents, shortcuts, state management, networking and HTTP, JSON serialization, and Firebase integration.
Flutter and Dart
Flutter is powered by Dart, a language optimized for fast apps on any platform. Dart looks rather like Java, Kotlin, Swift, and TypeScript (see Figure 4 for a comparison). If you understand any object-oriented language, you’ll be able to pick up Dart quickly. It’s worth going through at least the Dart tour.
Dart is strongly typed, but type annotations are optional because Dart can infer types. The preferred style is to use var and type inference for local variables, and strong typing for functions and public variables. Unlike Java, Dart doesn’t have the keywords public, protected, and private. If an identifier starts with an underscore (_), it’s private to its library.
Dart can compile to ARM and x64 machine code for mobile, desktop, and back end applications, as well as to JavaScript for the web. In debug mode, Dart lets you hot-load running apps after you save changes to the source code. Dart has both JIT (just-in-time) and AOT (ahead-of-time) compilers.
Dart has optional null safety. If your minimum SDK constraint (in your application's pubspec.yaml file) is at least 2.12.0, then you have opted into null safety. In that case, only variables with a type followed by a question mark (e.g., "int?") are allowed to contain nulls.
Flutter 3 features and upgrades
In a blog post, Tim Sneath, Google's product manager for Flutter and Dart, summarized new features in Flutter 3, noting that "Flutter 3 completes our roadmap from a mobile-centric to a multiplatform framework."
Flutter 3 expands available platform targets to include macOS and Linux desktop app support, fully integrates Flutter with Firebase, adds native development support for Apple Silicon, and includes numerous productivity and performance features.
Flutter Showcase and Flutter Gallery
The Flutter Showcase is essentially a collection of case studies about production apps built with Flutter. It’s most useful to managers considering Flutter.
The Flutter Gallery holds a collection of widgets, behaviors, and vignettes that demonstrate what Flutter does and how it behaves, and is most useful to developers and designers. You can view the Gallery on the web or run it locally on any of the supported platforms using the Flutter gallery repository.
Installing Flutter
You can install Flutter on Windows, macOS, Linux, or Chrome OS. Exactly how you install depends on the system. You have a choice of downloading a system-specific .zip file or tarball and unpacking it, or cloning the repository. Then, you’ll need to add the flutter tool to your path and run flutter doctor. I’ve shown the output of flutter doctor below.
You can see in the output that my Intel MacBook Pro is too old to support the minimum version of Xcode required for iOS and macOS flutter development. The Flutter team needs Xcode 13 to create universal Intel/M1 macOS binaries. I can develop for Android by installing the Android SDK toolchain, and I can already develop for the web. Adding the Flutter plugin to Visual Studio Code took less than a minute. If I ever get serious about developing multiplatform applications with Flutter, I will need to upgrade at least one of my Macs.
Conclusion
Flutter 3 is an interesting benchmark, offering stability on six platforms while continuing to focus on performance improvements. For developers who need to create multiplatform apps, now might be a good time to consider Flutter.