Flutter 3.24版本都有哪些新变化？

释放 Flutter GPU 功能，多视图嵌入等更多特性

Flutter 3.24 蓝色背景下

欢迎使用 Flutter 的最新更新！Flutter 3.24 带来了许多令人兴奋的新功能和增强，以提升您的应用程序开发体验。此次更新的一大亮点是 Flutter GPU 的预览版本，它能够直接在 Flutter 中实现高级图形和 3D 场景。现在 Web 应用可以嵌入多个 Flutter 视图，提升您应用的灵活性。最后，我们还增加了视频广告变现功能，帮助您更好地实现收益最大化。

在过去的几个月中，Flutter 社区非常活跃，框架部分贡献了 852 次提交，引擎部分贡献了 615 次提交。我们很高兴欢迎 49 位新贡献者，正是他们的加入使得此次发布成为可能。你们的奉献和热情正是推动 Flutter 前进的动力。

所以，一起来看看社区为这次最新版本带来的所有新功能和改进吧！

Flutter 技术 全新的卡牌.

这次发布增加了可以组合在一起以实现动态应用栏（如顶部导航栏）功能的新部分：

• 固定头部Sliver
• 可调整大小头部Sliver

你可以使用这些新的 sliver 来创建可以浮动、固定或随用户滚动调整大小的标题。这些新的 sliver 与现有的 [SliverPersistentHeader](https://api.flutter.dev/flutter/widgets/SliverPersistentHeader-class.html) 和 [SliverAppBar](http://sliverappbar) 类似，但它们具有更简单的 API，这些 API 可以更容易地组合使用以获得更大的效果。

这些新组件附带了新的示例代码。例如，其 PinnedHeaderSliver 的 API 文档中有一个示例，展示如何重现类似 iOS 设置应用顶部应用栏的效果：

Cupertino库更新

在这个版本中，我们改进了 [CupertinoActionSheet](https://api.flutter.dev/flutter/cupertino/CupertinoActionSheet-class.html) 的效果。现在，当你滑动手指过操作表的按钮时，会提供触觉反馈。按钮上的字体大小和粗细现在与它们的原生版本相匹配。

我们还为 [CupertinoButton](https://api.flutter.dev/flutter/cupertino/CupertinoButton-class.html) 添加了新的焦点属性，现在可以自定义禁用状态下的 [CupertinoTextField](https://api.flutter.dev/flutter/cupertino/CupertinoTextField-class.html) 的颜色。

Cupertino库正在接受更新，未来版本中将会带来更多更新哦。

树形视图

[two_dimensional_scrollables](https://pub.dev/packages/two_dimensional_scrollables) 包发布了 [TreeView](https://pub.dev/documentation/two_dimensional_scrollables/latest/two_dimensional_scrollables/TreeView-class.html) 组件，并附带了一些配套类和工具，用于构建可以在所有方向上滚动的高性能树形结构，即使树不断增长。包中包含的示例应用程序也更新了几个使用 [TableView](https://pub.dev/documentation/two_dimensional_scrollables/latest/two_dimensional_scrollables/TableView-class.html) 和 [TreeView](https://pub.dev/documentation/two_dimensional_scrollables/latest/two_dimensional_scrollables/TreeView-class.html) 组件的新示例。

[TreeSliver](https://api.flutter.dev/flutter/widgets/TreeSliver-class.html)也被添加到框架中，用于在一维滚动中构建树结构。TreeView 和 TreeSliver 的 API 相同，使得你可以根据用例轻松切换。

轮播视图

此次发布包含了一个 Material Design 轮播 组件：CarouselView。CarouselView 呈现了“未包含”布局：一个在容器边缘滚动的项目列表，当它们滚动出视图或进入视图时，最前面和最后面的项目会动态变化大小。

更多小部件的功能

此版本包含了一些将非特定于设计的核心部件逻辑从 Material 库移至 Widgets 库的工作，以便更广泛地应用。这包括但不限于：

• [反馈](https://github.com/flutter/flutter/pull/148523) 小部件，提供了一种从设备轻松获取触觉和音频反馈的方式，这些反馈会响应如点击、长按等手势。
• [ToggleableStateMixin](https://github.com/flutter/flutter/pull/148272)， [ToggleablePainter](https://github.com/flutter/flutter/pull/148272)，构建切换小部件（如复选框、开关和单选按钮）的基础类。

用于动画状态的增强枚举功能

社区成员@nate-thegrate在一次精彩的贡献中，为AnimationStatus的枚举功能增加了增强，包括新增的getter。

• isDismissed
• 已完成
• 正在运行
• 正在前进或已完成

其中一些获取器已经在 [Animation](https://api.flutter.dev/flutter/animation/Animation-class.html) 的子类中存在过，例如 [AnimationController](https://api.flutter.dev/flutter/animation/AnimationController-class.html) 和 [CurvedAnimation](https://api.flutter.dev/flutter/animation/CurvedAnimation-class.html)。现在，除了 AnimationStatus 之外的其他状态获取器都可以在 Animation 的子类中使用。最后，还在 AnimationController 中添加了一个 [toggle](https://api.flutter.dev/flutter/animation/AnimationController/toggle.html) 方法，用于切换动画的方向，使其反转。

选区更新内容

现在，Flutter 的 [SelectionArea](https://api.flutter.dev/flutter/material/SelectionArea-class.html) 支持更多的与鼠标三击和触摸设备双击相关的原生手势功能。默认情况下，[SelectionArea](https://api.flutter.dev/flutter/material/SelectionArea-class.html) 和 [SelectableRegion](https://api.flutter.dev/flutter/widgets/SelectableRegion-class.html) 默认使用这些新的手势。

三击

• 三指点击并拖拽：扩展段落选择。
• 三指点击：选择点击位置的段落。

双击（双击这里）

• 双击并拖动：扩展单词的选择（支持原生 Android、Fuchsia 和 iOS，以及 iOS 网页）。
• 双击：选择点击位置的单词（支持原生 Android、Fuchsia 和 iOS，以及 Android 和 Fuchsia 网页）。

引擎 叶轮（impeller）

提高性能和音质

随着即将在 iOS 稳定版本中移除 Impeller 退出选项，团队一直在努力改进 Impeller 的性能和保真度。例如，一系列对文本渲染的改进大幅提升了表情符号滚动的流畅度，避免了大量表情符号滚动时的卡顿，这是一次严峻的考验，展现了 Impeller 在文本渲染方面的强大能力。

此外，通过解决这些问题（https://github.com/flutter/engine/pull/53042），我们在本次发布中显著提高了Impeller文本渲染的准确性。特别是，文本的粗细、间距和字距调整现在都与传统渲染器的效果一致。

请看这里，字体间的空隙太大，而且字体比预期的要细。

之后

请注意，这里有个间距错误。

之后

Android 预览版

在这次更新中，我们继续在Android上预览Impeller。由于在Android 14中存在一个影响Impeller使用的平台视图（Platform Views）API的bug，我们延长了预览期。尽管这个bug已经由Android团队修复了，但许多已部署的设备在未来一段时间内仍将运行未修复的Android版本。为应对这些问题，需要进行额外的API迁移，这将导致额外的稳定发布周期。出于谨慎考虑，为了确保Flutter应用能在尽可能广泛的设备上运行，我们将在今年晚些时候的稳定版本发布之前，暂不将Impeller设为默认渲染器。

随着 Impeller 预览在 3.24 稳定版本周期中继续进行，我们建议 Flutter 开发人员升级到最新稳定版，并在启用 Impeller 时报告任何遇到的问题。在这个阶段，您的反馈对于确保 Impeller 在 Android 上的成功至关重要，同时也帮助我们有信心在今年晚些时候将其设为默认渲染器。与 iOS 生态系统相比，Android 硬件生态系统更加多样化。因此，为了提供最有帮助的反馈，请包括出现问题的具体设备型号和 Android 版本的详细信息。

缩小版图片的优化默认设置

在此版本中，图像的默认FilterQuality已从FilterQuality.low更改为FilterQuality.medium。当一个大图明显大于其目标区域时，这种情况很常见，使用FilterQuality.low会使图像看起来更‘像素化’，并使渲染速度变慢。未来团队还将考虑为各FilterQuality级别使用更合适的名称。

Flutter GPU 预览功能

Flutter 最近在主渠道推出了一项重大更新，增强了 GPU 渲染能力。这项低级图形 API 让开发者可以使用 Dart 代码和 GLSL 着色器实现自定义渲染器，而无需编写任何原生代码。

Flutter GPU 扩展了您可以直接在 Flutter 中渲染的内容，支持高级图形和 3D 场景的渲染。需要 Impeller 渲染后端，目前支持 iOS、macOS 和 Android。尽管目前还处于早期预览阶段，Flutter GPU 的最终目标是支持所有 Flutter 平台。

该API允许对渲染通道附件（附件指的是附件的绑定）、顶点处理阶段以及数据上传至GPU进行全面控制。这种灵活性对于创建从2D角色动画到各种渲染解决方案（包括复杂3D场景）至关重要。

开发人员可以通过切换到主渠道并在项目中添加flutter_gpu包来开始使用Flutter GPU。接下来的几个月里，我们将会看到更多的功能改进和稳定性增强，而像flutter_scene这样的高级渲染库会使使用这些高级特性变得更加简单。

想深入了解 Flutter GPU 并看看如何在你的项目中利用它，请参阅详细的Flutter GPU 博客文章。不论是创建游戏、复杂图形等，Flutter 新的 GPU 功能使其成为你产品强有力的工具。

网 多视角嵌入

Flutter 网页应用现在可以利用多视图嵌入功能，让开发者能够同时向多个 HTML 元素渲染内容。这一特性常被称为“嵌入模式”或“多视图”，为将 Flutter 视图集成到现有网页应用中提供了更多灵活性。

当处于多视图模式时，Flutter 网页应用在启动时不会立即进行渲染。相反，在主机应用通过addView方法添加第一个“视图”后才开始渲染。主机应用可以动态地添加或移除这些视图，Flutter 会相应地调整其组件。

要启用多视图模式，请在 flutter_bootstrap.js 文件中的 initializeEngine 方法内设置 multiViewEnabled: true。之后可以通过 JavaScript 管理视图，将其添加到指定的 HTML 元素，并根据需要移除。每次添加或移除视图时，都会触发 Flutter 的更新，从而实现动态内容的渲染。

此功能特别适合将 Flutter 整合进复杂网页应用中。这种应用中往往需要多个独立的 Flutter 视图。它还支持为每个视图自定义初始化数据，从而实现个性化的配置，并提供互动式的体验。

若想在 Flutter Web 应用中更深入地实现多视图嵌入功能，请查看详细文档。

变现 视频广告盈利支持

我们发布了一个新的互动媒体广告(IMA)插件，以支持Flutter移动应用中的视频插入广告获利。新的IMA插件在现有的Google移动广告(GMA)插件支持的展示广告形式之上，这也为Flutter应用提供了新的广告获利机会。

视频中的插播广告通常在视频播放前（前置广告）、播放中（中插广告）或播放后（后置广告）展示给用户。有些插播广告可以跳过。

Flutter IMA 的好处：

• 可以无缝地在 Flutter 应用中将视频播放内容变现。例如，当应用用户点击视频内容上的播放按钮时，现在可以使用 Flutter IMA 插件先为用户显示一个 15 秒的广告，然后再开始播放视频内容。
• 享受与原生 IMA SDK 相同的好处，包括访问 Google 的高级广告需求和符合行业标准（如 IAB VAST）。

当前版本目前支持在 Android 和 iOS 平台上播放前贴片视频广告。中插广告的支持即将上线。我们鼓励您开始在您的 Flutter 应用视频内容中探索新的 IMA 插件。如果有任何问题或顾虑，请随时在 GitHub 上告知我们。

资源：相关资源：插件指南页面、示例应用程序、Git 仓库

iOS Swift Package Manager 初始支持功能

如今，Flutter 使用 CocoaPods 来处理针对 iOS 或 macOS 的原生依赖。

Flutter 3.24 开始支持 Swift Package Manager。这带来了许多好处，比如：

1. *访问Swift包生态系统。Flutter插件将能够利用日益增长的Swift包生态系统！
2. *简化Flutter安装。Swift包管理器已内置在Xcode中。将来，您无需再安装Ruby和CocoaPods来为Apple平台使用Flutter了。

我们鼓励插件作者尝试为自己的插件添加对 Swift Package Manager 的支持功能（如何为现有的 Flutter 插件添加 Swift Package Manager 支持），并向我们分享您的体验和反馈。

如果您有关于 Flutter 对 Swift Package Manager 支持的反馈，请通过链接提交反馈。

生态圈 共享偏好插件的更新

我们为shared_preferences插件新增了这两个API：SharedPreferencesAsync和SharedPreferencesWithCache。其中最值得注意的是，Android实现现在改用Preferences DataStore（偏好设置数据存储），而不是之前的Shared Preferences。

SharedPreferencesAsync 让用户可以直接调用平台以获取设备上存储的最新偏好设置，代价是它会异步执行，速度比使用缓存稍微慢一些。这对于那些可能被其他系统或隔离单元更新的偏好设置非常有用，这会使缓存失效。

SharedPreferencesWithCache 是在 SharedPreferencesAsync 的基础上构建的，允许用户同步读取本地缓存的偏好设置缓存。这与旧的 API 类似，但现在可以使用不同的参数多次创建实例。

这些新 API 的目的是在未来替代现有的 SharedPreferences API。这是生态系统中使用最频繁的插件之一，我们也知道，对于生态系统来说，过渡到这些新 API 将需要一些时间。

2024 Flutter 和 Dart 包生态体系欧洲大会

作为 Fluttercon Europe 2024 的一部分，我们举办了第一届 Flutter 和 Dart 包生态系统面对面峰会。这紧随我们在 2023 年 8 月举办的首次虚拟峰会之后举行。更多详情可以在这里查看 这里。

我们很高兴地宣布，下一次的峰会将于2024年9月20日在纽约市举行！如果你是包的作者或贡献者，并计划参加2024年的Fluttercon USA，注册以保留你在峰会上的席位。

本次峰会聚集了包作者和维护者，开展了围绕以下主题的非正式会议。

• 第1节 — 本机互操作的过去、现在和未来
• 第2节 — 可持续的包维护模型
• 第3节 — 应对包生态系统碎片化

我们相信，特别是在更广泛的 Flutter 和 Dart 活动中，这次峰会是一个让社区成员自由交流的宝贵平台，找出关键问题并集思广益。我们期待未来能举办更多这样的峰会并与社区合作。

开发工具和IDE：集成开发环境（IDE）

这次发布带来了Flutter DevTools工具套件中的一些令人兴奋的改进。

如果你曾经好奇过你的 Flutter 应用是否构建了比预期更多的 Widgets，那么 DevTools 性能 工具中的一个新功能可以帮到你。使用新的 重建统计信息 功能，你可以捕获你的应用或特定的 Flutter 帧中一个 widget 被构建了多少次的详细信息。

一个开发者工具性能面板的截图，展示了重建统计信息。

我们为网络分析器和Flutter 深链工具等工具添加了优化和关键错误修复，并进行了通用改进，以提升您在 IDE 中使用 DevTools 的体验。说到 IDE，你知道可以直接在 IDE 内使用每个 DevTools 工具吗？

VS Code 窗口里会打开开发工具相关的窗口。

在 Android Studio 工具窗口内打开 DevTools 界面。

此版本包含了 VS Code 中 Flutter 侧边栏的改进，方便您更容易找到所需的工具。请升级到 VS Code 和 Flutter 及 Dart 扩展的最新版本，以便使用改进的侧边栏。

Flutter 侧边栏非常灵活，能够适应您的工作区

此版本还带来了DevTools 扩展框架的一些重要更新。现在您可以在调试 Dart 或 Flutter 测试时使用 DevTools 扩展程序，甚至在无需进行调试时，在您的 IDE 编写代码时也可以使用它们。由您的某个包依赖项提供的工具，如果想使用（或构建一个！）这样的工具来帮助这些用户旅程，现在是可能的了。

要了解更多关于 Flutter 3.24 中包含的所有更新，请参阅 DevTools 的发布日志 2.35.0，2.36.0，以及 2.37.2，点击链接查看详细信息。

每项重大变更及其即将淘汰的功能

本次更新包含了一些重要的变化，包括对Navigator 的 pages API、PopScope 中的泛型、Flutter Web 的默认渲染引擎的更改，还有一些新的功能被标记为即将废弃。请查看重大变更页面以获取详细的迁移指南。

一如既往地，感谢社区为提供测试（贡献测试）——这些有助于我们发现破坏性更改。想了解更多，请参阅Flutter的破坏性更改政策。

结尾：

Flutter 的成功离不开你——我们了不起的大家。没有你无数的贡献和坚定不移的热情，这次发布是不可能完成的。我们从心底感谢大家。

为了详细了解这次发布的具体细节，我们邀请您查阅发布说明以及变更日志，以获取 Flutter 3.24 的详尽新增功能列表。

Flutter 3.24 和 Dart 3.5 现已在稳定渠道发布。用 Flutter 开始这次新旅程，只需运行 flutter upgrade 命令即可。我们迫不及待想看到你用 Flutter 创造出什么！