Flutter 3.16 中带来的更新

Flutter 3.16 中带来的更新

1. 概述

2. 框架更新

2.1 Material 3 成为新默认

从此版本开始，Material 3 成为新的默认主题。你可以通过在 MaterialApp 主题中指定 useMaterial3: false 来选择不使用 Material 3，但 Material 2 最终将被弃用并删除。

你仍然可以通过在主题中指定来选择退出 M3 版本的 Material 库MaterialApp，但 Material 2 最终将被弃用并删除。

此外，某些组件不仅可以更新，还需要全新的实现。因此，当您看到它作为 Material 3 运行时，您的 UI 可能看起来有点奇怪。要解决此问题，请手动迁移到新的组件，例如 NavigationBar。

有关更多详细信息，请查看：https://github.com/flutter/flutter/issues/91605

演示应用程序允许你尝试所有组件。该演示支持切换，useMaterial3以便您可以比较更改。

2.2 支持 Material 3 动画

Material 3 动画的改进包括添加了 Easing 和 Durations 类。Material 2 的曲线已被重命名为包含 “legacy” 的词，最终将被弃用和删除。

2.3 TextScaler

为了支持 Android 14 的非线性字体缩放功能，新的 TextScaler 类取代了 Text.textScaleFactor 属性。

2.4 SelectionArea 更新

Flutter 的 SelectionArea 已更新，支持使用鼠标进行单击或双击，以及在触摸设备上长按的原生手势。

单击：在单击的位置设置折叠选区。
双击：选择单击位置的单词。
双击 + 拖动：扩展单词块中的选择范围。

长按+拖动：扩展单词块中的选择范围。

2.5 MatrixTransition 动画

新的 MatrixTransition 组件允许在创建动画过渡时进行变换。根据当前动画值，你可以提供应用于子窗口组件的矩阵变换，以创建类似于以下 GIF 中的效果。

import 'dart:math';import 'package:flutter/material.dart';void main() => runApp(const MatrixTransitionExampleApp());class MatrixTransitionExampleApp extends StatelessWidget {const MatrixTransitionExampleApp({super.key});@overrideWidget build(BuildContext context) {return const MaterialApp(home: MatrixTransitionExample(),);}
}class MatrixTransitionExample extends StatefulWidget {const MatrixTransitionExample({super.key});@overrideState<MatrixTransitionExample> createState() =>_MatrixTransitionExampleState();
}class _MatrixTransitionExampleState extends State<MatrixTransitionExample>with TickerProviderStateMixin {late AnimationController _controller;late Animation<double> _animation;@overridevoid initState() {super.initState();_controller = AnimationController(duration: const Duration(seconds: 2),vsync: this,)..repeat();_animation = CurvedAnimation(parent: _controller,curve: Curves.linear,);}@overridevoid dispose() {_controller.dispose();super.dispose();}@overrideWidget build(BuildContext context) {return Scaffold(body: Center(child: MatrixTransition(animation: _animation,child: const Padding(padding: EdgeInsets.all(8.0),child: FlutterLogo(size: 150.0),),onTransform: (double value) {return Matrix4.identity()..setEntry(3, 2, 0.004)..rotateY(pi * 2.0 * value);},),),);}
}

见 https://dartpad.dev/?channel=beta&id=c82be58209035722f2cc7d78da855329

2.6 滚动更新

在 Flutter 3.13 中首次发布了二维滚动基础设施后，此版本带来了更多的功能和改进。在 Flutter 3.16 中，2D 基础设施现在支持 KeepAlive 组件，以及默认的焦点遍历和隐式滚动。构建在基础设施之上的 2D 滚动组件将自动采用这种支持。关于在 2D 基础设施上构建的全面指南，请查看 Flutter Build Show 的最新一集。

在 3.13 版本发布后不久，发布了 two_dimensional_scrollables 包。这个包由 Flutter 团队维护，并包含了基于框架基础设施构建的第一个 2D 滚动组件 —— TableView。自初始发布以来，已经添加了更多的装饰和样式支持，并进行了额外的错误修复。

Flutter 二维滚动

2.7 在编辑菜单中添加附加选项

在本机 iOS 上，用户现在可以选择文本并启动提供多种标准服务的共享菜单。在此版本中，我们添加了查找、搜索和共享选项。

2.8 PaintPattern 添加到 flutter_test

在 flutter_test 包中，新增的 PaintPattern 类允许你验证像 CustomPainters 和 Decorations 这样的组件对画布进行的绘制调用（在单元测试中使用）。

以前，需要一个金色文件来验证是否绘制了正确的颜色和矩形，但现在你可以使用 PaintPattern。以下示例验证 MyWidget 是否在画布上绘制了一个圆：

expect(find.byType(MyWidget),paints..circle(x: 10,y: 10,radius: 20,color: const Color(0xFFF44336),),
);
// Multiple paint calls can even be chained together.
expect(find.byType(MyWidget),paints..circle(x: 10,y: 10,radius: 20,color: const Color(0xFFF44336),),..image(image: MyImage,x: 20,y: 20,),
);