The beta version of ArcGIS Maps SDK for Flutter has been released. In this article, we introduce the release announcement and an overview of the SDK by translating the article from Esri in the USA titled Announcing the new ArcGIS Maps SDK for Flutter beta .
Introduction
With the first public beta release of ArcGIS Maps SDK for Flutter, developers now have a new way to create cross-platform native mobile applications equipped with ArcGIS capabilities.
This blog post introduces the main features and benefits of the new ArcGIS Maps SDK for Flutter, as well as Flutter itself.
Access to the beta is available from Esri's Early Adopter site, but for more details about this SDK newly added to the ArcGIS Maps SDKs for Native Apps family, please see this article!
Flutter
Flutter is an open-source technology created by Google that is rapidly gaining popularity in cross-platform mobile app development due to its rich tools and productivity features, strong developer community, and fast development cycles. The Flutter framework is based on Dart (a concise and modern programming language) and is a reactive, declarative UI framework designed to build natively compiled cross-platform applications. Its first-class tooling environment and rapid app prototyping allow developers to seamlessly build and iterate on app designs.
For the reasons behind deciding to release ArcGIS Maps SDK for Flutter, please refer to the previous blog post.
ArcGIS Maps SDK for Flutter Beta
The Flutter Maps SDK combines the advantages and features of Flutter with the geospatial and location capabilities of ArcGIS Maps SDK for Native Apps! Those already familiar with the Native SDK family will quickly get accustomed to this first Flutter Maps SDK beta’s features such as mapping, geocoding, routing, and offline APIs.
As a beta product, features will be added incrementally. This initial beta focuses on basic online/offline 2D map display, geocoding, routing, and data editing workflows. We plan to add features with each new release until it matches other native SDKs. For more details, please visit the Early Adopter site.
To give you an overview of the Flutter Maps SDK beta features, we have prepared a sample repository on GitHub called ArcGIS Maps SDK for Flutter Sample Repository. This repository is regularly updated with new samples and serves as an important component of the entire SDK.
You can check various samples demonstrating the features of the ArcGIS Maps SDK for Flutter beta.
This repository contains sample code showing how to use the Flutter Maps SDK beta features in your own apps. It explains how typical Native SDK workflows operate within a Flutter app with samples such as:
Layers | Renderers | Symbol Display |
|---|
Map Display | Geometry | Routing |
Geocoding | Attribute Display | Offline Workflow |
Query | Feature | Location |
Data Display | Authentication | Mobile Map Package |
The repository also includes a sample viewer app that can run on iOS and Android simulators or devices, allowing developers to easily browse samples collectively or run them individually.
The sample set in the ArcGIS Maps SDK for Flutter beta repository showcases features like device location, magnifier, routing, and more.
After downloading the Flutter Maps SDK beta package from the Early Adopter site
, and following startup instructions, you are ready to create your first Flutter Maps SDK app. Remember that with Flutter you can build apps from a single codebase and run them on both iOS and Android emulators or devices.
Next, we explain key concepts of building with Flutter and how they can be combined with ArcGIS capabilities.
Flutter Widget
A core concept of Flutter is that UI is built using Flutter Widgets. Widgets are components of an app’s UI that define both layout and interactive elements while managing state.
When creating an app with any Native SDK, a Map View functions as the user interface displaying map layers and graphics. In the Flutter Maps SDK beta, the ArcGISMapView class itself is also a widget, giving you full control over where to place maps within your application. For example, you can wrap it in a Flutter Stack widget to overlay UI controls on top or wrap it in a Flutter Expanded widget to fill remaining screen space in your app.
Example widget tree showing an ArcGISMapView widget inside a Stack widget in the Set Basemap sample.
You can also easily refactor widgets in your chosen IDE for Flutter by wrapping existing widgets with new ones or removing them according to your app design requirements. The Flutter widget tree provides a simple reference method to understand your app’s design architecture.
With app design in mind, let’s move on to discuss Flutter’s hot reload feature. It updates UI layouts live on devices or emulators without recompiling.
Hot Reload
A popular feature of Flutter is Stateful Hot Reload (also known as hot reload). It works by injecting updated code into the Dart Virtual Machine (VM), which then triggers Flutter to rebuild the widget tree when updated.
For example, as demonstrated by Flutter engineer Jennifer Merritt at the 2024 Developer Summit held in Palm Springs, you can update code to move buttons within an app instantly.
Here is another example of hot reload: quickly prototyping design changes by updating an app theme from purple to white and blue (using the Set Basemapsample in this case).
An example showing how hot reload makes it easy to preview design changes in an ArcGIS Maps SDK for Flutter app.
Conclusion
Please try out the new ArcGIS Maps SDK for Flutter beta! The beta is accessible from the Early Adopter site, and you can check out samples from GitHub’s ArcGIS Maps SDK for Flutter Sample Repository. Combine ArcGIS capabilities with Flutter’s productivity to build cross-platform mobile applications.
There is a dedicated forum on the Early Adopter site where you can share what you like about the Flutter Maps SDK or suggest additional features you want!
We plan to introduce how to build geospatial apps using the new ArcGIS Maps SDK for Flutter beta soon on the ArcGIS Blog.
