What is new in Flutter 3.27?

10 min readDec 24, 2024

Explore the power of Flutter 3.27 for an improved development experience and app performance.

Flutter got better! We have new updates across the entire ecosystem. From progress with Impeller and improvements to Cupertino widgets, Flutter has improved developers’ and users’ experience.

With a growing community and contributors and 1400+ commits, Flutter is delivering an amazing experience for next-gen app development.

Are you ready to take your app development in 2025? Try Flutter’s new features.

Framework Updates

1. Cupertino updates

This update makes a bunch of improvements to iOS-style widgets (like buttons, checkboxes, and switches) in the Flutter framework to make them look and work better. It includes-

Checkbox and Radio Button Updates:

The size, colors, and behavior of the iOS-style checkboxes and radio buttons have been improved.
You can now customize things like mouse cursors, labels, and images inside these widgets.
Some old properties (like the inactive color of a checkbox) are removed, and others (like track color on switches) have new names.

Segment Control:

The segmented control widget (the one with “tabs” you can switch between) has new updates to make it look and behave more like iOS.
You can now disable specific segments and lay out the segments based on their content.

Navigation Bar Improvements:

The navigation bars (top bars that show the title of the screen) now have a transparent background until you scroll down. This allows for smoother transitions between the expanded and collapsed states.

Button Updates:

Buttons now support new styles from iOS 15+.
You can make buttons with a translucent background and handle long presses and keyboard shortcuts.

Pickers and Alerts:

The date picker and other pickers will now scroll to the item you tap on.
The alert dialogs now support a “tap-slide” gesture, which lets you slide to dismiss them.
Action sheets (menus with options) have better spacing and font sizes, and can now give haptic feedback when you slide over options.

Other Small Fixes:

Some widgets like the context menu (CupertinoContextMenu) can now scroll if there are too many items.
The DatePicker no longer cuts off long text.
The magnifier widget now supports zooming effects.

2. Material Themes

In this update, some Material design components (like cards, dialogs, and tab bars) have been improved to follow a more consistent way of setting their appearance in Flutter.

What changed?

CardTheme, DialogTheme, and TabBarTheme were updated to match Flutter’s standard way of handling theme settings.
New settings were added: CardThemeData, DialogThemeData, and TabBarThemeData. These allow you to customize the appearance of these components more easily and consistently.

Why?

This makes it simpler and more predictable to style components across your app.
Future updates will continue improving and unifying the theming process, so it’s easier to make your app look the way you want.

3. Improved Carousel View

What’s new? You can now control how items in the carousel are sized and arranged with a feature called weighted layout. The flexWeights parameter lets you set the “weight” or size of each item in the carousel. For example:

For example, [3, 2, 1] creates a multi-browse layout, [7, 1] produces a hero layout, and [1, 7, 1] yields a centered-hero layout. It helps you create different layouts with more control over the design.

4. More in Material

This update brings small improvements and fixes to make things work better.

Enhancements (Improvements)

SegmentedButton: You can now arrange items vertically, not just horizontally.
Button Customization: Buttons like ElevatedButton and OutlinedButton now have more options to customize icons (like size and color) through a new feature called styleFrom.

Bug Fixes

Icon Size and Color: The default size and color for icons in buttons now match Material 3 standards, making them more consistent.
AppBar Scroll Behavior: The top bar (AppBar) now behaves correctly when you open the navigation drawer, just like in Android.
Menu Anchor: Fixed issues with dropdown menus, including better focus handling and scrolling problems when you have nested scrollable content.

5. Mixing Route Transitions

Sometimes, when you switch between pages, you want the old page to leave the screen in a specific way while the new page enters with its own transition.

Now, with ModalRoutes you can share exit transitions. This means the old page can leave with its own transition, while the new page enters smoothly at the same time.

This update lets you synchronize different page transitions, so when you move from one page to another, both the old and new pages can have their own smooth, matching animations.

Apart from this, you will also see some other improvements.

Text Selection Improvements- You can now use Shift + Click to adjust the text selection position on Linux, macOS, and Windows. There’s a new method to clear text selection in a SelectionArea or SelectableRegion.
Row and Column Spacing- You can now easily add space between items in Rows and Columns with a simple spacing parameter, reducing the need for extra code.

Engine Updates

1. Impeller on Android

What’s new?

Impeller Engine on Android: The Impeller rendering engine is now the default for drawing graphics on newer Android devices. It’s faster and looks better, thanks to updates made after feedback from users.
Older Devices: On older Android devices or those without Vulkan support, the old Skia engine will still be used, so nothing changes for those devices.
Opt-out Option: If you don’t want to use Impeller, you can switch back to Skia by adding a setting in your app’s files or using a special command.

Impeller is now the default way of drawing things on newer Android devices for better performance, but older devices still use the old method, and you can switch back if needed.

2. Improvements on iOS devices

Previous Issue: On iOS devices, apps would sometimes experience delays in drawing graphics.

This was due to compositor backpressure, where the system would make the app wait before starting to draw, causing frame delays(also called jank).

This issue was more noticeable on devices with high refresh rates, like 120Hz screens.

Improved Rendering: A new Metal rendering surface (added by a contributor) allows Flutter to start drawing frames more smoothly and without waiting.

This means the app’s performance is more stable, and the app will consistently hit 120Hz on devices with high refresh rates.

This update fixes a problem where iOS apps were delayed in drawing frames, making them smoother and more consistent, especially on high-refresh-rate devices like 120Hz screens.

3. Framework Wide Gamut Colors

What’s new?

Wider Color Support: Flutter now supports using DisplayP3 colors, which allows apps to take full advantage of the high-quality displays on iOS devices. This means colors in your app can look more vibrant and true to life on supported screens.
More Colors: Flutter now supports a wider range of colors with more detailed shades in both sRGB (standard color space) and DisplayP3.

Flutter now supports more vibrant colors on iOS devices by using the DisplayP3 color space, making your app’s visuals look even better.

Web Improvements

What’s new in Flutter Web?

Faster Image Loading- In Safari and Firefox, images are now decoded using the standard <img> element instead of a more complex WebAssembly (WASM) method. This makes images load faster and reduces memory usage.
Better Rendering- Platform views (like native UI elements) are optimized to reduce unnecessary layers, making rendering more efficient.
WebAssembly Compatibility- All official Flutter plugins and packages now work smoothly with WebAssembly (a technology that runs code faster in browsers).
Improved Accessibility- Fixes for things like headings, dialogs, password fields, iOS keyboards, links, and scrolling to make Flutter web apps more accessible to everyone.
Bug Fixes- Fixed issues in rendering, like problems with image filters, clipping, and memory use in the CanvasKit and Skwasm renderers.
Better Drag Scrolling- Scrolling while dragging in multi-view mode is now smoother.

Also read- 7 Top Flutter Web Tips for Faster, Better Development: Expert Guide

iOS Improvements

Swift Package Ecosystem- Flutter is moving to Swift Package Manager (SPM), which means Flutter can now use the growing collection of Swift packages. This opens up more tools and libraries for Flutter developers who are working on iOS apps.
Easier Setup- Swift Package Manager comes bundled with Xcode, so you won’t need to install extra tools like Ruby and CocoaPods to use Flutter on Apple platforms. This simplifies the setup process.
Availability- Swift Package Manager support was only available on the main Flutter channel before, but now it’s also available on the beta and stable channels.
Off by Default- For now, Swift Package Manager support is turned off by default while they fix any remaining issues.
Plugin Support- Developers of Flutter plugins are encouraged to support Swift Package Manager. Popular plugins like Firebase and others have already switched to it.
Pub.dev Checks- Pub.dev (Flutter’s package site) now checks if plugins are compatible with Swift Package Manager. In the future, plugins that don’t work with it won’t get full ratings.
Flutter is moving to Swift Package Manager for iOS apps, making it easier to work with iOS packages and simplifying setup. The feature is now available on more Flutter channels, but it’s off by default for now.

Android Improvements

1. Edge-to-Edge Mode

On devices running Android 15+, apps will now use edge-to-edge mode, meaning the app will take up the whole screen without any bars or borders at the top or bottom.

This gives a more immersive, full-screen experience by default. If you don’t want this, you can opt out by following the guide.

2. Support for Freeform Windows

Android’s Freeform mode lets users resize app windows (like on a desktop). Flutter has been updated to handle this better, making sure apps work well when the window overlaps or moves over areas like hardware cutouts(e.g., notches or camera holes).

3. Kotlin Build Script Support

Kotlin is now supported for writing build scripts in Flutter. You can use build.gradle.kts files instead of the older Groovy scripts.
Flutter 3.27 will be the last version to support the old Groovy build method. New apps will use Kotlin build files by default.
This change will make the build process more stable and easier to maintain, especially when writing tests for your build code.

Ecosystem Improvements

1. Package download counts on pub.dev

On pub.dev (a website for Flutter and Dart packages), they now show download counts for each package.

This is a more accurate way to measure how popular a package is, instead of the old “popularity score.”

When you visit a package page, you’ll see:

A 30-day download count — This shows how many times the package was downloaded in the past month.
An interactive sparkline chart — A small graph that shows how downloads have changed each week. This helps you spot trends, like if a new version of the package is being downloaded a lot, or if it’s becoming less popular.

Each time a package is downloaded from pub.dev, it counts as one download. This includes downloads from tools, CI systems, or users.

2. Pub workspaces

In Dart 3.6, a new feature called Pub Workspaces is being introduced. This is useful when you’re working on multiple related packages (like different parts of a bigger project) that are stored together in the same folder (called a monorepo).

Here’s how it works:

One root file: You create a special file at the top of your project (called the root pubspec) that lists all the packages in the project.
Shared dependencies: When you run the command pub get, it will make sure that all the packages in the project use the same versions of dependencies (the tools or libraries they need). This helps avoid conflicts and makes everything work smoothly together.
Faster analysis: The Dart analyzer (a tool that checks for errors in your code) will work more efficiently. Instead of checking each package individually, it will check the entire project at once, saving memory and speeding up the process when you open the project in your code editor.

Apart from this, here are some other improvements-

Automated publishing of Flutter packages: You can now automatically publish Flutter packages from GitHub to pub.dev using a new GitHub Actions workflow, making it easier to contribute to the Flutter ecosystem.
Interactive Media Ads plugin: A new plugin lets you easily add interactive video ads (like VAST-compliant ads) to Flutter apps for both iOS and Android.
In-App Purchase iOS/macOS updates: The in_app_purchase_storekit package now supports StoreKit 2 for better subscription management, replacing the old StoreKit 1 APIs in iOS 18.

DevTools and IDEs

The latest Flutter DevTools updates bring several useful improvements.

iOS Deep Link Validation: You can now check if your deep links (URLs that open specific parts of your app) work correctly on both Android and iOS using the DevTools Deep Links tool.
Export and Import Data: You can now export network data (like requests) as a .har file and import memory snapshots to view them later, even if you’re not connected to a running app.
Better Memory Data Handling: If your app crashes while you’re debugging a memory issue, DevTools will now let you keep seeing the most recent memory data instead of losing it.

1. Flutter DevTools — New Flutter Inspector

The Flutter Inspector has been updated to make debugging your app’s UI easier. To try the new version, just turn on the “New Inspector” setting.

Here’s what’s new:

Condensed Widget Tree: The widget tree (a list of all your app’s UI elements) is now more compact, making it easier to see deeply nested widgets, especially when you don’t have a lot of screen space (like in an IDE).
Toggle Implementation Widgets: You can now choose whether to show extra widgets added automatically by Flutter or other packages (called “implementation widgets”). This helps keep your widget tree cleaner and focused on what you built.
Detailed Widget View: When you select a widget, you can see more information about it, including its layout, properties, and how it behaves with its children, especially for Flex widgets (like Rows and Columns).

2. Flutter DevTools — Try with WebAssembly

You can now try a new version of DevTools that uses WebAssembly (WASM) for better performance.

To use it, just turn on the WebAssembly feature in the DevTools settings. This version is expected to run faster than the regular JavaScript version of DevTools. Since it’s still experimental, if you find any problems with it, you can report them to help improve it.

All these changes have elevated Flutter’s performance.

Deprecations

Starting with Dart 3.6, older Dart SDK versions (before 3.0) will no longer have official support in IDE plugins like VS Code and IntelliJ.
The tools may still work with older SDKs, but no fixes or support will be provided for issues related to them.
By Dart 3.7 (expected in early 2025), support for these older SDK versions will be completely removed.
Future plugin updates may not be compatible with older Dart SDK versions.

To stay ahead and build new projects on Flutter 3.27, connect with a leading Flutter app development company for a better development approach and implementation.