欢迎来到最新的 Flutter 更新!Flutter 3.24 带来了令人兴奋的新功能和增强功能,提升了您的应用开发体验。此次发布的重点是预览版 Flutter GPU,它可以直接在 Flutter 中实现高级图形和 3D 场景。网页应用现在可以嵌入多个 Flutter 视图,增强了应用的多样性。最后,我们还增加了视频广告变现支持,帮助您最大化收入。
在过去的几个月里,Flutter 社区非常活跃,共有 852 个框架提交和 615 个引擎提交。我们很高兴地欢迎 49 位新贡献者,他们帮助实现了这一版本的发布。您的奉献和热情是推动 Flutter 前进的动力。
让我们一起来探索 Flutter 社区在最新版本中带来的所有新功能和增强功能吧!
Flutter 框架
新的 Slivers
此次发布新增了可以组合在一起实现动态应用栏行为的新 sliver:
您可以使用这些新的 sliver 创建在用户滚动时浮动、固定或调整大小的标题。这些新 sliver 类似于现有的 SliverPersistentHeader 和 SliverAppBar sliver,但具有更简单的 API,可以组合使用以达到更大的效果。
这些新 sliver 附带了新的示例代码。例如,PinnedHeaderSliver 的 API 文档中有一个示例,可以重现类似 iOS 设置应用的应用栏效果:
Cupertino 库的更新
在此版本中,我们改进了 CupertinoActionSheet 的精确度。滑动手指穿过操作表的按钮时现在会提供触觉反馈。按钮的字体大小和粗细现在与其原生对应项一致。
我们还为 CupertinoButton 添加了新的焦点属性,现在您可以自定义禁用状态下的 CupertinoTextField 的颜色。
Cupertino 库的更新正在进行中,敬请期待未来版本中的更多更新!
树形视图 TreeView
two_dimensional_scrollables 包发布了 TreeView 小部件,以及用于构建高性能滚动树的几个配套类,这些树可以在树状结构增长时向各个方向滚动。该包中包含的示例应用也进行了更新,增加了几个使用 TreeView 和 TreeView 小部件的新示例。
框架中还新增了 TreeSliver,用于构建一维滚动的树状结构。TreeView 和 TreeSliver 的 API 是匹配的,使得在不同的用例中切换变得容易。
CarouselView
此次发布包括了符合 Material Design 设计的轮播小部件:CarouselView。CarouselView 提供了 “Uncontained” 布局:一个可滚动的项目列表,这些项目滚动到容器边缘时,前导和尾随项目在滚动出视图和滚动进入视图时可以动态改变大小。
小部件的更多功能
此次发布包含了一些将核心小部件逻辑(非设计特定的)从 Material 库迁移到 Widgets 库以便更广泛使用的工作。这包括:
- Feedback 小部件:提供对手势(如点击、长按等)的触觉和音频反馈的简单访问。
- ToggleableStateMixin 和 ToggleablePainter:用于构建切换小部件(如复选框、开关和单选按钮)的基础类。
动画状态的增强枚举特性
社区成员 @nate-thegrate 进行了精彩的贡献,为 AnimationStatus 添加了增强的枚举特性,包括以下 getter:
isDismissed
isCompleted
isRunning
isForwardOrCompleted
这些 getter 之前已经存在于 AnimationController 和 CurvedAnimation 等 Animation 子类中。现在,这些状态 getter 在 AnimationStatus 以及 Animation 子类中都可以使用。最后,AnimationController 还新增了一个切换方法,用于切换动画方向。
SelectionArea 的更新
Flutter 的 SelectionArea 现在支持更多与鼠标三击和触摸设备双击相关的原生手势。默认情况下,SelectionArea 和 SelectableRegion 小部件使用这些新手势。
三击
- 三击 + 拖动:扩展在段落块中的选择。
- 三击:选择点击位置的段落块。
双击
- 双击 + 拖动:扩展在单词块中的选择(支持原生 Android/Fuchsia/iOS 和 iOS Web)。
- 双击:选择点击位置的单词(支持原生 Android/Fuchsia/iOS 和 Android/Fuchsia Web)。
引擎
Impeller
提升性能和精度
为了在即将发布的稳定版中去除 iOS 上的 Impeller 退出选项,团队一直在努力提升 Impeller 的性能和精度。例如,经过一系列改进,文本渲染性能得到了极大提升,特别是在大规模表情符号滚动时消除了卡顿,这成为了对 Impeller 文本渲染能力的极佳压力测试。
此外,通过解决多个问题,我们也大大提高了 Impeller 文本渲染的精度。特别是,文本的粗细、间距和字距现在都与旧版渲染器的精度相匹配。
前 | 后 |
---|---|
前 | 后 |
---|---|
Android 预览
在此版本中,我们继续在 Android 上预览 Impeller。由于 Android 14 中存在一个影响 Impeller 使用的 Platform Views API 的错误,我们已将预览期延长。尽管 Android 团队已经修复了这个错误,但许多已部署的设备在可预见的未来将运行未修补的 Android 版本。解决这些问题意味着需要额外的 API 迁移和稳定版本周期。出于谨慎考虑,并为了确保 Flutter 应用能在尽可能多的设备上正常工作,我们决定推迟将 Impeller 设为默认渲染器,直到今年晚些时候的稳定版发布。
随着 Impeller 在 Android 上的预览继续进行,我们请求 Flutter 开发者升级到最新的稳定版本,并在启用 Impeller 时报告任何发现的问题。此阶段的反馈对于确保 Impeller 在 Android 上成功至关重要,并帮助我们在未来的发布中自信地将其设为默认渲染器。Android 硬件生态系统比 iOS 生态系统要多样得多。因此,关于 Impeller 的最有帮助的反馈应包含关于具体设备和 Android 版本的详细信息,以便我们准确定位问题。
下采样图像的默认值改进
在此版本中,图像的默认 FilterQuality
从 FilterQuality.low
更改为 FilterQuality.medium
。当大图像明显大于其目标矩形时,这是一种常见场景,FilterQuality.low
会使图像看起来更“像素化”,并且渲染速度比 FilterQuality.medium
慢。未来,团队还将探索更合适的 FilterQuality
级别名称。
Flutter GPU 预览
Flutter 引入了一个主要更新,用于增强渲染能力,即 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 功能都使其成为一个强大的选择。
Web - 多视图嵌入
Flutter Web 应用现在可以利用多视图嵌入功能,允许开发者同时渲染内容到多个 HTML 元素中。此功能称为“嵌入模式”或“多视图”,为将 Flutter 视图集成到现有 Web 应用中提供了灵活性。
在多视图模式下,Flutter Web 应用在启动时不会立即渲染。相反,它会等到主机应用使用 addView
方法添加第一个“视图”时才开始渲染。主机应用可以动态添加或移除这些视图,Flutter 会相应地调整其小部件。
要启用多视图模式,请在 flutter_bootstrap.js
文件中的 initializeEngine
方法中设置 multiViewEnabled: true
。然后可以通过 JavaScript 管理视图,将它们添加到指定的 HTML 元素中,并在需要时将其移除。每次添加和移除视图都会触发 Flutter 中的更新,从而实现动态内容渲染。
此功能特别适用于将 Flutter 集成到复杂的 Web 应用中,其中需要多个独立的 Flutter 视图。它还支持为每个视图提供自定义初始化数据,允许个性化配置和互动体验。
有关在 Flutter Web 应用中实现多视图嵌入的详细信息,请查看详细文档。
变现
视频广告变现支持
我们推出了一个新的交互式媒体广告(IMA)插件,以支持 Flutter 移动应用中的视频广告变现。这个新的 IMA 插件为 Flutter 应用提供了新的广告变现机会,补充了现有的主要支持展示广告格式的 Google Mobile Ads(GMA)插件。
视频广告通常在视频内容播放前(前插广告)、播放中(中插广告)或播放后(后插广告)显示给用户。有些视频广告也可以跳过。
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 的初步支持。这带来了几个好处,包括:
- 访问 Swift 包生态系统:Flutter 插件将能够利用日益增长的 Swift 包生态系统!
- 简化 Flutter 安装:Swift Package Manager 与 Xcode 捆绑在一起。将来,您无需安装 Ruby 和 CocoaPods 就能在 Apple 的平台上使用 Flutter。
我们鼓励插件作者尝试为您的插件添加对 Swift Package Manager 的支持,并提供使用反馈。
如果您对 Flutter 支持 Swift Package Manager 有任何反馈,请提交问题。
生态系统 - Shared Preferences 插件更新
我们为 shared_preferences 插件添加了两个新 API,分别是 SharedPreferencesAsync 和 SharedPreferencesWithCache。最显著的变化是 Android 实现使用 Preferences DataStore 代替 Shared Preferences。
- SharedPreferencesAsync 允许用户直接调用平台以获取设备上保存的最新偏好设置,代价是它是异步的,并且比使用缓存版本稍慢。这对于可能由其他系统或隔离区更新的偏好设置非常有用,因为这些更新会使缓存过时。
- 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 开发工具套件的激动人心的改进。
如果您曾经想知道您的 Flutter 应用程序是否构建了比预期更多的小部件,开发工具性能工具中的一个新功能可以帮助您。使用新的重建统计功能,您可以捕捉有关应用程序中小部件构建次数的信息,甚至可以在特定的 Flutter 帧中捕捉这些信息。
DevTools 性能工具跟踪重建统计信息的截图
我们对网络分析器和 Flutter 深度链接工具等工具进行了优化和关键错误修复,并进行了一些总体改进,以在您在 IDE 中使用 DevTools 时提供更好的体验。说到 IDE,您知道吗,您可以在 IDE 中直接使用每个 DevTools 工具?
DevTools 屏幕在 VS Code 窗口内打开
此版本对 VS Code 中的 Flutter 侧边栏进行了改进,使您更容易访问所需的工具。升级到最新版本的 VS Code 以及 Flutter 和 Dart 扩展,以访问改进后的侧边栏。
Flutter 侧边栏具有自适应性,可根据您的工作区进行缩放
此版本还包括对 DevTools 扩展框架的一些重大改进。现在,当您调试 Dart 或 Flutter 测试时,甚至当您没有调试任何东西时,只是在 IDE 中编写代码时,您都可以使用 DevTools 扩展(由您的包依赖项提供的工具)。因此,如果您想使用一个工具(或构建一个工具)来满足这些用户需求,现在已经成为可能。
要了解 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
。我们迫不及待地想看到您构建的成果!