Flutter 1.22 正式发布

时间  2020-10-20
标签 linux android ios git github web macos windows visual-studio-code api 栏目 Linux 繁體版
原文   原文链接

支持iOS 14和Android 11，新的i18n和l10n支持，可用于生产的Google Maps和WebView插件，新的App Size工具等等！linux

做者：Chris Sellsandroid

原文：https://medium.com/flutter/announcing-flutter-1-22-44f146009e5fios

咱们很高兴推出最新版本的Flutter，它普遍支持iOS 14和Android11。Flutter 1.22在之前版本的基础上构建，使开发人员可以从一个代码库为多个平台构建快速，美观的用户体验。咱们的季度稳定版本包含最新功能，性能改进和错误修复，适合普遍的生产使用。git

因为这是新的移动操做系统版本的发布季节，所以此发行版侧重于确保Android 11和iOS 14与Flutter兼容。这两个操做系统的更新都包括大量的幕后工做，以符合最新的SDK并确保全部内容都经过咱们普遍的测试套件。对于iOS 14，此版本包括对新Xcode 12，新图标的支持以及对新iOS 14 App Clips功能的预览支持。对于Android 11，此更新支持新类型的显示切口以及在调出软键盘时更流畅的动画。github

该版本发布于咱们的1.20发布两个月以后，所以比大多数版本都短。即便在这么短的时间内，咱们也关闭了3,024期，合并了197个贡献者的1,944个PR。在这些贡献者中，有114位（58％）来自整个社区，他们贡献了271个PR。最大的单一贡献者是 a14n，他再次以20个PR成为咱们的杰出贡献者名单，其中大多数是做为支持Flutter中的零安全性工做的一部分而完成的（更多内容即将推出）。web

除了对新的移动操做系统版本的支持外，还有不少其余要分享的新闻，包括预览Android最重要的功能之一：状态恢复，新的“Material 风格按钮“，新的国际化和本地化支持（与热重载一块儿使用），一个新的Navigator，一个稳定的Platform Views版本（Google Maps和WebView插件的基础）以及一个开关，您能够在其中添加代码以改善在具备高频率显示的设备上的滚动。咱们还提供了一个用于剖析应用程序大小并确保您要构建的插件仅支持您要支持的平台的新工具。macos

iOS 14

每当发布新版本的移动操做系统时，咱们都会对其进行完全测试，以查找影响Flutter及其工具的不兼容性或更改。windows

对于iOS 14，咱们对Flutter进行了不少更改，以确保它能够按照开发人员的方式工做：visual-studio-code

  • Xcode 12须要iOS 9.0或更高版本，所以咱们的默认模板将其默认值从8.0增长到9.0
  • iOS 14特定崩溃和字体渲染问题已在Flutter 1.22中修复
  • Flutter 1.20.4，修复了部署到真机设备的问题
  • 当应用程序访问其剪贴板时显示使用通知，致使在Flutter应用程序中出现虚假通知，该问题已在Flutter 1.20.4中修复
  • iOS 14设备上会禁止运行debug应用程序，但实际开发debug除外
  • 针对本地调试的Flutter应用程序的有关网络安全的新策略使iOS 14显示一次性确认对话框（仅在开发过程当中，不适用于已发布的Flutter应用程序）

若是您要经过Flutter应用定位iOS 14，咱们强烈建议您使用Flutter 1.22对其进行重建，而后当即将其部署到App Store中，以确保您的iOS 14用户得到最佳体验。api

有关使用Flutter适配iOS 14的更多详细信息，包括添加Flutter应用到原生应用，deep linking和通知注意事项，请参阅 flutter.dev上的iOS 14文档。

但愿全部有关工具和SDK支持的工做均可以让您专一于本身关心的编码-利用iOS 14的新功能。

其中一项功能是对iOS的新SF Symbols字体的更新支持，咱们花一些时间更新了cupertino_icon程序包。将cupertino_icons依赖关系更新为新的1.0主要版本后，CupertinoIcons的现有用法将自动映射到新样式。若是您将cupertino_icons 1.0与Flutter 1.22结合使用，那么您还能够经过CupertinoIcons API访问约900个新图标。

您能够在cupertino_icons预览页面上看到图标的完整列表，在 flutter.dev上能够看到迁移详细信息页面。

您能够在iOS 14上尝试使用Flutter的另外一个功能是App Clips，它是iOS 14的一项新功能，它支持10MB如下轻量级应用程序的快速，无安装应用程序执行。在Flutter 1.22版中，咱们预览了使用Flutter构建的App Clip目标。

有关如何使用Flutter构建Clip的更多详细信息，请查看flutter.dev上的文档。您也能够参考这个简单的示例项目。

Android 11

Flutter的这个版本也与本月Android 11的发布相吻合。 Flutter框架和引擎已更新，以支持最新版本的Android中引入的两个新功能。

首先，Flutter如今支持多种屏幕适配（好比瀑布屏）。

经过使用MediaQuery和SafeArea API，您能够确保将活动的UI和交互式元素放置在设备显示屏的无障碍区域中。另外，您将要避免在瀑布边缘区域使用手势检测器，由于这可能会致使意外触摸。

其次，动画在显示软件键盘时与Android 11同步。

问题 #19279是一个长期存在的问题，其中系统键盘的显示/隐藏动画与Flutter的插图不一样步。这在Android 11中已修复。

关于Android嵌入API的一项说明。去年，随着Flutter 1.12版的推出，咱们推出了一套适用于Android的新Flutter引擎和Flutter插件API。咱们建立了这些v2 API，以更好地支持Android上的应用程序添加用户。一年后，超过80％的Android插件使用了新的Android API。从1.22开始，咱们再也不使用较旧的v1 API。

若是您仍在使用Android v1 API，那么这对您意味着：

  • 新建立的插件将再也不针对v1 API
  • Flutter工具的 -no-enable-android-embedding-v2配置标记已删除，如今是默认行为
  • 仍在使用v1 API的旧版应用程序在构建过程当中将显示弃用警告，该警告指向支持新的Android插件API文档

同时，若是您仍然有基于v1 Android API的Flutter应用程序，它将继续运行。可是，您可能会开始遇到仅针对v2 API且v1 Android API没法使用的新插件。有关更多详细信息，请参见重大更改文档。

扩展的 Button 组件

现有的Flutter按钮看上去不错，但很难使用，尤为是在须要自定义主题时。此外，“Material”规范已扩展为包括具备新样式的新按钮。

为使Flutter保持与Material指南的最新水平，咱们很高兴地宣布Flutter 1.22中的引入全新的按钮。

该PR并无尝试就地开发现有的按钮类及其主题，而是引入了新的替换按钮小部件和主题。除了使咱们摆脱现有类的向后兼容性迷宫以外，新名称还使Flutter与Material Design规范同步，后者使用按钮组件的新名称。

新主题遵循Flutter最近在新Material窗口小部件中采用的“规范化”模式。若是您想玩演示，DartPad上有一个很棒的演示。这并非一个重大变化，由于FlatButton，OutlineButton，RaisedButton，ButtonBar，ButtonBarTheme和ButtonTheme的语义不会改变。您能够将旧按钮与新按钮混合使用。

新的国际化和本地化支持

自Flutter创立以来，Flutter已提供您的应用程序国际化（i18n）和本地化（l10n）所需的核心功能。可是，在此版本中，咱们将最佳作法的意见归入了咱们的工具中，甚至在添加新的l10n信息时启用了热重装支持来更新您的应用。

若是您想了解有关Flutter对l10n的支持的更多详细信息，包括本地化消息，带有参数的消息，日期，数字和货币，请阅读Flutter Internationalization用户指南。

此外，若是您对i18n和l10n感兴趣，那么您可能还对那些字符串不适合普通ASCII字符的字符串感兴趣，例如Unicode和emoji。最近，Dart团队发布了character软件包，该软件包可帮助开发人员处理Unicode（扩展）字形簇。该软件包有助于解决诸如如何正确地将字符串（如“ A in text in English”）缩写为前15个字符的问题。使用String类，该缩写为“ A🇬🇧text in”，它仅是12个用户可感知的字符。另外一方面，使用字符包会产生“ A🇬🇧text in Eng”的正确缩写。

经过此PR，Flutter使用字符包来正确处理这些复杂字符。例如，当使用具备maxLength限制的TextField时，像👨‍👩‍👦这样的字符如今能够正确地计为单个字符。一样，有了此PR，在Flutter所在的项目中，字符包都可自动在项目中使用，而无需手动添加。但愿这使得处理来自全部语言环境的各类字符串变得更加容易。有关character包的更多详细信息，请查看出色的文章，正确完成Dart字符串操做。

Google Maps和WebView插件准备投入生产

在Flutter小组的这里，咱们一般会谨慎地将某些标签标记为“生产就绪”，直到咱们对本身进行完全测试为止。对于google_maps_flutter和webview_flutter插件，选通因素一直是底层的Platform Views实现，该实现容许将Android和iOS的本机UI组件托管在Flutter应用程序中。在此版本的Flutter中，咱们很高兴地宣布，咱们对框架进行了强化，足以将这两个插件声明为能够投入生产。

在Flutter 1.22中，咱们添加了替代的Platform Views实现，该实现修复了全部已知的键盘以及Android视图的可访问性问题。此外，它还适用于19级及以上的Android API（之前要求20级）。咱们还在iOS上进行了线程改进，使平台视图更高效，更可靠（而且再也不须要您将io.flutter.embedded_views_preview标志添加到iOS Info.plist）。

webview_flutter插件支持新的Android平台视图模式，但当前须要手动启用。一旦在更普遍的社区中获得更多使用，咱们将默认在未来的版本中启用它。

Google Maps和WebView插件已经从Platform Views的改进中受益。若是您想使用平台视图在iOS或Android上托管本身的本机UI组件，则能够了解如何在使用平台视图在Flutter应用中托管本机Android和iOS视图上。

若是您之前在Flutter应用程序中使用过导航功能，则可能已经注意到核心数据结构（用户正在浏览的页面堆栈）对您而言是隐藏的。而是要对其进行管理，请调用Navigator.pop（）或Navigator.push（）。举例来讲，假设您想在首页上显示一系列小部件，并容许用户点击一个小部件以转到专门针对该颜色的详细信息页面。

实现以下：

class ColorListScreen extends StatelessWidget {
 final List<Color> colors;
 final void Function(Color color) onTapped;
 ColorListScreen({this.colors, this.onTapped});
 
 @override
 Widget build(BuildContext context) => Scaffold(
       appBar: AppBar(title: Text('Colors')),
       body: Column(
         children: [
           // you can see and decide on every color in this list
           for (final color in colors)
             Expanded(
               child: GestureDetector(
                 child: Container(color: color),
                 onTap: () => onTapped(color),
               ),
             )
         ],
       ),
     );
}
 
class ColorScreen extends StatelessWidget {
 final Color color;
 const ColorScreen({this.color});
 
 @override
 Widget build(BuildContext context) => Scaffold(
       appBar: AppBar(title: Text('Color')),
       body: Container(color: color),
     );
}

使用最简单的Navigator 1.0样式，您能够以看起来很是简单的方式在这两个屏幕之间导航：

class _ColorAppState extends State<ColorApp> {
 List<Color> _colors = [Colors.red, Colors.green, Colors.blue];
 
 @override
 Widget build(BuildContext context) => MaterialApp(
       title: 'Color App',
       home: Builder(
         builder: (context) => ColorListScreen(
           colors: _colors,
           // the Navigator manages the list of pages itself; you can only push and pop
           onTapped: (color) => Navigator.push(
             context,
             MaterialPageRoute(builder: (context) => ColorScreen(color: color)),
           ),
         ),
       ),
     );
}

只需对Navigator.push（）进行调用，便可将第一个页面推到第一个页面的顶部，从而建立两页的堆栈。可是，与在ColorListScreen的build方法中建立的Container列表不一样，该堆栈对您隐藏。并且，因为它是隐藏的，所以很难针对其余状况进行管理，例如处理由本机嵌入提供的初始路由的深层连接，或者来自Web的URL或来自Android的意图。管理同一页面的不一样排列之间的嵌套路由也极其困难。

Navigator 2.0经过使页面堆栈可见而解决了这些问题，甚至更多。这是在相同的ColorListScreen和ColorScreen之间导航的更新示例：

class _ColorAppState extends State<ColorApp> {
 Color _selectedColor;
 List<Color> _colors = [Colors.red, Colors.green, Colors.blue];
 
 @override
 Widget build(BuildContext context) => MaterialApp(
       title: 'Color App',
       home: Navigator(
           // you can see and decide on every page in this list
         pages: [
           MaterialPage(
             child: ColorListScreen(
               colors: _colors,
               onTapped: (color) => setState(() => _selectedColor = color),
             ),
           ),
           if (_selectedColor != null) MaterialPage(child: ColorScreen(color: _selectedColor)),
         ],
         onPopPage: (route, result) {
           if (!route.didPop(result)) return false;
           setState(() => _selectedColor = null);
           return true;
         },
       ),
     );
}

该应用程序显式建立一个导航器，并为其提供表明完整堆栈的页面列表。咱们建立一个空的_selectedColor，以指示还没有选择任何颜色，所以咱们最初不显示ColorScreen。当用户选择一种颜色时，咱们一般会调用setState（）来向Flutter表示您但愿再次调用build（）方法，该方法如今会建立一个堆栈，其顶部是ColorScreen。

您能够在OnPopPage回调中更新状态，例如，若是用户弹出，则表示他们已“取消选择”当前颜色，所以咱们再也不但愿显示该页面。

若是Navigator 2.0看起来像Flutter的其他部分，那就是意图-它是声明性的，而Navigator 1.0则是必须的。这个想法是要在导航和Flutter的其他部分之间统一模型，同时解决许多问题并添加功能。实际上，这个小例子几乎不涉及Navigator 2.0的内容。有关详细信息，我强烈推荐有关Flutter中的声明式导航和路由的文章。

另外，您对Navigator 1.0的现有使用将像今天同样继续使用，而且不会在短时间内被删除。若是您喜欢该模型，则能够继续使用它。可是，若是您尝试使用Navigator 2.0，咱们认为您会喜欢的。

预览：Android的状态还原

在此版本中可供您试用的新功能是对Android状态恢复的支持。这是咱们最受欢迎的功能之一，拥有217个大拇指！

对于不熟悉状态还原需求的用户，移动操做系统可能会杀死后台的应用程序，以回收前台应用程序的资源。发生这种状况时，操做系统会通知该应用被终止以快速保存任何UI状态，以便在用户循环回到该应用时能够将其恢复。正确实施后，能够为用户提供无缝的体验，同时能够更好地利用设备的资源。到目前为止，Flutter不支持状态还原，没有框架的支持，很难正确地进行状态还原。所以，咱们很高兴可以为Android提供此功能的基本实现。

这是一个用于恢复默认Flutter Counter应用状态的很是简单的示例：

class CounterState extends State<RestorableCounter> with RestorationMixin {
  @override
  String get restorationId => widget.restorationId;

  RestorableInt _counter = RestorableInt(0);

  @override
  void restoreState(RestorationBucket oldBucket) => registerForRestoration(_counter, 'count');

  void _incrementCounter() => setState(() => _counter.value++);

  @override
  Widget build(BuildContext context) => Scaffold(
      body: Center(child: Text('${_counter.value}')),
      floatingActionButton: FloatingActionButton(onPressed: _incrementCounter),
    );
}

简要地说，每一个小部件都有一个 storage bucket，该storage bucket使用惟一的ID向RestorationMixin注册。经过使用RestorableProperty类型（如此处使用的RestorableInt）来存储特定于UI的数据，并经过State Restoration功能注册该数据，该数据将在Android杀死该应用以前自动存储，并在其恢复正常运行时恢复。就是这样。全部以Restoration *类型存储的数据，例如RestorableInt，RestoableString和RestorableTextEditingController（咱们都有不少）都将被还原。并且，若是咱们没有涵盖您要还原的全部类型，则能够经过扩展RestorableProperty建立本身的类型。

为了自动测试状态恢复，咱们向WidgetTester添加了新的restartAndRestore API。要进行手动测试，最简单的方法是在Android设备上启动启用了状态恢复功能的Flutter应用，在Android开发人员设置中启用“不要保留活动”，运行Flutter应用，将其置于后台，而后而后回到它。此时，Android将终止并恢复您的应用程序，所以您能够查看一切是否按预期工做。

尽管咱们很高兴将状态恢复的预览版放在您的手中，但还有更多工做要作。例如，状态恢复不只适用于Android，iOS应用程序也能够受益。此外，咱们正在忙于更新本身的窗口小部件，以在恢复过程当中保持其状态。咱们已经在Scrollable类中提供了支持，例如ListView和SingleChildScrollView（记住用户的滚动位置）和TextField（恢复他们输入的文本），而且咱们计划将其扩展到其余小部件。

预览：平滑滚动以提供不匹配的输入和显示频率

当输入和显示频率不一样时，Flutter团队与Google内部合做伙伴合做，极大地提升了滚动性能。例如，Pixel 4输入的运行频率为120hz，而显示屏的运行频率为90hz。滚动时，这种不匹配会致使性能降低。使用新的resamplingEnabled标志，您能够利用咱们在Flutter中完成的性能工做来解决此问题：

void main() {
  GestureBinding.instance.resamplingEnabled = true;
  run(MyApp());
}

根据所涉及的频率差别，启用此标志可使滚动时的颤动减小多达97％。当咱们肯定这是最好的体验时，咱们计划在之后的版本中默认启用此标志。

新的统一的Dart开发人员工具

与往常同样，对Flutter的更新不只意味着引擎和框架，还包括工具。 Flutter 1.22包括Dart（2.10）的新版本，还有一个新的dart CLI工具，您可能也会发现它有用。

Dart历史上有许多较小的开发人员工具（例如，用于格式化的dartfmt和用于代码分析的dartanalyzer）。 Dart 2.10中的新增功能是一个与Flutter工具很是类似的统一的Dart开发人员工具。

从今天的Flutter 1.22 SDK开始，您会发现/ bin文件夹（您可能在PATH中包含该文件夹）同时包含flutter和dart命令。有关更多详细信息，请参见Dart 2.10博客文章。

应用程式大小分析工具

做为Flutter 1.22的一部分发布的工具包括一个新的输出大小分析实用程序。此工具可帮助诊断Flutter，您的应用大小细分是否会随着时间变化。

您能够经过将--analyze-size标志传递给如下任何命令来使用该工具收集分析所需的数据：

  • flutter build apk
  • flutter build appbundle
  • flutter build ios
  • flutter build linux
  • flutter build macos
  • flutter build windows

在构建Flutter输出工件时使用此标志将打印工件尺寸和组成的摘要。这包括本机代码，资产，甚至是已编译Dart代码的程序包级细分。

此摘要有助于快速识别应用程序的程序包大小用法中的热点。此外，收集到的数据还能够做为JSON文件使用，供Dart DevTools使用，它使您能够按照flutter.dev上的说明进一步浏览应用程序的内容，查明大小问题并查看两个不一样JSON文件之间的更改。加载JSON文件后，您将拥有一个界面，该界面为您提供应用大小的树状图。

有关您可使用“应用大小”工具执行的操做的更多详细信息，请阅读flutter.dev上的“使用应用大小工具”文档。

预览：DevTools中更新的网络页面

此版本中的另外一个DevTools预览功能是可以在“网络”选项卡中查看HTTP和HTTPs响应主体。

要启用此功能，请经过flutter通道dev和flutter通道升级确保您位于Flutter dev通道上。

此外，对于具备大量网络流量的应用，咱们提供了搜索和过滤功能。

有关“网络”选项卡的文档，请参阅在flutter.dev上使用网络视图。

IntelliJ中的托管DevTools检查器选项卡

一段时间以来，咱们一直在维护某些Flutter工具的两个副本，例如IntelliJ中的Inspector窗格和Dart DevTools中的Inspector选项卡。这不只会减慢咱们的速度，由于咱们必须维护两个代码库，并且某些功能还没有归入IntelliJ插件中，例如布局资源管理器。所以，为了解决这两个问题，咱们启用了直接从IntelliJ内部的Dart DevTools托管“检查器”选项卡的功能。

注意添加了Layout Explorer，您能够在代码旁边使用它。要启用此选项，请转至 Preferences > Languages & Frameworks > Flutter > Enable embedded DevTools inspector

改进了Visual Studio Code中的输出连接

Flutter开发人员所面临的常规活动是从终端或堆栈跟踪中的错误输出中进行。在适用于Visual Studio Code的Flutter扩展的最新版本中，如今能够正确解析这些连接，以使您能够直接从输出中启用连接。

看来这是一件小事，可是对于此功能的初步反馈已经很是积极。

与往常同样，此处的工具更改列表太多，可是我建议如下公告以了解详细信息：

客户关注点：EasyA

EasyA是一款订阅应用程序，旨在使适龄学生经过即时消息与出色的导师联系，并使用Flutter编写。最近，它被Apple推荐为“每日应用程序”。

“当学校在今年初开始上网时，咱们知道咱们须要快速启动辅导应用程序来帮助学生。 Flutter的惊人发展速度意味着咱们可以为iOS和Android实施屡获殊荣的设计，而且还能够发布到Web上—及时锁定！一般，这其实是不可能的。可是，因为Flutter容许咱们同时针对全部三个平台，所以咱们可以高效地共享代码，并充分利用咱们的小型开发人员团队。”

EasyA联合创始人Phil Kwok

重大变化

与往常同样，咱们试图将重大更改的数量保持在最少。如下是Flutter 1.22版本中的列表。

概要

Flutter 1.22稳定版可能在上一版本以后很快问世，可是其中包含不少好东西，所以本篇文章没法一一列举。咱们但愿此版本能够帮助您为iOS和Android开发出色的应用程序，咱们火烧眉毛想看到您的商店中有什么！感谢您的支持-咱们为您打造Flutter。

交流

老孟Flutter博客（330个控件用法+实战入门系列文章）：http://laomengit.com

欢迎加入Flutter交流群（微信：laomengit）、关注公众号【老孟Flutter】：
相关文章
相关标签/搜索
每日一句
    每一个你不满意的现在，都有一个你没有努力的曾经。
本站公众号
   欢迎关注本站公众号,获取更多信息
联系我们 最近搜索 最新文章 沪ICP备13005482号-10 MyBatis教程 SQL 教程 MySQL教程 Java 教程 Thymeleaf 教程 Hibernate教程 Spring教程 Redis教程