🚀

Flutter 3.16のアップデートを簡単にまとめ

2024/04/26に公開

Android

Flutter 3.16 のアップデートでは Material 3 がデフォルトで採用され、Android 14の予測的バックナビゲーションや、iOSのExtensionのFlutterによる実装、DevTools 拡張機能の構築が可能になりました。

以下では、公式の情報を基にして、まとめを簡単に書きたいと思います。

フレームワークのアップデート

Material 3 のデフォルト適用

Flutter 3.16 からは、useMaterial3 が false に設定されていない限り、Material 3 がデフォルトで使用されます。

Material 2 は将来的に非推奨とされ、UI の見た目に大きな変更が生じる可能性があるため、Material 3 への移行を検討する良い機会です。

これには、Material 3 Navigation Bar のような完全な書き換えや、フォントの文字間隔の拡大による golden test への影響が含まれます。

Material Designの最新バージョンへの移行は、開発者にとって見た目のリフレッシュだけでなく、ユーザー体験の向上ももたらします。新しいカラーテーマやタイポグラフィー、コンポーネントはアプリの魅力を高めてくれるはずです。

SelectionAreaの機能強化

SelectionArea ウィジェットがマウス操作やタッチデバイスの長押しに対応するジェスチャをサポートするようになり、ネイティブの挙動をより忠実に再現します。

メニューアイテムのフォーカス改善

メニューアイテム選択後、ユーザがメニューを開く前にフォーカスしていたウィジェットにフォーカスが戻るようになります。

MatrixTransitionアニメーション

新たに導入されたMatrixTransitionウィジェットは、現在のアニメーション値に基づいて、アニメーション遷移を作成する際に子ウィジェットに行列変換を適用できるようになるものです。

よりリッチなアニメーションを実装できるようになり、アプリのインタラクティブ性が向上するかもしれません。

スクロールの拡充

Flutter 3.16では、KeepAliveウィジェットがサポートされ、デフォルトのフォーカストラバーサルと暗黙のスクロールがサポートされました。これにより、2次元スクロールウィジェットはこれらの機能を自動的に利用できるようになりました。

flutter_testでペイントを検証するためのクラスを追加

flutter_testパッケージに新たに追加されたPaintPatternクラスを使用することで、CustomPaintersやDecorationsなど、ウィジェットがキャンバス上に行うペイントコールを効率的に検証できます。これは主にユニットテストで利用され、以前はゴールデンファイルを必要としていました。
ちなみに、PaintPatternクラスのようなものは以前からFlutterの奥深くにあったそうです。

expect(
  find.byType(MyWidget),
  paints
    ..circle(
      x: 10,
      y: 10,
      radius: 20,
      color: const Color(0xFFF44336),
    ),
);

ペイントを検証するテストケースを実プロジェクトで見たことがまだありませんが、機会があれば書いてみたいです。

Engineのアップデート

Impellerの改良

Impellerは、Vulkanをサポートしていないデバイスでの完全な機能はまだ保証されていませんが、パフォーマンスオーバーレイの表示問題はこのリリースで修正されました。

Paint.enableDitheringのデフォルト適用

色の諧調をなめらかにするためのPaint.enableDitheringプロパティがデフォルトで有効化されました。

Androidの拡張

TextScalerの導入

Android 14向けに非線形フォントスケーリングをサポートするTextScalerクラスが導入され、Text.textScaleFactorプロパティが非推奨になります。

マウススクロールの改善

Androidデバイス上でのマウスのホイールによるスクロール体験が向上し、スクロール速度が調整されました。

予測的バックナビゲーション

Android 14 で開始された予測的バックジェスチャー機能が Flutter に追加されました。この機能により、ユーザーはバックジェスチャを使って次に表示される画面を事前に覗き見ることが可能になります。WillPopScope から PopScope への移行方法についての詳細は公式ドキュメントをご参照ください。

なお、PopScopeの書き換えの際に、ルート画面でバックボタンを押した際にアプリが閉じない問題に対処するため、SystemNavigator.pop を使用してアプリを明示的に終了する処理を実装する場面がありました。

Android 14で導入された新機能とのシームレスな統合により、ユーザビリティの向上が期待されますね。

iOS

編集メニューの項目追加

テキスト選択時に「調べる」「検索」「共有」のオプションが利用可能に。

アプリ拡張機能

iOSのExtensionをFlutterで実装することが可能になりました。ただし、ホーム画面のウィジェットは非対応です。

Flutter(Dart)の資産を再利用してExtensionの実装ができるようになり、これまで手を出さなかったExtensionが実装されるようになる画面が出てくるかもしれません。

パッケージエコシステムの強化

Favorite指定パッケージ

Flame、flutter_animate、flutter_rust_bridge、riverpod、video_player、macos_ui、fpdartがFlutter Favoriteプログラムに再指定されました。
riverpodが指定されました🎉

Googleマップのカスタマイズ

Googleマッププラットフォームでクラウドベースのスタイリングすることにより、アプリコードを更新せずにマップのカスタマイズが行えます。

Googleマップを導入するプロジェクトがあったら思い出したいです。

Camera Xの機能強化

Androidアプリに豊富なカメラ機能を追加するためのJetpackライブラリ、Camera Xが改善されました。

DevTools

DevTools 拡張機能

Flutter DevTools に新しい拡張機能フレームワークが導入され、カスタムツールの構築やアプリのデバッグがより柔軟に行えるようになりました。また、「ホーム」画面の追加で接続されたアプリの概要がすぐに把握でき、ホットリスタートの堅牢性も向上しました。

デバッグツールの構築が可能になることで、今後、より便利なツールが提供されたり、自分たちで開発する場面が出てくるかもしれません。効果的なツールが登場すればエラー診断の時間短縮や効率化に直接貢献するので期待大です。

VS Code UIの発見性

Flutter の VS Code 拡張機能が更新され、DevTools 画面などへのアクセスが簡単になる新しい Flutter サイドバーが追加されました。

廃止予定および破壊的変更

廃止ガイドはこちらです。