The official version of Flutter 2.5 is released, bringing a number of major updates

After nearly two months of version iteration, Flutter officially released the Flutter 2.5 version yesterday. According to the official introduction, this is a major version update. A total of 4600 issues have been closed, and 3932 PRs have been merged from 252 contributors and 216 reviewers.

This version continues some important performance and tool improvements, while also releasing some new features, including:

• Full screen support for Android, more Material You (also known as v3) support;
• Updated text editing to support switchable keyboard shortcuts;
• View your widgets in more detail in the Widget Inspector;
• Add new support for dependencies in Visual Studio Code projects;
• New support for obtaining coverage information from IntelliJ/Android Studio test runs;
• And provide a brand new application template to provide a better foundation for your real-world Flutter application.

Performance: iOS shader warm-up, asynchronous tasks, GC and messaging

This version brings several performance improvements.

(#25644) The first PR in this list is mainly used to connect Metal shader pre-compilation from offline training runs. It reduces the worst-case frame rasterization time by 2/3 seconds and reduces the 99th Percentile frames are reduced by half. However, shader warm-up is only one source of lag. In previous versions, processing asynchronous events from the network, file system, plug-in or other isolates may interrupt the animation. This is another source of lag.

(#25789) this version, UI isolate's event loop scheduling strategy (#25789) has been improved. Now the frame processing takes precedence over the processing of other asynchronous events, thus eliminating the stuttering caused by this problem in the test.

Another cause of lag is that the garbage collector (GC) pauses the UI thread to reclaim memory. In the past, the memory of some images was delayed in response to Dart VM's GC execution. As a solution in earlier versions, the Flutter engine would imply that image memory can be recycled through Dart VM's GC recycling, which can theoretically achieve more timely Memory recycling. Unfortunately, this also resulted in too many major GCs, and sometimes the memory cannot be reclaimed fast enough.

Therefore, in this version, ( #26219 , #82883 , #84740 ) solves the problem that the memory of unused images is not eagerly recycled, and greatly reduces the VM GC problem.

For example, in the following test, playing a 20-second animated GIF changed from requiring more than 400 GCs to only 4 times. Fewer major GCs means that animations involving the appearance and disappearance of images will reduce lag and consume less CPU and power.

Another performance improvement in Flutter 2.5 is the delay in sending messages between Dart and Objective-C/Swift (iOS) or Dart and Java/Kotlin (Android).

Generally, removing unnecessary copies from the message codec as part of messaging can reduce latency by up to 50%, but the specific data depends on the message size and device ( #25988 , #26331 ).

And, for iOS users, this version brings a major update, that is, Flutter applications built on the Apple Silicon M1 Mac can also run on the ARM iOS simulator ( #85642 ).

This means that there is no Rosetta conversion between Intel x86_64 instructions and ARM, which improves the performance of your iOS app during testing and allows you to avoid some subtle Rosetta issues ( #74970 , #79641 ), which is comprehensive Apple's development in support of Flutter went a step further.

Dart 2.14: format, language features, publishing and linting out of the box

This version of Flutter and Dart 2.14 are released together.

The new version of Dart comes with a new format to make the cascade clearer; the new pub supports ignoring files, as well as new language features, including the return of the triple shift operator. In addition, Dart 2.14 created a set of standard lints, shared between the new Dart and Flutter projects, out of the box.

Android full screen, Material You & text editing shortcuts

Starting from ( #81303 ), we have fixed a series of issues related to the full-screen mode of Android. This change also adds a way to listen to full-screen changes in other modes. For example, when a user interacts with an application, when the system UI returns, developers can now write code to perform other operations when returning to full screen.

In this version, we have added support for the specification of the new Material You (aka v3), including updates to the size and theme of the floating action button ( #86441 ). You can use the sample code in the Demo to view in MaterialState.scrolledUnder The new state PR formula example ( #79999 ).

Another improvement is the addition of scroll metrics notifications ( #85221 , #85499 ), even if the user does not scroll, it will provide hints for scrollable areas. For example, the following shows that ListView displays scroll bars according to the size of the list.

In this case, you don't need to write any code, but if you want to capture ScrollMetricNotification changes, you can do it by capturing this listener.

Another excellent community contribution is for ScaffoldMessenger. You may remember that ScaffoldMessenger has provided a more powerful way to display SnackBars since Flutter 2.0, providing users with notifications at the bottom of the screen. Now, starting with Flutter 2.5, we can add a banner to the top of Scaffold, which will remain until the user closes it.

We can get the ScaffoldMessenger of this behavior by calling the showMaterialBanner() method, as shown below.

class HomePage extends StatelessWidget {
  const HomePage({Key? key}) : super(key: key);
  @override
  Widget build(BuildContext context) => Scaffold(
        appBar: AppBar(
          title: const Text('The MaterialBanner is below'),
        ),
        body: Center(
          child: ElevatedButton(
            child: const Text('Show MaterialBanner'),
            onPressed: () => ScaffoldMessenger.of(context).showMaterialBanner(
              MaterialBanner(
                content: const Text('Hello, I am a Material Banner'),
                leading: const Icon(Icons.info),
                backgroundColor: Colors.yellow,
                actions: [
                  TextButton(
                    child: const Text('Dismiss'),
                    onPressed: () => ScaffoldMessenger.of(context)
                        .hideCurrentMaterialBanner(),
                  ),
                ],
              ),
            ),
          ),
        ),
      );
}

Material guidelines stipulate that Flutter’s banner can only be displayed one at a time. If you want to display it multiple times, you need to call showMaterialBanner and ScaffoldMessenger multiple times. You can manually maintain a queue. After the previous banner has been closed, display a new one. Banner.

At the same time, in this version, we have added a function that can be covered by text editing keyboard shortcuts ( #85381 ), which is a further optimization based on Flutter 2.0 and its new text editing functions. For example, we can select text and be able to stop its event propagation after handling keyboard events.

The DefaultTextEditingShortcuts class contains a list of keyboard shortcuts supported on each platform. If developers want to override anything, they can use Flutter's existing Shortcuts to remap any shortcuts to existing or custom intents. Use reference: DefaultTextEditingShortcuts .

Plug-ins: camera, image selector and plus plug-ins

The new version upgrades and optimizes the camera plug-in and image selector plug-in, focusing on solving the following problems:

• #3795 [Camera] android-rework Part 1: The base class that supports Android camera functions
• #3796 [Camera] android-rework Part 2: Android auto focus function
• #3797 [camera] android-rework part 3: Android exposure related functions
• #3798 [Camera] android-rework Part 4: Android flash and zoom function
• #3799 [Camera] android-rework Part 5: Android FPS range, resolution and sensor orientation function
• #4039 [Camera] android-rework Part 6: Android exposure and focus function
• #4052 [camera] android-rework part 7: Android noise reduction function
• #4054 [Camera] android-rework Part 8: The final implementation of the support module
• #4010 [camera] Does not trigger device orientation on iOS
• #4158 [Camera] Fix coordinate rotation to set focus and exposure point on iOS
• #4197 [Camera] Fix the camera preview is not always rebuilt when the direction changes
• #3992 [camera] Prevent crash when setting unsupported FocusMode
• #4151 [camera] Introduce camera_web package

plug-in has also made many optimizations to improve the end-to-end camera experience.

• #3898 [image_picker] Image picker to repair camera equipment
• #3956 [image_picker] Change the storage location captured by the camera to the internal cache on Android to meet the new Google Play storage requirements
• #4001 [image_picker] Removed redundant request for camera permission
• #4019 [image_picker] Fix the rotation problem when the camera is source

After the above optimization, the function and robustness of the Android camera and image_picker plug-in have been improved. At the same time, basic support is provided for viewing camera previews, taking pictures, using flash and zoom controls on the Web, but it is not yet an approved plug-in, so developers need to explicitly add it to use it on the Web.

Outdated API tips

In this version of Flutter, each corresponding plug-in provided by the Flutter team has a prompt similar to [Battery] to indicate whether the plug-in is out of date. If these plug-ins are identified as [Battery], then we are no longer actively maintained. We recommend using the plus version of the following plug-ins:

Flutter DevTools: Performance, Widget Inspector and Polish

This, DevTools added support for the use of engine updates ( # 26205 , # 26233 , # 26237 , # 26970 , # 27 074 , # 26617 ).

Now, using DevTools, we can better associate tracking events with specific frameworks, which helps developers analyze the causes of problems after they occur.

With the help of DevTools, we can see the complete rendering process of the page being rendered in the Frames chart, and it can be filled into this chart when the application is rendered. Select a frame from this chart to navigate to the timeline event of that frame, we can Use these events to help diagnose the problem of shader compilation freezes in the application.

DevTools will detect when frames are lost due to shader compilation so that the stuttering problem can be solved. This is basically similar to the previous steps of using DevTools for memory analysis.

In addition, when tracking CPU performance issues in applications, you may be overwhelmed by analysis data from Dart and Flutter libraries or engine native code. If you want to turn off other interference and focus only on your own code, you can use the new CPU Profiler function ( #3236 ) to achieve, this function can hide the analyzer information from these sources.

For any categories that are not filtered out, they are now color-coded ( #3310 , #3324 ), so you can easily see which part of the system the CPU frame chart comes from. Color frame diagram, used to identify app, native, Dart and Flutter code activities in the app.

At the same time, this version of DevTools comes with an update to the Widget Inspector, allowing you to hover the mouse over the Widget to obtain information such as evaluation objects, view properties, widget status, etc.

And, when a Widget is selected, the attributes of the Widget are automatically obtained.

In addition to new features, Widget Inspector has also been updated and optimized. After the update, DevTools is also more useful to debug Flutter applications.

The content of optimization and changes are specifically manifested in the following aspects:

• optimized debugging switch button : We have updated these buttons to better express their functions, and each tool tip will link to the detailed documentation of the function.
• Easier interface analysis and positioning : Widgets commonly used in the Flutter framework will display icons in the Widget tree view on the left, which are further color-coded according to categories, for example, the layout widget is displayed in blue, and the content widget is displayed in green .
• Align the color scheme of the layout explorer and the component tree : It is now easier to identify the same Widget from the layout explorer and the Widget tree. For example, the "Column" widget in the screenshot is on a blue background in the layout browser and has a blue icon in the widget tree view.

Currently, DevTools has released multiple versions, and we would love to hear your usage and thoughts on these updates. Below is a complete list of the new features of DevTools:

• Flutter DevTools 2.3.2 Release Notes
• Flutter DevTools 2.4.0 Release Notes
• Flutter DevTools 2.6.0 Release Notes

IntelliJ/Android Studio: Integration test, test coverage and icon preview

Of course, with the update of Flutter, our IntelliJ/Android Studio plug-in has also made many improvements in this version. First, the ability to run integration tests has been added ( #5459 ).

Integration testing is a way of testing the entire application running on the device. The tested code is located in the integration_test directory and uses the same functions as the testWidgets() unit test.

To add to project integration testing, need to follow instructions on flutter.dev operation, to test and IntelliJ or Android Studio connection, add integration tests run to start the configuration and connection devices for testing. Then, after restarting, run the test, including setting breakpoints, stepping, skipping, etc.

In addition, Flutter's latest IJ/AS plug-in allows you to view the coverage information of unit tests and integration test runs. You can view the test coverage information from the button on the right of "Debug".

The coverage information will be distinguished by red and green bars in the gutter of the editor. In the sample program, lines 9-13 are tested, but lines 3 and 4 are not tested.

The latest version also includes new features from the preview icon pub.dev used in packages, these packages are around TrueType font file ( # 5504 , # 5595 , # 5595 , # 5704 ) constructed on Like Material and Cupertino icons support preview.

To enable icon preview, you need to tell the plugin which packages you are using, there is a new text field in settings/preferences.

Here is more information about the IJ/AS plug-in:

• Flutter IntelliJ Plugin M57 Release
• Flutter IntelliJ Plugin M58 Release
• Flutter IntelliJ Plugin M59 Release
• Flutter IntelliJ Plugin M60 Release

Visual Studio Code: Dependencies, Fix All, and Test Runner

Flutter's Visual Studio Code plug-in has also been improved and upgraded in this version, and two new commands "Dart: Add Dependency" and "Dart: Add Dev Dependency" ( #3306 , #3474 ) have been added.

The functions provided by these commands are similar to Jeroen Meijer's Pubspec Assist plug-in. The new commands are available out of the box and provide a filtered list of packet types regularly obtained from pub.dev.

In addition, developers may also be interested in the "Fix All" command applicable to Dart files ( #3445 , #3469 ), and can fix all the same issues as dart fix in one step.

Of course, we can also set to save runtime data source.fixAll to editor.codeActionsOnSave dart.previewVsCodeTestRunner setting to test running Dart and Flutter related content.

The Visual Studio Code test runner looks slightly different from the current Dart and Flutter test runners, and it keeps running results across sessions. The Visual Studio Code test runner also adds a new gutter icon to show the final status of the test, and you can click to run the test (or right-click to get the context menu).

In the upcoming version, the existing Dart and Flutter testing tools will be removed to support the new Visual Studio Code testing tools.

Tools: exceptions, new application templates, and Pigeon 1.0

Now, the debugger has also been upgraded and optimized, and it can correctly interrupt on unhandled exceptions, which could only be caught by the framework before ( #17007 ). This improves the debugging experience because the debugger can point directly to the line of code in the code where the problem occurred.

Since the birth of Flutter, we have used Counter as an application template, which has many advantages:

• Demonstrates many features of the Dart language;
• Shows several key Flutter concepts, and it is small enough;
• Can be put in a single file, even if there are many explanatory comments;

Nevertheless, we still feel that it does not provide a very good template for Flutter development. Therefore, in this version, we provide a new template ( #83530 ), the command created is as follows:

flutter create -t skeleton my_app

The skeleton template generates a two-page list view that follows community best practices and provides the following functions:

• Used for ChangeNotifier to coordinate multiple Widgets
• Use arb file to generate localization by default
• Include sample images and create 1x, 2x, and 3x folders for image assets
• Use "function first" folder organization
• Support shared preferences
• Support light and dark themes
• Support navigation between multiple pages

Over time, we will continue to improve the new template until it is better for people who want to learn about it.

On the other hand, we also upgraded Pigeon and released version 1.0. Pigeon is a code generation tool used to generate type-safe interoperability code between Flutter and its host platform. It allows the definition of plug-in API descriptions and is available for Dart, Java and Objective-C (available for Kotlin and Swift respectively) Generate framework code.

At present, Pigeon has been used in some plug-ins of the Flutter team. In this version, it provides more useful error messages, adds support for generics, primitive data types as parameters and return types, and multiple parameters. It is expected to be developed People will use it more frequently in the future.

other

In addition, the major changes and deprecations of Flutter 2.5 are as follows:

• default drag and scroll device
• deleted the deprecated API
• import package: flutter_lints
• The accent property of
• gesture recognizer cleanup
• Replace AnimationSheetBuilder with
• Use HTML slots to present platform views on the Web
• LogicalKeySet to SingleActivator

In addition, with the release of Flutter 2.5, we will deprecate the support for iOS 8 announced in September 2020. Giving up support for iOS 8, which has a market share of less than 1%, enables the Flutter team to focus on new and more widely used platforms. Deprecation means that these platforms can work, but we will not update and plug-ins on these platforms. support.

Reference: Flutter 2.5 update