iOS and Android
Flutter 3.10 brings exciting updates for iOS and only one major update for Android. Here's a brief summary of the key enhancements:
Wireless deployment for iOS
Flutter iOS apps can now be deployed and hot reloaded wirelessly after successful pairing in Xcode. This eliminates the need for a cable connection and offers greater flexibility in app development.
Wide gamut images support
Flutter apps on iOS can now render wide gamut images accurately. By utilizing Impeller and adding the
FLTEnableWideGamut flag in the Info.plist file, developers can enable this functionality.
Improved spell check
SpellCheckConfiguration() widget now supports Apple's spell check service by default on iOS. Developers can easily incorporate spell check functionality in
CupertinoTextField using this widget.
Cupertino widgets expansion
Flutter 3.10 introduces the addition of
CupertinoRadio widgets to the Cupertino library. These widgets match Apple's styling guidelines for checkboxes and radio buttons. Additionally, Material checkbox and radio widgets now have
.adaptive constructors, dynamically switching between Cupertino and Material widgets based on the platform.
Flutter 3.10 enhances animations, transitions, and colors to align with SwiftUI. Notable improvements include updates to the CupertinoPageRoute transition, a title magnification animation for
CupertinoSliverNavigationBar, and the introduction of new iOS system colors in
Refresh rate optimization
Flutter optimizes the refresh rate on iOS when displaying animated or scrollable PlatformViews. This ensures a smoother user experience by reducing jank.
Simplified code sharing
Flutter now supports the
sharedDarwinSource key in the
pubspec.yaml file, allowing code sharing between iOS and macOS platforms.
Docs for iOS app extensions
Flutter developers now have comprehensive documentation on utilizing iOS app extensions, including live activities, home screen widgets, and share extensions. The
homescreen_widget plugins have also been updated to simplify the creation of home screen widgets and data sharing.
The Flutter documentation now includes valuable insights and guidelines for cross-platform design considerations. Developers can find detailed discussions in the Flutter UX GitHub repository.
Android CameraX support
Flutter 3.10 introduces preliminary support for CameraX in the Flutter Camera plugin. This integration simplifies the addition of camera functionality to Android apps, including image capture, video recording, and live camera preview.
In Flutter 3.10, significant improvements have been made to enhance the performance and capabilities of Flutter web apps. Here are the key updates:
Reduced file size of icon fonts
To improve load times, this release optimizes the file size of icon fonts by removing unused glyphs from both Material and Cupertino sets. This optimization reduces the overall size of the app, resulting in faster loading and improved user experience.
CanvasKit size reduction
Flutter now offers a smaller custom CanvasKit "flavor" specifically designed for Chromium-based browsers. Leveraging Google's industry-leading CDN, the hosted CanvasKit delivers improved performance by further reducing the size of the required assets. This enhancement enables smoother rendering and faster interactions across a wide range of browsers.
Flutter web embedding
Flutter web apps can now be served from a specific element within a web page, offering greater flexibility in application layout. Prior to this release, apps were limited to either occupying the entire page body or being displayed within an iframe tag. With the new update, developers can embed their Flutter web apps seamlessly into existing web pages by targeting specific elements.
Fragment shader support
Flutter web apps now have the ability to utilize Flutter's fragment shader support. This empowers developers to create visually stunning effects and customizations by leveraging shaders directly within their web applications. The addition of shader support extends the creative possibilities for Flutter web developers, enabling the creation of unique and visually compelling user experiences.
Flutter 3.10 received lots of updates for Material3 support. Let's check out the most important ones:
All Material3 components now configure the default colors of the theme's ColorScheme. The default color scheme employs shades of purple. Developers can create custom color schemes from a single "seed" color or an image, ensuring visually appealing and accessible color schemes.
This provides an M3 version of
BottomNavigationBar widget. While M3 uses different colors, highlighting, and elevation, it works as it did before. To override the default appearance of the
NavigationBars widget, use the
NavigationBarTheme widget. Though you don’t need to migrate existing apps to this component, you should use it for new apps.
Material3 offers the
NavigationDrawer widget as an enhanced version of the Drawer widget for destination selection.
NavigationDrawer displays a single-selection list of
NavigationDestinations, and developers can include additional widgets in the list. The
NavigationDrawer can also scroll when necessary, providing flexibility in design. Customization of the NavigationDrawer's appearance can be achieved using the
SearchBar and SearchAnchor
These components introduce predictive text support for search queries. When a user enters a search query, the app generates a list of matching responses in a dedicated "search view." The user can then select a response or refine the query. To modify the appearance of these components, developers can utilize the
Material3 enables the creation of a second tier of tabbed content with the
TabBar.secondary widget. This feature allows for better organization and navigation within the app.
DatePicker and TimePicker
The M3 version of
TimePicker updates their colors, layout, and shapes, enhancing the visual experience without changing the API. Both widgets now include their respective theme widgets,
BottomSheet, ListTile and Drawer
Material3 updates these components with various improvements.
BottomSheet gains an optional drag handle, controlled by the
ListTile receives updates to positioning, spacing, and alignment, while the
Drawer undergoes color and elevation changes, accompanied by minor layout adjustments.
Material3 enhances all
TextField widgets to support native gestures, ensuring consistent behavior across different input methods. Double-clicking or triple-clicking with a mouse now mimics double-tapping or triple-tapping on touch devices.
CupertinoTextField widgets utilize these features by default.
useMaterial3theme flag in their MaterialApp theme, with
truein the next stable release.
Flutter 3.10 introduces a range of performance improvements and bug fixes to enhance the overall stability and responsiveness:
New graphics engine
With over 250 commits in this release, Impeller becomes the default renderer on iOS. It offers better performance and reduces jank, resulting in improved consistency and responsiveness for iOS apps. Impeller has also made significant advancements in reducing memory footprint and improving performance on newer iPhones and iPads.
Several optimizations have been implemented to eliminate jank and improve overall app performance. Notably, setting the
FlutterViews background color to a non-nil value slashes the time to obtain the next drawable layer from the Metal driver, resulting in higher frame rates, especially on recent iOS 120Hz displays. Additionally, loading of local images has been shifted to a background thread, reducing potential pauses and improving load times.
iOS startup latency
Inefficient strategies for identifier lookups in app bundles were addressed, significantly reducing startup latency. Large production applications may experience a startup latency reduction of approximately 30-50%.
Flutter now utilizes
SkParagraph as the default library for text shaping, layout, and rendering, resulting in improved performance and consistency. As a result, the legacy
minikin libraries, along with their associated flag, have been removed, reducing Flutter's compressed size by 30KB.
Partial repaint feature
In the 3.0 release, an Android feature was enabled in the rendering pipeline, utilizing advanced GPU driver features to repaint only the necessary screen regions. However, due to practical limitations and limited device support, this feature has been disabled on Android. It remains enabled on iOS with the Skia backend, and plans are in place to enable it with Impeller in future releases.
Flutter 3.10 introduces enhanced development tools with improved security, a modernized UI, and some additional features:
DevTools UI and new features
The DevTools UI has been modernized with Material 3, providing a fresh look and improved accessibility. The DevTools console now supports evaluations for a running app in debug mode, allowing developers to interact with the app even when it's not paused. Additionally, a new embedded Perfetto trace viewer replaces the previous timeline trace viewer, offering better performance and handling larger datasets. Perfetto introduces new features such as thread pinning, selecting multiple timeline events across frames, and using SQL queries to extract specific data from timeline events.
SLSA level 1 support
The Flutter Framework now complies with SLSA Level 1, implementing various security features. These include a scripted build process that enables automated builds on trusted platforms, multi-party approval workflows with audit logging, and provenance to ensure the integrity of framework release artifacts. These security enhancements not only improve the supply chain security of Flutter but also pave the way for future compliance with SLSA Level 2 and Level 3.
Android Studio Flamingo
Upgrading to Android Studio Flamingo may introduce an error when running or building Flutter Android apps. This error arises due to the bundled Java SDK update from version 11 to 17 in Android Studio Flamingo, which causes incompatibility with Gradle versions earlier than 7.3. To assist developers in resolving this issue, the Flutter team has updated the
flutter analyze --suggestions command to validate if the error is caused by the Java SDK and Gradle version mismatch.
Flutter 3.10 introduces significant updates and enhancements that elevate the development experience. From improved performance and stability to refreshed Material Design components, enhanced DevTools, and a migration guide for Android Studio Flamingo, Flutter 3.10 empowers developers to create exceptional cross-platform applications.
If you found this article informative and valuable, we encourage you to share it with fellow developers and enthusiasts who may benefit from the latest insights and advancements in Flutter. Let's spread the word about Flutter 3.10 and continue building amazing apps together.