Flutter 3.16 默認(rèn)采用 Material 3 主題，Android 平臺(tái)預(yù)覽 Impeller，DevTools 擴(kuò)展等等

歡迎回到每季度一次的 Flutter 穩(wěn)定版本發(fā)布，這次是 Flutter 3.16。這個(gè)版本將 Material 3 設(shè)為新的默認(rèn)主題，為 Android 帶來(lái) Impeller 預(yù)覽，支持為 DevTools 添加擴(kuò)展等等！與此同時(shí)，我們還看到了Flutter Casual Games Toolkit 的重大更新。

在距離上一個(gè)版本發(fā)布僅三個(gè)月的時(shí)間里，我們有 145 位社區(qū)成員合并了 928 個(gè)拉取請(qǐng)求，其中有 40 位社區(qū)成員首次貢獻(xiàn)了他們的 Flutter 代碼！

請(qǐng)繼續(xù)閱讀，了解 Flutter 社區(qū)為這個(gè)最新版本做出的所有新增和改進(jìn)！

框架

Material 3 成為新的默認(rèn)主題

從 3.10 版本（2023 年 5 月）開(kāi)始，Material 庫(kù)已更新以符合最新的 Material Design 規(guī)范。更改包括新的組件和組件主題，以及更新的組件外觀。在 3.16 版本之前，這些更改是“選擇加入”的，使用 useMaterial3 主題標(biāo)志。從此版本開(kāi)始，默認(rèn)情況下 useMaterial3 為 true。（#130764）

您仍然可以通過(guò)在 MaterialApp 主題中指定 useMaterial3: false 來(lái)選擇退出 Material 庫(kù)的 M3 版本，但 Material 2 最終將被棄用和移除。此外，一些小部件不僅需要更新，還需要一個(gè)全新的實(shí)現(xiàn)。因此，當(dāng)您看到它作為 Material 3 運(yùn)行時(shí)，您的 UI 可能會(huì)顯得有些奇怪。為了解決這個(gè)問(wèn)題，請(qǐng)手動(dòng)遷移到新的小部件，例如 NavigationBar。有關(guān)更多詳細(xì)信息，請(qǐng)查看 GitHub 上的 Material 3 綜合問(wèn)題。

demo 應(yīng)用允許您嘗試所有組件。該演示支持切換 useMaterial3，以便您可以比較這些更改。

Material 3 組件的外觀主要由 [ThemeData.colorScheme] 和 [ThemeData.textTheme] 的值確定。創(chuàng)建 Material 3 顏色方案的首選方法是使用 ColorScheme.fromSeed()，該方法創(chuàng)建出既美觀又符合輔助功能對(duì)比要求的暗色和亮色方案。您還可以使用 ColorScheme.fromImageProvider 從圖像的主導(dǎo)顏色創(chuàng)建顏色方案。要進(jìn)一步自定義 Material 3 組件的外觀，請(qǐng)向您的 ThemeData 添加組件主題，例如 ThemeData.segmentedButtonTheme 或 ThemeData.snackBarTheme。非空的組件主題屬性將覆蓋組件 API 文檔中指定的默認(rèn)值。

支持 Material 3 動(dòng)效

Material 3 動(dòng)效的改進(jìn)包括添加了 Easing 和 Durations 類。Material 2 曲線已重命名，以包含“l(fā)egacy”一詞，并最終將被棄用和移除。(#129942)

編輯菜單中的額外選項(xiàng)

在原生 iOS 上，用戶現(xiàn)在可以選擇文本并啟動(dòng)共享菜單，提供了幾個(gè)標(biāo)準(zhǔn)服務(wù)。在此版本中，我們添加了查找、搜索和共享選項(xiàng)。

TextScaler 用于指定全局文本縮放因子

為了支持 Android 14 的非線性字體縮放功能，新的 TextScaler 類替代了 Text.textScaleFactor 屬性。(#128522)

SelectionArea 更新

Flutter 的 SelectionArea 已更新以支持與鼠標(biāo)單擊或雙擊以及觸摸設(shè)備上的長(zhǎng)按相關(guān)的本機(jī)手勢(shì)。這些新手勢(shì)默認(rèn)情況下可用于 SelectionArea 和 SelectableRegion。

• 單擊：在單擊位置設(shè)置折疊選擇。
• 雙擊：選擇單擊位置的單詞。
• 雙擊 + 拖動(dòng)：在單詞塊中擴(kuò)展選擇。

- 長(zhǎng)按 + 拖動(dòng)：在單詞塊中擴(kuò)展選擇。

在焦點(diǎn)小部件上運(yùn)行的菜單項(xiàng)

這個(gè)版本主要清理了在使用菜單項(xiàng)時(shí)的焦點(diǎn)更改：FocusManager 的 applyFocusChangesIfNeeded 函數(shù)現(xiàn)在在用戶點(diǎn)擊菜單項(xiàng)時(shí)恢復(fù)菜單焦點(diǎn) — 當(dāng)用戶點(diǎn)擊菜單項(xiàng)時(shí)，焦點(diǎn)已經(jīng)返回到在打開(kāi)菜單之前具有焦點(diǎn)的項(xiàng)目。 (#130536)

iOS、macOS中菜單項(xiàng)快捷鍵的自動(dòng)重新排序

在Mac平臺(tái)上，Flutter應(yīng)用現(xiàn)在按照蘋果人機(jī)界面指南對(duì)菜單中的快捷鍵進(jìn)行排序。 (#129309)

之前之后MatrixTransition動(dòng)畫

一個(gè)新的 MatrixTransition 小部件允許在創(chuàng)建動(dòng)畫過(guò)渡時(shí)進(jìn)行變換。根據(jù)當(dāng)前的動(dòng)畫值，您可以提供一個(gè)矩陣變換，應(yīng)用于子小部件以創(chuàng)建像下面GIF中的效果一樣的效果。 (DartPad中的示例) (#131084)

在flutter_test中添加了PaintPattern

在flutter_test包中，新的 PaintPattern 類允許您驗(yàn)證由小部件（如CustomPainter和Decoration）在單元測(cè)試中向畫布發(fā)出的繪制調(diào)用。

以前，需要一個(gè)golden文件來(lái)驗(yàn)證正確的顏色和矩形是否被繪制，但現(xiàn)在您可以使用 PaintPattern。以下示例驗(yàn)證了 MyWidget 在畫布上繪制了一個(gè)圓：

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,),
);

此API以前存在于框架測(cè)試文件中，我們注意到一些開(kāi)發(fā)人員發(fā)現(xiàn)它非常有用，將其復(fù)制到了自己的項(xiàng)目中。如果這適用于您，升級(jí)到Flutter 3.16后，您可以從項(xiàng)目中刪除該復(fù)制。

滾動(dòng)更新

在Flutter 3.13首次發(fā)布了二維滾動(dòng)基礎(chǔ)之后，此版本帶來(lái)了更多功能和優(yōu)化。Flutter 3.16現(xiàn)在支持KeepAlive小部件，以及默認(rèn)焦點(diǎn)遍歷和隱式滾動(dòng)?；谠摶A(chǔ)構(gòu)建的二維滾動(dòng)小部件將自動(dòng)采用此支持。有關(guān)在二維基礎(chǔ)上構(gòu)建的詳細(xì)指南，請(qǐng)參見(jiàn)Flutter Build Show的最新一集。

在3.13版本發(fā)布后不久，two_dimensional_scrollables包發(fā)布了。這個(gè)包由Flutter團(tuán)隊(duì)維護(hù)，包含了構(gòu)建在框架基礎(chǔ)上的第一個(gè)二維滾動(dòng)小部件 — TableView。自初始發(fā)布以來(lái)，已添加了更多的裝飾和樣式支持，并進(jìn)行了額外的錯(cuò)誤修復(fù)。

引擎

Impeller

Android

在此版本中，我們很高興地宣布Impeller在Android上已經(jīng)準(zhǔn)備好在穩(wěn)定通道上進(jìn)行預(yù)覽反饋。從今年初以來(lái)，團(tuán)隊(duì)一直在為Impeller開(kāi)發(fā)Vulkan后端，此預(yù)覽版本包括收集關(guān)于Impeller在支持Vulkan的設(shè)備上的特性的反饋。

這張圖表展示了在Flutter Gallery過(guò)渡性能基準(zhǔn)測(cè)試中，Impeller的Vulkan后端在過(guò)去一年中在99%、90%和平均幀光柵化時(shí)間上的改進(jìn)，用戶將觀察到更少的卡頓和更高的穩(wěn)定幀率。在這段時(shí)間的末尾，我們從Samsung S10設(shè)備切換到Pixel 7 Pro設(shè)備，這導(dǎo)致數(shù)字大幅下降。盡管如此，我們發(fā)現(xiàn)趨勢(shì)和整體結(jié)果非常令人鼓舞。*Impeller尚未在不支持Vulkan的設(shè)備上表現(xiàn)良好。隨著我們?cè)谖磥?lái)幾個(gè)月將Impeller的OpenGL后端完善到功能完備，我們計(jì)劃在未來(lái)的穩(wěn)定版本中也收集關(guān)于在這些設(shè)備上的Impeller特性的反饋。

Flutter開(kāi)發(fā)者可以通過(guò)在flutter run命令中添加--enable-impeller標(biāo)志，或在項(xiàng)目的AndroidManifest.xml文件的``標(biāo)簽下添加以下設(shè)置，嘗試在支持Vulkan的Android設(shè)備上使用Impeller：

為了確定設(shè)備是否支持Vulkan，Impeller使用了在Impeller倉(cāng)庫(kù)文檔中討論的測(cè)試。通常，Impeller在運(yùn)行64位操作系統(tǒng)且Android API級(jí)別為29或更高的設(shè)備上使用Vulkan后端。用戶還可以通過(guò)按照檢查Vulkan支持中的建議來(lái)確定他們的設(shè)備是否支持Vulkan。

盡管我們對(duì)Impeller的Vulkan后端取得的進(jìn)展感到滿意，但在預(yù)覽期間存在一些已知問(wèn)題：

• 平臺(tái)視圖尚未實(shí)現(xiàn)，否則會(huì)執(zhí)行相對(duì)較差的包含平臺(tái)視圖的幀。
• 自定義著色器尚未實(shí)現(xiàn)。
• 完整的已知問(wèn)題和缺失功能列表，最新信息請(qǐng)參閱GitHub上Impeller的項(xiàng)目板。許多問(wèn)題已經(jīng)在3.17 beta中得到修復(fù)，所以請(qǐng)也嘗試一下。

我們對(duì)在支持Vulkan的Android設(shè)備上嘗試Impeller的忠實(shí)度、性能感到滿意。然而，與iOS相比，Android硬件生態(tài)系統(tǒng)更加多樣化，我們預(yù)計(jì)在iOS之前，在Android上會(huì)有一個(gè)較長(zhǎng)的預(yù)覽期。因此，有關(guān)Impeller最有幫助的反饋應(yīng)包括有關(guān)出現(xiàn)問(wèn)題的具體設(shè)備和Android版本的詳細(xì)信息。

此外，Impeller的Vulkan后端在“debug”構(gòu)建中提供了比Skia更多的調(diào)試功能，并且這些功能具有額外的運(yùn)行時(shí)開(kāi)銷。因此，關(guān)于Impeller性能的反饋必須來(lái)自于配置文件或發(fā)布構(gòu)建，并且應(yīng)包括來(lái)自DevTools的時(shí)間軸以及與同一設(shè)備上Skia后端的比較。最后，一如既往，我們非常感激包含一個(gè)小而可重現(xiàn)問(wèn)題的測(cè)試用例的反饋。

Impeller性能、忠實(shí)度和穩(wěn)定性

除了關(guān)注Vulkan后端之外，從今年初開(kāi)始，團(tuán)隊(duì)還對(duì)Impeller的文本性能進(jìn)行了一些改進(jìn)，這些改進(jìn)對(duì)Android和iOS都有益。特別是，我們對(duì)Impeller的字形圖集管理和文本工作負(fù)載在引擎的UI和光柵線程之間的分配方式進(jìn)行了改進(jìn)。因此，用戶將在文本重負(fù)載中注意到更少的卡頓。

*這張圖表顯示了在iPhone 11上使用Impeller進(jìn)行的我們的一個(gè)文本重負(fù)載基準(zhǔn)測(cè)試中，99%、90%和平均幀光柵化時(shí)間在毫秒上的減少，特別是90%和平均幀光柵化時(shí)間幾乎減半。*團(tuán)隊(duì)還在為Android和iOS的忠實(shí)度和穩(wěn)定性做出了努力，特別是用戶報(bào)告的問(wèn)題。在這個(gè)穩(wěn)定版本周期的三個(gè)月里，團(tuán)隊(duì)為flutter/engine repo做出了209個(gè)與Impeller相關(guān)的提交，關(guān)閉了217個(gè)問(wèn)題，其中包括42個(gè)用戶報(bào)告的忠實(shí)度、穩(wěn)定性或性能問(wèn)題。

引擎性能

為了在具有異構(gòu)多處理的移動(dòng)設(shè)備上實(shí)現(xiàn)更好的性能，我們修改了引擎，使對(duì)性能敏感的線程，如UI和光柵線程，與設(shè)備更強(qiáng)大的核心有關(guān)聯(lián)。我們觀察到這個(gè)改變?cè)诟鞣N基準(zhǔn)測(cè)試和設(shè)備上都產(chǎn)生了積極的影響。在某些情況下，改進(jìn)效果顯著，使99%或90%的幀時(shí)間減半或更好。我們預(yù)計(jì)用戶在這個(gè)改變后，無(wú)論是在Android上使用Skia還是Impeller后端，都將注意到更少的卡頓。在iOS設(shè)備上效果較小，更強(qiáng)大和較弱的核心之間的差異較小。

這張圖表顯示了在幾乎所有我們的Android基準(zhǔn)測(cè)試和設(shè)備上，最差、99%、90%和平均幀構(gòu)建和幀光柵化時(shí)間的改進(jìn)。

API和忠實(shí)度改進(jìn)

Impeller性能疊加

在先前的版本中，Flutter的性能疊加功能在Impeller上未顯示。此版本修復(fù)了這個(gè)問(wèn)題。性能疊加現(xiàn)在在啟用Impeller的情況下正確顯示。

抖動(dòng)現(xiàn)在正確顯示

在此版本中，Paint.enableDithering屬性被設(shè)置為true，并根據(jù)Flutter的棄用政策已被棄用?，F(xiàn)在，默認(rèn)啟用抖動(dòng)（不再支持開(kāi)發(fā)者配置的抖動(dòng)），您將不再看到帶狀問(wèn)題。有關(guān)此更改的完整說(shuō)明和遷移指南，請(qǐng)參閱docs.flutter.dev上的破壞性變更頁(yè)面。

之前之后游戲

游戲

Flutter Games Toolkit

在過(guò)去的幾年里，我們看到了圍繞休閑游戲開(kāi)發(fā)的不斷增長(zhǎng)的社區(qū)。已經(jīng)有數(shù)萬(wàn)款游戲使用Flutter發(fā)布，從簡(jiǎn)單但有趣的拼圖到更復(fù)雜的街機(jī)游戲。其中一些我們喜歡的游戲包括Etermax的Trivia Crack，Lotum的4 Pics 1 Word（猜詞游戲），Dong Digital的Brick Mania（街機(jī)游戲），Onrizon的StopotS（類別游戲），我們?yōu)镮/O構(gòu)建的復(fù)古彈球游戲以及在其社交和菜單屏幕中使用Flutter的PUBG手機(jī)。

為了幫助游戲開(kāi)發(fā)者更高效，Flutter今天推出了其休閑游戲工具包的重大更新。這是一系列新資源，幫助您從概念到發(fā)布，包括更多特定于流派的模板，如卡片游戲、無(wú)盡奔跑游戲，以及Play Games Services、應(yīng)用內(nèi)購(gòu)買、廣告、成就、Crashlytics和多人支持等服務(wù)集成。要了解更多信息，請(qǐng)查看由Zoey Fan發(fā)布的游戲工具包啟動(dòng)帖。

Web

在Chrome DevTools的Flutter時(shí)間軸事件

Flutter時(shí)間軸事件現(xiàn)在在Chrome DevTools的性能面板中公開(kāi)顯示。 (#130132)

要了解更多，請(qǐng)查看Web應(yīng)用程序性能調(diào)試。

Android

鼠標(biāo)滾輪支持

在優(yōu)化Wonderous以符合Android的大屏幕指南時(shí)，我們發(fā)現(xiàn)的一個(gè)問(wèn)題是在平板電腦或可折疊設(shè)備上，鼠標(biāo)滾輪的效果不佳。眾所周知的是，用戶必須移動(dòng)滾輪相當(dāng)多的距離才能使屏幕響應(yīng)。

通過(guò)此版本，在Flutter視圖上使用鼠標(biāo)滾輪滾動(dòng)的速度與Android設(shè)備上的滾動(dòng)速度匹配。 (44724)

之前之后預(yù)測(cè)性的后退導(dǎo)航

iOS

App extensions

Flutter現(xiàn)在可以用于定位一些iOS應(yīng)用擴(kuò)展。這意味著您可以使用Flutter小部件為某些類型的iOS應(yīng)用擴(kuò)展繪制UI。這并不適用于所有類型的應(yīng)用擴(kuò)展，因?yàn)榭赡艽嬖贏PI（例如主屏幕小部件）或內(nèi)存的限制。

了解更多并查看有關(guān)如何定位共享擴(kuò)展的示例，請(qǐng)?jiān)L問(wèn)docs.flutter.dev上的添加iOS應(yīng)用擴(kuò)展。

包生態(tài)系統(tǒng)

新的Flutter收藏夾

我們重新啟動(dòng)了Flutter收藏夾計(jì)劃！在此周期內(nèi)，Flutter生態(tài)系統(tǒng)委員會(huì)指定了flame、flutter_animate、flutter_rust_bridge、riverpod、video_player、macos_ui和fpdart等包為新的Flutter收藏夾。祝賀所有獲選者！

請(qǐng)期待將來(lái)的新的Flutter收藏夾。要提名包或插件作為潛在的未來(lái)Flutter收藏夾，或?qū)⑷魏纹渌麊?wèn)題帶到委員會(huì)的注意，請(qǐng)發(fā)送電子郵件至。

首次包生態(tài)系統(tǒng)虛擬峰會(huì)

在8月，我們舉辦了第一次虛擬峰會(huì)，參與者包括50多名pub.dev的非Google和Google貢獻(xiàn)者。目標(biāo)是在非正式的會(huì)議中將貢獻(xiàn)者聚集起來(lái)，計(jì)劃、教育、學(xué)習(xí)和分享。在后續(xù)調(diào)查中，對(duì)活動(dòng)的滿意度達(dá)到了100%。我們計(jì)劃與社區(qū)合作，在將來(lái)的包生態(tài)系統(tǒng)活動(dòng)（線下和線上）中推出類似的活動(dòng)。在即將發(fā)布的包生態(tài)系統(tǒng)更新博客文章中了解更多信息。

基于云的Google地圖樣式

Google Maps平臺(tái)提供了從Google Cloud控制臺(tái)的Map Styles頁(yè)面自定義地圖樣式的能力。這使您可以在每次進(jìn)行樣式更改時(shí)，無(wú)需更新應(yīng)用代碼，創(chuàng)建自定義體驗(yàn)。

要在Flutter中使用此功能，您只需使用控制臺(tái)中設(shè)置的Map ID引用您的地圖：

GoogleMap(onMapCreated: _onMapCreated,initialCameraPosition: const CameraPosition(target: _kMapCenter,zoom: 7.0,),key: _key,cloudMapId: _mapId
);

攝像頭 X 改進(jìn)

在3.10穩(wěn)定版本中，我們?yōu)镕lutter相機(jī)插件添加了對(duì)Camera X的初步支持。Camera X是一個(gè)Jetpack庫(kù)，簡(jiǎn)化了將豐富的相機(jī)功能添加到Android應(yīng)用程序的過(guò)程。

通過(guò)此發(fā)布，我們已添加了任何使用相機(jī)的應(yīng)用程序所需的大多數(shù)功能。CameraX解決了插件的Camera 2實(shí)現(xiàn)存在的許多問(wèn)題。

我們鼓勵(lì)您使用CameraX插件。要選擇加入，請(qǐng)?jiān)趐ubspec.yaml文件中添加以下行。

Dependencies: camera: ^0.10.4 # 或嘗試最新的相機(jī)版本 camera_android_camerax: ^0.5.0

我們期待著您的反饋，因?yàn)槲覀冇?jì)劃在將來(lái)的發(fā)布中將CameraX作為默認(rèn)實(shí)現(xiàn)。

macOS視頻播放器

我們已將視頻播放器插件添加到macOS支持，允許開(kāi)發(fā)人員在小部件表面上播放視頻。

要了解更多信息，請(qǐng)查看pub.dev上的視頻播放器插件。

DevTools

DevTools擴(kuò)展

新的DevTools擴(kuò)展框架使以下內(nèi)容成為可能：

• 包作者可以為其包構(gòu)建自定義工具，這些工具直接在DevTools中顯示。
• 包作者可以編寫利用DevTools中的現(xiàn)有框架和實(shí)用程序的強(qiáng)大工具。
• 在使用DevTools調(diào)試應(yīng)用程序的Dart和Flutter開(kāi)發(fā)人員可以訪問(wèn)特定于其用例的工具（由其應(yīng)用程序的依賴項(xiàng)確定，并提供DevTools擴(kuò)展的依賴項(xiàng)）。

感謝Provider、Drift和Patrol的包作者，這個(gè)生態(tài)系統(tǒng)已經(jīng)在建設(shè)中，您今天就可以使用這些包的DevTools擴(kuò)展！

Provider

Patrol

Drift深入了解DevTools擴(kuò)展，請(qǐng)查看Kenzie Davisson的Dart和Flutter DevTools擴(kuò)展公告。

DevTools更新

此發(fā)布的DevTools的一些亮點(diǎn)包括：

• 增加了對(duì)DevTools擴(kuò)展的支持
• 增加了一個(gè)新的“主頁(yè)”屏幕，顯示您連接的應(yīng)用程序的摘要。

其他改進(jìn)還包括：

• 總體性能
• 熱重新啟動(dòng)的健壯性
• 文本選擇和復(fù)制行為
• 網(wǎng)絡(luò)分析器響應(yīng)查看器的優(yōu)化

要了解更多信息，請(qǐng)查看DevTools的發(fā)布說(shuō)明2.26.1、2.27.0和2.28.1。

VS Code UI可發(fā)現(xiàn)性

由于Flutter社區(qū)成員DanTup的出色工作，Flutter VS Code擴(kuò)展現(xiàn)在具有Flutter側(cè)邊欄，可輕松訪問(wèn)：

• 打開(kāi)Flutter DevTools屏幕
• 查看活動(dòng)調(diào)試會(huì)話
• 查看可用設(shè)備
• 創(chuàng)建新項(xiàng)目
• 熱重載和重啟
• 運(yùn)行Flutter Doctor -v
• 等等

棄用和重大更改

棄用和重大更改

此版本中的重大更改包括在v3.13發(fā)布后過(guò)期的已棄用API。要查看所有受影響的API以及其他上下文和遷移指南，請(qǐng)參閱此版本的棄用指南。其中許多都受到Flutter修復(fù)的支持，包括IDE中的快速修復(fù)?？梢允褂?code>dart fix命令評(píng)估和應(yīng)用批量修復(fù)。

一如既往，感謝社區(qū)為貢獻(xiàn)測(cè)試 — 這有助于我們識(shí)別這些重大更改。要了解更多信息，請(qǐng)查看Flutter的重大更改政策。

在我們的下一個(gè)發(fā)布版本中，我們計(jì)劃將棄用策略擴(kuò)展到flutter_driver包，除了已支持的flutter和flutter_test包。

最后

要查看此版本中包含的所有PRs，請(qǐng)查看發(fā)布說(shuō)明和更改日志：https://docs.flutter.dev/release/release-notes。

Flutter 3.16已發(fā)布到穩(wěn)定通道上，并包括Dart 3.2。

小伙伴們?nèi)绻霌屜润w驗(yàn)Flutter 3.16的新特性，只需運(yùn)行flutter upgrade即可。

就讓我們?cè)贔lutter精彩課程中再見(jiàn)吧！

• ChatGPT + Flutter快速開(kāi)發(fā)多端聊天機(jī)器人App
• Flutter高級(jí)進(jìn)階實(shí)戰(zhàn) 仿嗶哩嗶哩APP
• Flutter從入門到進(jìn)階實(shí)戰(zhàn)攜程網(wǎng)App