What has been upgraded in Flutter 2.2?

Old iron remember to forward, Brother Mao will present more Flutter good articles~~~~

WeChat flutter training group ducafecat

original

https://medium.com/flutter/whats-new-in-flutter-2-2-fd00c65e2039

text

The 2.2 release focuses on improvements and optimizations, including iOS performance improvements, Android delay components, updating service workers for the Flutter web, and more!

Today is the day when we make Flutter 2.2 available. You can start a new installation by switching to the stable channel and upgrading the current Flutter installation, or by going to Flutter.dev/docs/get-started.

Although Flutter 2 is only a few months away, we still have many improvements to share in 2.2. This version merged 2,456 PRs and closed 3,105 issues in the framework, engine, and plug-in library. Especially loudly appealing to the Flutter community to provide a large number of public relations and public relations reviews, including Abhishek01039 who contributed the most PRs (17) and xu-baolin, who reviewed the most PRs (9) Flutter 2.2. Thanks to all the contributors for their help to make Flutter 2.2 a stable channel. We can't do it without you.

Every new version of Flutter released to stable will bring a new set of updates, whether it is performance enhancements, new features or bug fixes. In addition, a version also includes some features that are not ready for production use, but we hope you can verify that they work the way you want. Finally, each new version comes with a set of related tool updates and updates from the larger Flutter community. To be honest, a lot of things have happened with every new version of Flutter recently. We can't reasonably capture all the content in a blog post, but we will try to highlight the key points.

Flutter 2.2 update under stable

This version covers a series of improvements over Flutter 2, including cross-Android, iOS and web updates, new material icons, text processing updates, scroll bar behavior, and mouse cursor support for TextSpan widgets, and how to start from a single source New guides in the code base that best support multiple platforms. All these features can now be used stably and can be used in production applications. They are all built on a new release of Dart.

Dart 2.13

Flutter 2.2 comes with Dart 2.13 version. In addition, this Dart update includes a new type alias feature, which allows you to create aliases for types and functions:

// Type alias for functions (existing)
typedef ValueChanged<T> = void Function(T value);

// Type alias for classes (new!)
typedef StringList = List<String>;

// Rename classes in a non-breaking way (new!)
@Deprecated("Use NewClassName instead")
typedef OldClassName<T> = NewClassName<T>;

Type aliases can provide good short names for long and complex types, and it also allows you to rename classes in a non-destructive way. There are more new features in Dart 2.13, please check the Dart 2.13 release announcement for details.

https://medium.com/dartlang/announcing-dart-2-13-c6d547b57067

Flutter web update

Flutter's latest stable platform web has been improved in this version.

First, we optimized the caching behavior with the new service worker loading mechanism and fixed the double download of main.dart.js. In earlier versions of Flutter web, service workers downloaded updates to your app in the background, while allowing your users to access the outdated version of your app. Once the update is downloaded, users will not see these changes until they refresh the browser page several times. In Flutter 2.2, when a new service worker detects a change, users will wait until the update is downloaded before they can use the application, but they will see the update afterwards, without the need to manually refresh the page a second time.

Enabling this change requires you to regenerate the index.html of your Flutter application. To do this, save the changes, delete index.html, and then run flutter create. Recreate it in your project directory.

We have also made improvements to these two web page renderers. For HTML, we added support for font features to support setting FontFeature, and use canvas api to render text so that the text appears in the correct position when the mouse is hovered. For HTML and CanvasKit, we added support for shaded masks and computelinetrics, which resolved the parity gap between Flutter web and mobile apps. For example, developers can now use opacity masks to perform fade transitions using tinted masks, and computelinetrics can be used just like mobile apps.

For Flutter web pages, as well as Flutter general, accessibility is one of our highest priorities. According to the design, Flutter achieves accessibility by building a SemanticsNode tree. Once the Flutter web application user has enabled accessibility, the framework will generate a DOM tree parallel to the RenderObject DOM tree and convert the semantic attributes to Aira. In this version, we improved the location of semantic nodes to narrow the gap between mobile and desktop web applications when using transitions, which means that when widgets use transition design, the focus frame should appear correctly on the element . To see this effect, please watch the video of Victor Tsaran, who led the accessibility project for material design, using VoiceOver with Flutter Gallery App:

We have also disclosed the semantic node debugging tree, which has a command line flag in the profile and release mode to help developers debug accessibility by visualizing the semantic node created for the web application.

In order to enable your own Flutter web application to use this feature, run the following command:

$ flutter run -d chrome --profile \
 --dart-define=FLUTTER_WEB_DEBUG_SHOW_SEMANTICS=true

After activating the flag, you will be able to see the semantic node at the top of the widget, so you can debug and see if the semantic element is placed where it shouldn't be. If you find such an example, please don't hesitate to submit a bug report.

https://goo.gle/flutter_web_issue

Although we have made significant progress in supporting a core set of accessibility features, we will continue to improve accessibility support. In the main and development channels other than the 2.2 stable version, we have added an API that allows developers to automatically enable application accessibility programmatically and solve problems by using Tab with a screen reader.

Last, but certainly not least, the latest version of Flutter DevTools now supports the layout browser for your Flutter web application.

This update provides you with the same web page layout debugging tools as your mobile and desktop applications.

iOS page conversion and incremental installation

For iOS, in this version, we have made Cupertino's page transition smoother by reducing the time required to render the animation screen by 75%, and it may be more on low-end phones. We are not just looking for improvements in end-user performance, we are also always looking for ways to improve development performance.

In this version, we implemented incremental iOS installations during the development process. In our benchmark tests, we found that the time to install the upgraded iOS app has been reduced by 40%, which reduces the turnaround time when testing app changes.

Use Flutter to build platform adaptive applications

As Flutter expands to support more stable platforms, it becomes useful to consider applications that not only support different form factors, such as mobile devices, tablets, and desktops, but also different input types (touch and mouse + keyboard) and belts. There are platforms with different idioms, such as navigation drawers and navigation system menus. We call applications that can be adjusted according to the details of different target platforms as "platform adaptive" applications.

In order to introduce the things you need to pay attention to when building a platform adaptive application, we will introduce you to Kevin Moore's building platform adaptive application conference. For more details, check out the platform adaptive application guide on flutter.dev.

Build platform adaptive applications
https://events.google.com/io/session/868dfd56-7f8c-49ee-84ad-ac69a23ba19d?lng=en
guide
https://flutter.dev/docs/development/ui/layout/building-adaptive-apps

Finally, for sample applications written for multiple platforms based on these principles, we recommend the Flokk and Flutter Folio applications from gSkinner. You can download the code of Flokk and Folio, you can also download Flokk and Folio from various app stores, or run them directly from the browser. Another good example is the application used to create the guide itself:

https://flutter.gskinner.com/flokk

https://flutter.gskinner.com/folio

https://flutter.gskinner.com/flokk/#g-download

https://github.com/gskinnerTeam/flutter-folio

The UX part of the Flutter Platform Adaptive Application Guide is based on the new large-screen material guide. This new guidance from the Material team includes the rework of several major layout articles, as well as updates to several components and an updated design toolkit, all of which take the big screen into account.

https://material.io/blog/material-design-for-large-screens

Flutter's goal has always been to make the application not only run on multiple platforms; we have to wait until your application runs well on all your target platforms. The support can not only target applications on multiple platforms, but also adjust applications according to the screen size, input mode, and habits of each platform.

More Material icons

Regarding the subject of Material guidance, in this version, we have added more than one but two new Material icons for Flutter, including a Dash's own icon!

https://github.com/flutter/flutter/pull/78311

These updates bring the total number of texture icons in your application to more than 7000. If you have trouble finding the icon you want, then among those embarrassing wealth (who doesn't?) you can search by category and name at fonts.google.com/icons.

http://fonts.google.com/icons

按名称搜索 Flutter 材质图标

Once you find the perfect icon, the new "Flutter" tab will tell you how to use it, or you can download this icon as a standalone asset in the app. Adding Dash to your Flutter application has never been easier.

Improved text processing

As we continue to improve Flutter to support the details of each platform, we continue to advance new areas that are not as important in mobile form factors as they are in desktop form factors. One area is text processing. In this version, we have begun to refactor how we handle text input to achieve functions such as canceling the keystrokes that bubble in the widget hierarchy, and by introducing completely custom keystrokes related to text actions.

Being able to cancel keystrokes allows Flutter to implement things such as using the space bar and arrow keys without triggering scroll events, giving your end users a more intuitive experience. You can use the same function to process keystrokes and then send them to the parent widget in your own application. Another example is that in this version, you can select Tab between a TextField and a button in the Flutter application, and it works as expected:

import 'package:flutter/material.dart';

void main() => runApp(App());

class App extends StatelessWidget {
 @override
 Widget build(BuildContext context) => MaterialApp(
       title: 'Flutter Text Editing Fun',
       home: HomePage(),
     );
}

class HomePage extends StatelessWidget {
 @override
 Widget build(BuildContext context) => Scaffold(
       body: Column(
         children: [
           TextField(),
           OutlinedButton(onPressed: () {}, child: const Text('Press Me')),
         ],
       ),
     );
}

Flutter 2.2 可以取消冒出窗口部件层次结构的击键，例如允许 TAB 从 TextField 更改焦点

Custom text operations allow you to do things, such as special handling of the Enter key in the TextField; for example, you can trigger a message to be sent in the chat client while still allowing Ctrl + Enter to insert a new line. These same text operations allow Flutter itself to provide different keystrokes to match the text editing behavior of the host OS itself, for example, Ctrl + c is used on Windows and Linux, and Cmd + c is used on macOS.

https://github.com/flutter/flutter/pull/75032

As an example, the following example rewrites the default left arrow operation and provides a new operation for the backspace and delete keys:

import 'package:flutter/material.dart';
import 'package:flutter/services.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
 @override
 Widget build(BuildContext context) => MaterialApp(
       title: 'Flutter TextField Key Binding Demo',
       home: Scaffold(body: UnforgivingTextField()),
     );
}

/// A text field that clears itself if the user tries to back up or correct
/// something.
class UnforgivingTextField extends StatefulWidget {
 @override
 State<UnforgivingTextField> createState() => _UnforgivingTextFieldState();
}

class _UnforgivingTextFieldState extends State<UnforgivingTextField> {
 // The text editing controller used to clear the text field.
 late TextEditingController controller;

 @override
 void initState() {
   super.initState();
   controller = TextEditingController();
 }

 @override
 Widget build(BuildContext context) => Shortcuts(
       shortcuts: <LogicalKeySet, Intent>{
         // This overrides the left arrow key binding that the text field normally
         // has in order to move the cursor back by a character. The default is
         // created by the MaterialApp, which has a DefaultTextEditingShortcuts
         // widget in it.
         LogicalKeySet(LogicalKeyboardKey.arrowLeft): const ClearIntent(),

         // This binds the delete and backspace keys to also clear the text field.
         // You can bind any key, not just those already bound in
         // DefaultTextEditingShortcuts.
         LogicalKeySet(LogicalKeyboardKey.delete): const ClearIntent(),
         LogicalKeySet(LogicalKeyboardKey.backspace): const ClearIntent(),
       },
       child: Actions(
         actions: <Type, Action<Intent>>{
           // This binds the intent that indicates clearing a text field to the
           // action that does the clearing.
           ClearIntent: ClearAction(controller: controller),
         },
         child: Center(child: TextField(controller: controller)),
       ),
     );
}

/// An intent that is bound to ClearAction.
class ClearIntent extends Intent {
 const ClearIntent();
}

/// An action that is bound to ClearIntent that clears the TextEditingController
/// passed to it.
class ClearAction extends Action<ClearIntent> {
 ClearAction({required this.controller});

 final TextEditingController controller;

 @override
 Object? invoke(covariant ClearIntent intent) {
   controller.clear();
 }
}

按左箭头或 ESC 可以清除文本

We still have more work to do, but we are working hard to provide you with complete text editing operations. Our goal is that when the Flutter desktop becomes stable, your users will not be able to tell the difference between editing text in the Flutter application and other applications in the host operating system.

Auto scroll behavior

As part of our continuing pursuit to make Flutter apps behave like the best apps on every platform, we have revisited the scroll bar in this version. When the scroll bar is actually displayed, Android and iOS are the same; they do not display the scroll bar by default. On the other hand, for desktop applications, when the content is larger than the container, scroll bars are usually displayed automatically, which requires you to add a scroll bar parent widget. In order to get the correct behavior on mobile or desktop, this version automatically adds scroll bars when necessary.

Consider the following code without scroll bars:

import 'package:flutter/material.dart';

void main() => runApp(App());

class App extends StatelessWidget {
 @override
 Widget build(BuildContext context) => MaterialApp(
       title: 'Automatic Scrollbars',
       home: HomePage(),
     );
}

class HomePage extends StatelessWidget {
 @override
 Widget build(BuildContext context) => Scaffold(
       body: ListView.builder(
         itemCount: 100,
         itemBuilder: (context, index) => Text('Item $index'),
       ),
     );
}

When running on the desktop, a scroll bar will appear:

If you don't like the appearance of the scroll bar, or always show the scroll bar, you can set ScrollBarTheme. If you don't like this default behavior, you can change it within the scope of the application or on a specific instance by setting ScrollBehavior. For more details on the new default scroll bar behavior and how to migrate the code to the new set of best practices, please check the documentation on flutter.dev.

https://flutter.dev/docs/release/breaking-changes/default-desktop-scrollbars

Mouse cursors over text spans

In previous versions of Flutter, you can add a mouse cursor to any widget (just like a hand pointing to something clickable). In fact, Flutter itself adds those mouse cursors for you in most cases, such as adding a manual mouse cursor to all buttons. However, if you want a series of rich texts that have different text spans and their own styles, and may have a long enough time to wrap, then you are out of luck ーーTextSpan is not a widget, so it cannot be used as The visual range of the mouse cursor... until now! In this version, when you have a TextSpan with a gesture recognizer, you will automatically get the corresponding mouse cursor:

import 'package:flutter/gestures.dart';
import 'package:flutter/material.dart';
import 'package:url_launcher/url_launcher.dart' as urlLauncher;

void main() => runApp(App());

class App extends StatelessWidget {
 static const title = 'Flutter App';
 @override
 Widget build(BuildContext context) => MaterialApp(
       title: title,
       home: HomePage(),
     );
}

class HomePage extends StatelessWidget {
 @override
 Widget build(BuildContext context) => Scaffold(
       appBar: AppBar(title: Text(App.title)),
       body: Center(
         child: RichText(
           text: TextSpan(
             style: TextStyle(fontSize: 48),
             children: [
               TextSpan(
                 text: 'This is not a link, ',
                 style: TextStyle(color: Colors.black),
               ),
               TextSpan(
                 text: 'but this is',
                 style: TextStyle(color: Colors.blue),
                 recognizer: TapGestureRecognizer()
                   ..onTap = () {
                     urlLauncher.launch('https://flutter.dev');
                   },
               ),
             ],
           ),
         ),
       ),
     );
}

Now you can have all the wrapped text spans you need, and any text with a recognizer in it will get the appropriate mouse cursor.

In this version, TextSpan also supports onEnter and onExit and mouseCursor. Things like this may seem small, but they have a long way to go to make a Flutter app feel like the user expects it.

Flutter 2.2 updates in preview

In addition to the new features available for the product, Flutter 2.2 provides some features in the preview version, including iOS shader compiler performance improvements, Android delay component support, Flutter desktop updates, and Sony's ARM64 Linux host support. Please try it and let us know if you have any questions.

http://github.com/flutter/flutter/issues

Preview: iOS shader compilation improvements

In graphics rendering terms, a "shader" is a program that is compiled and run on the GPU available on the end user's device. Since the birth of the Skia graphics library, Flutter has been using shaders to provide high-quality graphics effects, including colors, shadows, animations, and so on. Due to the flexibility of Flutter's API, shaders are generated and compiled in real time, and they need to be synchronized with the frame workload. When the time to compile the shader exceeds the frame budget, the result is obvious to the user "jank"

To avoid confusion, Flutter provides the ability to cache shaders during training, then package and bundle an application, compile it before the first frame, and start the Flutter engine at the same time. This means that pre-compiled shaders do not have to be compiled during the framework's workload and will not cause confusion. However, Skia initially only implemented this feature in OpenGL.

Therefore, when we enabled the Metal backend on iOS by default in response to Apple's deprecation of OpenGL, according to our benchmark measurement, the worst frame time has increased, and the jank reported by users has also increased. Our own measurements show that these reports are usually due to increased shader compilation time, increased number of shaders generated by Skia for the Metal backend, and compiled shaders that cannot be cached during runtime, so that the first time jank It still exists after running the application.

So, so far, the only way to avoid this mess on iOS is to simplify the scenes and animations, which is not ideal.

https://github.com/flutter/flutter/issues/79298

However, now in the development channel is a preview of the new metal that supports warming up in Skia's shader. With Skia, Flutter now compiles the first frame before binding the shader.

跟踪显示在应用程序启动期间发生的预编译

However, this solution also has some caveats:

Skia still generates more shaders for Metal backend than OpenGL backend
The final shader compilation to machine code is still synchronized with the framework workload, but this is faster than the entire shader generation and compilation as part of the framework rendering time
The generated machine code is cached after the application is run for the first time until the device is restarted

If you want to take advantage of this new support in the app, you can follow the instructions on flutter.dev.

https://flutter.dev/docs/perf/rendering/shader#how-to-use-sksl-warmup

We’re not done with this work, however. On both Android and iOS, this implementation has a few drawbacks:

However, we have not yet completed this work. Whether it is on Android or iOS, this implementation has some shortcomings:

The size of the deployed application is larger because it contains bundled shaders
The application startup delay is longer because the bundled shader requires pre-compilation
We are not satisfied with the developer experience implied by this implementation

We believe that the last issue is the most important issue that needs to be resolved. In particular, we looked at the process of performing training runs and reasoned that the trade-off caused by application size and application startup delay is too onerous. Therefore, we continue to study how to eliminate shader compilation jank that does not depend on this implementation and all jank in general. In particular, we are working with the Skia team to reduce the number of shaders it generates in response to Flutter's requirements, and we are also investigating how much Flutter can be achieved using a small set of statically defined shaders bundled with the Flutter engine.

You can follow this project to see our progress in the Flutter repo.

Android delay component

For Android, this version uses Dart's separate AOT compilation feature, allowing Flutter applications to download modules containing pre-compiled code and resources at runtime. We call each of these installable components a delay component. By deferring the download of code and assets until only when needed, the initial installation size can be significantly reduced. For example, we implemented a version of Flutter Gallery, all research and demonstrations were postponed, and found that the initial installation size was reduced by 46%.

https://github.com/flutter/flutter/pull/76192

When building with deferred components enabled, Dart will compile the code imported only with the deferred keyword into separate shared libraries, which are packaged into deferred components together with assets.

The delay component is currently only available on Android, and this feature is provided as an early preview. Learn how to implement the Deferred component in the new Deferred component page on flutter.dev. This page also links to a page on the Flutter wiki that contains an in-depth introduction to how this feature works. Please track the issue in the Flutter issue log.

Flutter Windows UWP alpha

In this version, another update of Flutter is for desktop lovers; support for Windows UWP has been moved to the alpha version in the dev channel (outside the stable 2.2 version). Allows you to bring Flutter applications to devices where standard Windows applications cannot run, including Xbox. To try it, you first need to set the UWP prerequisites. Then, switch to the development channel and enable UWP support:

https://flutter.dev/desktop#windows-uwp

$ flutter channel dev
$ flutter upgrade
$ flutter config — enable-windows-uwp-desktop

Once enabled, create a Flutter application including a new winuwp folder, which allows you to build and run your application in a UWP container:

$ flutter create uwp_fun
$ cd uwp_fun
$ flutter pub get
$ flutter run -d winuwp

Because you are building a Windows UWP application, it runs in the Windows sandbox environment, so during the development process, you need to make a hole in the application firewall on the local host to enable hot reload and debugger interrupt Point and other functions. You can do this by following the instructions on the Flutter desktop documentation page through the checkknesolation command. Once you do this, you can see your favorite Flutter application running as a UWP application on Windows.

Your favorite Flutter application runs in a Windows UWP container

Of course, you can run more interesting UWP applications, such as these Flutter applications running on Xbox.

I want to especially thank Clarkson, who has been committed to this support since I joined the Flutter team. For more details about Windows UWP alpha, please check flutter.dev/desktop/# Windows-UWP.

http://flutter.dev/desktop/#windows-uwp

ARM64 Linux host support from Sony

Another outstanding effort comes from the community member Hidenori Matsubayashi, who is a software engineer at Sony and provides support for the target ARM64 Linux. This PR allows you to build and run Flutter applications on ARM64 Linux machines.

Your favorite Flutter application runs on an ARM64 Linux machine

https://github.com/HidenoriMatsubayashi

https://github.com/flutter/flutter/pull/61221

It's great to see that the Flutter community has brought Flutter to places that the Google team couldn't imagine. Keep going!

Flutter ecosystem and tool updates

The Flutter engine and framework are only part of the overall experience. Updates to the package ecosystem and tools are equally important to the experience of Flutter developers. We have some great updates in these areas to share.

In terms of the ecosystem, we have some new Flutter favorite packages, as well as several updates to FlutterFire, and Flutter's support for Firebase. Even better, FlutterFire supports the new Firebase App Check preview, so Flutter developers can take advantage of it on the first day.

In terms of tools, Flutter DevTools provides new updates to optimize the memory footprint of the application and provide new tags for the package. There are some notable updates for VS Code and Android Studio/IntelliJ IDE plugins. If you are a content author targeting Flutter, then there is a new way to integrate DartPad into your writing.

Last but not least, there is a new low-code application design and construction tool called FlutterFlow, which targets Flutter and runs on the Internet, because it builds Flutter itself.

Flutter Favorite updates

As part of this release, the Flutter Ecosystem Council has been working hard to certify 24 new Flutter favorite packages, our biggest extension. The newly tagged Flutter collections include:

In production: cloud_firestore, cloud_functions, firebase_auth, firebase_core, firebase_crashlytics, firebase_messaging, and firebase_storage
Flutter Community packages: android_alarm_manager_plus, android_intent_plus, battery_plus, connectivity_plus, device_info_plus, network_info_plus, package_info_plus, sensors_plus, and and share_plus
googleapis package
win32 package
intl and and characters packages
Sentry and sentry_flutter
infinite_scroll_pagination and flutter_native_splash packages

All these packages have been migrated to null security, and support Android, iOS and web where appropriate. For example, firebase crashlytics has no underlying SDK on the web, and Android alarm manager plus is specifically designed for Android.

The Flutter community "Plus" package provides a superset of the corresponding package from the Flutter team. For example, the battery pack was provided by Google's Flutter team before Flutter was released, and it has been migrated to null security, but only supports Android and iOS. On the other hand, the Flutter Community Battery + package supports all six Flutter platforms, including web, Windows, macOS and Linux. All 9 "plus" packages of Flutter's favorite awards presented represent a big step forward for a mature Flutter community as a whole. Much larger than Google’s engineering team. You should migrate the code to the "add-on" package as soon as possible. In the next few weeks, Google’s corresponding package will be updated to recommend you to do so.

The Googleapi plugin provides about 185 automatically generated Dart wrappers for client-side or server-side Dart applications (including Flutter applications). If you want to know more about this package, the author has an i/o talk on using Google api to launch Flutter applications.

The Win32 package is an engineering marvel. It uses Dart FFI to wrap most commonly used Win32 API calls so that they can be accessed by Dart code without the need for a C compiler or Windows SDK. With the popularity of Flutter on the Windows platform, the win32 package has become a key dependency of many popular plugins, including the most popular path providers. As a complete test, the author timsneath did some crazy things, such as using the original Dart in the original Win32 to implement Notepad, Snake and Tetris.

Tetris runs on Windows and only uses Dart FFI and Win32 calls

The Win32 package is definitely worth checking if you do anything with Dart or Flutter on Windows.

Update and Firebase app check

FlutterFire, Flutter's support for Firebase, is one of the most popular collections of plugins used by Flutter. Invertase has done a huge job to get the release of Flutter 2 produced by it, and continue to improve it since then. In fact, since the release of the initial production version of FlutterFire, invertase has reduced unresolved issues by 79% and reduced unresolved issues by 88%. In addition, not only did they do a great job with product quality plugins, they also migrated beta quality plugins to null security and let them build and run on the same core so you can mix and match.

In addition, Invertase continues to add new features to the FlutterFire plug-in, including some updates to the integration of Flutter and Cloud Firebase:

Typesafe API Air Pollution Index is used to read and write data
Support Firebase local emulator kit
Optimize your data query data bundles data package

Last, but not least, FlutterFire provides support for the beta version of the new Firebase product: Firebase App Check. The fire prevention base application checks to protect your back-end resources, such as cloud storage, from abuse such as bill fraud or phishing. Using App Check, the device running your Flutter application uses an application authentication provider to confirm that it is indeed your application, and may check whether it is running on a real, unmodified device. Once you activate the application check, this certification will be attached to every request your application makes to Firebase backend resources. For more information, please refer to the FlutterFire App Check documentation.

Flutter DevTools updates

With the release of this version, Flutter DevTools has some notable updates, including two memory tracking improvements and a brand new tab specifically for provider plugins.

The first memory tracking improvement in the DevTools version provides the ability to track where objects are allocated. This is very convenient for finding the location of the memory leak in the code.
Flutter DevTools memory tab allocation stack trace Flutter DevTools memory tab allocation stack trace

The second is the ability to inject custom messages into the memory timeline. This way you can provide specific marks for your application, such as before and after you finish some memory-intensive work, so you can check whether you cleaned things up correctly.

Custom memory event

As Flutter applications grow larger, we will continue to ensure that Flutter developers have the tools they need to track and fix memory leaks and various runtime issues.

When using the Flutter framework, you not only have to track runtime issues, but sometimes you also need to track package-related issues. There are more than 15,000 flutter-compatible packages and plugins on pub.dev, and this situation is more and more likely to happen as the application uses more packages. Therefore, with this in mind, we have been trying to add a new Provider tag to Flutter DevTools. In fact, this tab was created by Remi Roussel, the author of the provider package itself (and many other goodies). If you are running the latest version of Flutter DevTools and are debugging a Flutter application that uses a provider plug-in, you will automatically get a new Provider tag.

激活 DevTools Provider 选项卡

The "Providers" tab displays the data associated with each provider, including real-time changes while the application is running. If this is not amazing enough, it allows you to directly change the data as a way to test the corners of your application!

By using this tag of Remi, we learned something about how to better support other package authors who want to do the same thing; you can read how Remi builds the Provider tag, and how we are currently in the Flutter DevTools Plugins proposal The idea of enabling more tags. Please give us your feedback, and feel free to contact us to tell us your plan, a new tab in Flutter development tools.

This is only a few of the cool new things in Flutter DevTools in this release. For the complete list, check out the individual announcements here:

These are just some cool new things in this version of Flutter DevTools. For the complete list, please click here to view the personal statement:

Flutter DevTools 2.1 Release Notes 2.1 Release Notes
https://groups.google.com/g/flutter-announce/c/tCreMfJaJFU/m/38p1BBeiCAAJ
Flutter DevTools 2.2.1 Release Notes 2.2.1 Release Notes
https://groups.google.com/g/flutter-announce/c/t8opLnUyiFQ/m/dJth-jKxAAAJ
Flutter DevTools 2.2.3 Release Notes 2.2.3 Release Notes
https://groups.google.com/g/flutter-announce/c/t8opLnUyiFQ/m/YX5Ds_q0AgAJ

IDE plugin update

Visual Studio Code and IntelliJ/Android Studio IDE extension for Flutter have also been updated in this version. For example, the visualstudio code extension now supports two additional Dart code refactorings: inline methods and inline local variables.

新的 Dart 重构行动内嵌方法

In the Android Studio/IntelliJ extension, we added the function of printing all stack traces to the console.

现在您可以获得所有的堆栈跟踪，而不仅仅是第一个

This is helpful for projects where the root cause may be in a different package, because these packages have not been printed before. We already have some ideas to make this article less lengthy, so look for more changes in the future.

For a complete list of changes to this version of the IDE, please see the following announcement:

VS Code extension v3.21 VS Code extension v3.21
https://groups.google.com/g/flutter-announce/c/gNtKp9c1glU/m/SZYTuwcQBwAJ
VS Code extension v3.22 VS Code extension v3.22
https://groups.google.com/g/flutter-announce/c/1XR7baYZOVI/m/y6MGYrGhAAAJ
Flutter IntelliJ Plugin M55 Release 55 Release
https://groups.google.com/g/flutter-announce/c/tYwFDPAtLu0/m/FrsntcNNBwAJ
Flutter IntelliJ Plugin M56 Release 56 released
https://groups.google.com/g/flutter-announce/c/EkgiAO4p3UM/m/P32ZXXKfAAAJ

DartPad workshops

In order to ensure that we have prepared documentation in the fast-growing Flutter developer community, the Dart and Flutter teams are always looking for ways to improve and extend the creation of educational content. With the release of this version, we have added a new, step-by-step UI to DartPad, which developers can use to follow instructor-led workshops.

实践中的 DartPad 工作坊

By adding instructions directly in DartPad, we provide a guided workshop experience for i/o. However, we are not just creating it for our own workshop; if you want to use it in your Dart or Flutter workshop, you can do so by following the DartPad workshop creation guidelines. In addition, you can also use DartPad in Gist to share code and embed DartPad in your own site, which has been around for a while.

We hope that everyone who produces Dart and Flutter content can provide their users with a rich interactive experience. Please try this new feature and let us know what you think!

Community spotlight: FlutterFlow

FlutterFlow is a "low-code" application design and development tool for building applications in the browser. It provides a WYSIWYG environment where you can use Firebase's actual data to display your application on multiple pages. The goal of low-code tools is to easily accomplish most common things, allowing you to write as few lines of custom code as possible. In fact, as a demonstration, they created a whole multi-page mobile application in less than an hour, allowing you to browse the Metropolitan Museum of Art with zero code.

FlutterFlow outputs Flutter code, so if you need to add code to further customize your application, you can. You can read the release of FlutterFlow products on FlutterFlow.io.

https://flutterflow.io/blog/launch

Breaking Changes

As always, we have worked hard to reduce the number of disruptive changes. In this version, we have been able to limit it to remove these objections:

73750 Delete the deprecated BinaryMessages
73751 Delete the deprecated TypeMatcher class

You can find mitigation methods for these sudden changes on flutter.dev.

Summary

As usual, everyone from the Google Flutter team, we want to say thank you. Thank you for being part of the community for making this possible. With more than one-eighth of new applications being established in the Play Store Flutter and more than 200,000 Flutter applications in the Play Store, our continued growth is exciting. Applications of all sizes around the world have entrusted their user interface, Feiyi crafts a beautiful multi-platform experience to satisfy users wherever they may be.