第28章 Flutter 3.24 正式发布：Flutter GPU 预览版与多视图嵌入亮相
What’s new in Flutter 3.24 发布 Flutter GPU、多视图嵌入及其他特性 Kevin Chisholm 2024年8月6日 · 14 分钟阅读 rss_feed 在 X 上分享 在 Bluesky 上分享 在 LinkedIn 上分享 蓝色背景下的 Flutter 3.24 欢迎体验 Flutter 最新版本！Flutter 3.24 带来了众多激动人心的新特性和改进，全面提升应用开发体验。本次发布重点介绍了 Flutter GPU 的预览版，它允许直接在 Flutter 中实现高级图形和 3D 场景。Web 应用现在支持嵌入多个 Flutter 视图，增强了应用的灵活性。此外，我们新增了视频广告变现支持，助你最大化收益。 过去几个月，Flutter 社区异常活跃，提交了 852 个框架代码和 615 个引擎代码。我们很高兴迎来 49 位新贡献者，正是他们的努力促成了本次发布。你们的专注与热情是 Flutter 前行的动力。 现在，请深入探索，发现 Flutter 社区为这一最新版本带来的所有新特性和改进！ Flutter 框架 新的 Sliver 此版本新增了几种 sliver，可组合以实现动态 app bar 行为： PinnedHeaderSliver SliverResizingHeader 你可以使用这些新的 sliver 创建浮动、固定或随用户滚动而调整大小的头部。这些新 sliver 类似于现有的 SliverPersistentHeader 和 SliverAppBar sliver，但拥有更简洁的 API，组合使用可产生更佳效果。 这些新 sliver 附带新的示例代码。例如，PinnedHeaderSliver 的 API 文档中包含一个示例，重现了类似 iOS 设置应用 app bar 的效果： Cupertino 库的更新 在此版本中，我们提升了 CupertinoActionSheet 的还原度。在操作按钮上滑动手指现在可提供触觉反馈。按钮的字体大小和粗细现在也与原生对应项相匹配。 我们还为 CupertinoButton 新增了焦点属性，现在也可以自定义禁用状态的 CupertinoTextField 颜色。 Cupertino 库的全面升级正在进行中，期待在后续版本中看到更多更新！ TreeView two_dimensional_scrollables 包发布了 TreeView 组件，以及若干配套类，用于构建高性能的滚动树，随着树的生长可在所有方向滚动。该包中的示例应用也更新了，展示了使用 TableView 和 TreeView 组件的多个新示例。 框架中新增了 TreeSliver，用于构建一维滚动树。 TreeView 和 TreeSliver API 一致，方便根据用例轻松切换。 CarouselView 此版本包含 Material Design 轮播 组件：CarouselView。CarouselView 呈现“无容器”布局：一个可滚动项目列表，项目滚动至容器边缘时，前后项目会在滚动出和进入视图时动态改变大小。 组件提供更多功能 此版本包含部分核心 widget 逻辑的重构工作，将非特定设计的逻辑从 Material 库迁移至 Widgets 库，以便更通用的使用。内容包括： Feedback widget，提供易于访问的触觉和音频反馈，响应轻击、长按等手势。 ToggleableStateMixin 和 ToggleablePainter，用于构建复选框、开关和单选按钮等切换 widget 的基类。 增强的 AnimationStatus 枚举特性 感谢社区成员 @nate-thegrate 的优秀贡献，为 AnimationStatus 添加了增强的枚举特性，包括 getter： isDismissed isCompleted isRunning isForwardOrCompleted 其中一些 getter 此前已存在于 Animation 子类中，如 AnimationController 和 CurvedAnimation。现在，所有这些状态 getter 在 Animation 子类和 AnimationStatus 中均可用。最后，为 AnimationController 添加了 toggle 方法，用于切换动画方向。 SelectionArea 更新 Flutter 的 SelectionArea 现在支持更多原生手势，包括使用鼠标的三击和触摸设备的双击。默认情况下， SelectionArea 和 SelectableRegion 组件使用这些新手势。 三击 三击 + 拖拽：在段落块中扩展选区。 三击：选中点击位置的段落块。 双击 双击 + 拖拽：在单词块中扩展选区（支持原生 Android/Fuchsia/iOS 以及 iOS Web）。 双击：选中点击位置的单词（支持原生 Android/Fuchsia/iOS 以及 Android/Fuchsia Web）。 引擎 Impeller 提升性能和保真度 为迎接即将在稳定版本中移除 iOS 上的 Impeller 退出选项，团队一直在努力改进 Impeller 的性能和保真度。例如，一系列文本渲染改进 极大地提高了表情符号滚动的性能，消除了滚动大量表情符号时的卡顿，这是对 Impeller 文本渲染能力的绝佳压力测试。 此外，通过解决若干问题 我们也显著提升了此版本中 Impeller 文本渲染的保真度。特别是，文本字重、间距和字距调整现在都与旧渲染器的保真度相匹配。 之前（注意缺少正确的字距调整，且字轻于预期。） 之后 之前（注意间距不正确，例如“vergelijken”） 之后 Android 预览 在此版本中，我们继续预览 Android 上的 Impeller。由于 Android 14 中的一个 bug 影响了 Impeller 用于平台视图的 API，我们延长了预览期。该 bug 已由 Android 团队修复，但许多已部署设备在可预见的未来仍会运行未打补丁的 Android 版本。规避这些问题意味着额外的 API 迁移，因此需要额外的稳定发布周期。出于极度谨慎并确保护 Flutter 应用在最广泛的设备上正常工作，我们暂缓将 Impeller 设为默认渲染器，直至今年稍后的某个稳定版本。 在 Impeller 在 Android 上的预览贯穿 3.24 稳定周期的过程中，我们要求 Flutter 开发者升级到最新稳定版本，并针对启用 Impeller 时发现的任何不足提交 issue。此阶段的反馈对于确保 Impeller 在 Android 上成功以及我们在今年稍后的版本中自信地将其设为默认渲染器至关重要。Android 硬件生态系统比 iOS 生态系统更加多样化。因此，关于 Impeller 最有用的反馈应包含发生问题的特定设备和 Android 版本的详细信息。 改进缩放图像的默认设置 在此版本中，图像的默认 FilterQuality 已从 FilterQuality.low 更改为 FilterQuality.medium。当大图像比其目标矩形大得多时（这是常见场景）， FilterQuality.low 会导致图像看起来更“像素化”，渲染速度比 FilterQuality.medium 更慢。未来，团队还将探索为各种 FilterQuality 级别寻找更合适的名称。 Flutter GPU 预览 Flutter 通过 Flutter GPU 引入了渲染能力的重大更新，该更新可用在 main 通道上。这个底层图形 API 允许开发者使用 Dart 代码和 GLSL 着色器创建自定义渲染器，而无需任何原生平台代码。 Flutter GPU 扩展了你能在 Flutter 中直接渲染的内容，支持高级图形和 3D 场景。它需要 Impeller 渲染后端，目前支持 iOS、macOS 和 Android。虽然处于早期预览阶段，但 Flutter GPU 最终旨在支持所有 Flutter 平台。 该 API 允许完全控制渲染通道附件、顶点阶段以及数据传输到 GPU。这种灵活性对于创建复杂的渲染解决方案至关重要，从 2D 角色动画到复杂的 3D 场景。 开发者可以通过切换到 main 通道并在项目中添加 flutter_gpu 包来开始使用 Flutter GPU。未来几个月将看到更多功能和稳定性改进，如 flutter_scene 等更高级的渲染库将简化这些高级功能的使用。 若要深入了解 Flutter GPU 以及如何在其项目中利用它，请查看详细的 Flutter GPU 博客文章。无论你在创建游戏还是复杂图形，Flutter 的新 GPU 功能使其成为产品的强大选择。 Web 多视图嵌入 Flutter web 应用现在可以利用多视图嵌入，允许开发者同时向多个 HTML 元素渲染内容。此功能称为“嵌入模式”或“多视图”，为将 Flutter 视图集成到现有 web 应用提供了灵活性。 在多视图模式下，Flutter web 应用启动时不会立即渲染。相反，它会等待宿主应用使用 addView 方法添加第一个“视图”。宿主应用可以动态添加或删除这些视图，Flutter 会相应调整其 widget。 要启用多视图模式，请在 flutter_bootstrap.js 文件中的 initializeEngine 方法中设置 multiViewEnabled: true。然后，可以从 JavaScript 管理视图，将其添加到指定的 HTML 元素并根据需要移除。每次添加或移除视图都会触发 Flutter 内的更新，从而实现动态内容渲染。 此功能特别适用于将 Flutter 集成到需要多个独立 Flutter 视图的复杂 web 应用。它还支持为每个视图自定义初始化数据，从而实现个性化配置和交互体验。 若要深入了解如何在你的 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 包管理器初步支持 目前，Flutter 使用 CocoaPods 来管理原生 iOS 或 macOS 依赖项。 Flutter 3.24 新增了对 Swift 包管理器的早期支持。这带来了一些好处，包括： 访问 Swift 包生态系统。Flutter 插件将能够利用不断增长的 Swift 包生态系统！ 简化 Flutter 安装。Swift 包管理器已随 Xcode 捆绑。未来，使用 Flutter 开发 Apple 平台应用时将无需安装 Ruby 和 CocoaPods。 我们鼓励插件作者尝试为你的插件添加对 Swift 包管理器的支持，并提供体验反馈。 如果对 Flutter 对 Swift 包管理器的支持有反馈，请提交一个 issue。 生态系统 共享偏好插件更新 我们在 shared_preferences 插件中添加了两个新 API：SharedPreferencesAsync 和 SharedPreferencesWithCache。最显著的变更是 Android 实现现在使用 Preferences DataStore 而非 Shared Preferences。 SharedPreferencesAsync 允许用户直接调用平台以获取设备上保存的最新偏好，代价是异步操作且比使用缓存版本稍慢。这对于可能由其他系统或 isolate 更新的偏好很有用，因为这些更新会使缓存失效。 SharedPreferencesWithCache 建立在 SharedPreferencesAsync 之上，允许用户同步访问偏好的本地缓存副本。这与旧 API 类似，但现在可以使用不同的参数多次实例化。 这些新 API 旨在未来取代当前的 SharedPreferences API。然而，这是生态系统中使用最广泛的插件之一，我们知道生态系统切换到新 API 需要时间。 Flutter 和 Dart 包生态系统欧洲峰会 2024 作为 Fluttercon Europe 2024 的一部分，我们举办了首次线下 Flutter 和 Dart 包生态系统峰会。这延续了我们在 2023 年 8 月举办首次虚拟峰会的成果。查看讨论会议要点摘要 在此。 我们很高兴宣布，下一届峰会将于 2024 年 9 月 20 日在纽约的 Fluttercon USA 举行！如果你是包作者或贡献者，并计划参加 Fluttercon USA 2024， 请注册以保留你的峰会席位。 峰会将包作者和维护者聚集在一起，就以下主题进行非正式会议式讨论： 第 1 场 — 原生互操作的过去、现在和未来 第 2 场 — 可持续的包维护模式 第 3 场 — 应对包生态系统碎片化 我们相信，峰会，尤其是在更广泛的 Flutter 和 Dart 活动的一部分时，是社区公开讨论、揭示关键挑战并集思广益解决方案的宝贵平台。我们期待与社区合作，在未来举办更多此类峰会。 开发工具与 IDE 此版本包括对 Flutter DevTools 工具套件的若干令人兴奋的改进。 如果你曾怀疑你的 Flutter 应用构建了比预期更多的 Widget， DevTools 性能工具中的新功能可以帮助你解决该问题。使用新的 Rebuild Stats 功能，你可以捕获关于 Widget 在应用或特定 Flutter 帧中构建次数的信息。 DevTools 性能工具跟踪重建统计的截图。 我们为 Network 分析器和 Flutter Deep Links 工具等增加了抛光和关键 bug 修复，并做出了一些通用改进，以在你在 IDE 中使用 DevTools 时提供更好的体验。说到 IDE，你知道你可以直接在 IDE 内部使用每个 DevTools 工具吗？ DevTools 屏幕在 VS Code 窗口内打开。 DevTools 屏幕在 Android Studio 工具窗口内打开。 此版本包括对 VS Code 中 Flutter 侧边栏的改进，让你更轻松地访问所需的工具。升级到最新版本的 VS Code 以及 Flutter 和 Dart 扩展以访问改进后的侧边栏。 Flutter 侧边栏是自适应的，适合你的工作区 此版本还包括对 DevTools Extensions 框架的重大改进。现在，当你调试 Dart 或 Flutter 测试时，甚至当你没有调试任何内容只是在 IDE 中编写代码时，都可以使用 DevTools 扩展（由你的包依赖之一提供的工具）。因此，如果你希望为这些用户旅程使用（或构建！）工具，现在变得可行。 若要了解 Flutter 3.24 中包含的所有更新，请查看 DevTools 2.35.0、2.36.0 和 2.37.2 的发布说明。 破坏性变更和弃用 此版本中的破坏性变更包括对 Navigator 的页面 API 的更改、 PopScope 中的泛型类型、 Flutter web 的默认渲染器 以及引入一些新的弃用项。完整的破坏性变更迁移指南请参见破坏性变更页面。 一如既往，非常感谢社区贡献测试 —— 这些帮助我们识别这些破坏性变更。若要了解更多，请查看 Flutter 的破坏性变更政策。 结语 Flutter 成功的核心在于你们——我们精彩的社区。没有你们无数的贡献和坚定不移的热情，这一版本无法实现。从心底感谢你们。 若要深入了解此版本取得的成果，我们邀请您查看发布说明 和变更日志，以获取 Flutter 3.24 增量的全面列表。 Flutter 3.24 与 Dart 3.5 现已在稳定通道上可用。踏上一段使用 Flutter 的最新旅程，只需运行 flutter upgrade。我们迫不及待地期待看到你所构建的一切！ 更多来自 Flutter What’s new in Flutter 3.47 模块化设计：独立 UI 包与桌面端 Impeller Emma Twersky 2026年8月12日 · 12 分钟阅读 What’s new in Flutter 3.44 赋能开发者于 Google I/O 2026 Khanh Nguyen 2026年5月20日 · 31 分钟阅读
