一起看 I/O | Flutter 3 更新詳解

作者 / Kevin Jamaul Chisholm, Technical Program Manager for Dart and Flutter at Google

又到了 Flutter 穩定版發佈時間,我們無比自豪地宣佈推出 Flutter 3 !僅 3 個月前,我們宣佈了 Flutter 對 Windows 的支持。現在,我們再次懷着激動的心情宣佈,繼 Windows 之後,Flutter 現已穩定支持 macOS 和 Linux!

我們總計合併了 5,248 條 PR,感謝各位 Flutter 貢獻者的辛勤工作!

此版本中激動人心的升級包括: 更新了 Flutter 對 macOS 和 Linux 的支持,性能得到了顯著提升,針對移動設備和 web 端的更新,以及諸多其他功能!此外,我們還帶來了關於減少對舊版 Windows 提供支持的消息,以及幾條重大變更。下面讓我們直奔主題吧!

全桌面平臺生產就緒

Linux 和 macOS 平臺的支持已進入穩定狀態,內含下列功能:

級聯菜單和 macOS 系統菜單欄支持

現在您可以使用 PlatformMenuBar widget 在 macOS 上創建平臺渲染的菜單欄,支持插入僅限該平臺使用的菜單,並控制 macOS 應用菜單中的顯示內容。

完整支持全桌面平臺多國文本輸入

全部三種桌面平臺完整支持多國文本輸入,包括使用文本 輸入法編輯器 (IME) 的語言,如中文、日文和韓文。同時支持第三方輸入法,如搜狗 (Sogou)、谷歌日文輸入法 (Google Japanese Input) 等。

全桌面平臺無障礙服務

Flutter 支持 Windows、macOS 和 Linux 平臺的無障礙服務,包括屏幕文字閱讀、無障礙導航和顏色反轉等。

macOS 平臺默認使用通用二進制文件

在 Flutter 3 中,Flutter macOS 桌面應用會被構建爲通用二進制文件,從而原生支持使用 Intel 處理器的 Mac 電腦和搭載 Apple Silicon 的新設備。

不再支持使用 Windows 7/8 進行開發

此版本將建議的 Windows 開發版本提升爲 Windows 10。雖然我們不會禁止使用舊版本 (Windows 7、Windows 8、Windows 8.1) 進行開發,但由於 Microsoft 不再支持這些舊版本,我們僅會針對這些版本提供有限的測試。儘管我們會盡力爲舊版本提供支持,但還是建議您升級版本。

注意: 在 Windows 7 和 8 上依然可以運行 Flutter 應用,此更改隻影響我們推薦使用的開發環境。

移動端更新

我們針對移動端的更新包括:

支持可摺疊設備

Flutter 3 支持可摺疊移動設備。通過由 Microsoft 牽頭的合作,讓大家可以使用新的功能和 widget 在可摺疊設備上創建動感、愉悅的體驗。

作爲合作的一部分,MediaQuery 現在包含一個 DisplayFeature 列表,用以描述設備組件狀態,包括鉸鏈、摺疊狀態和屏幕劉海等。此外,DisplayFeatureSubScreen widget 包含的子 widget 的位置現在不會與 DisplayFeature 的邊界重疊,並且已經用於框架的默認對話框和彈出窗口,使 Flutter 默認即可動態適應這些元素的位置。

非常感謝 Microsoft 團隊。另外我們還要特別鳴謝 @andreidiaconu 所做出的貢獻!

歡迎大家嘗試 Surface Duo 模擬器示例,其中包含了 Flutter Gallery 的一個特別派生版本,以便了解 Flutter 在雙屏中的實際運行情況:

支持 iOS 可變刷新率

Flutter 現已在使用 ProMotion 顯示屏的 iOS 設備上支持可變刷新率,包括 iPhone 13 Pro 和 iPad Pro。在這些設備上 Flutter 應用的渲染刷新率可達 120 Hz,而之前最高爲 60 Hz,這使得滾動等快速動畫的觀感體驗更加流暢。請查看 官方文檔 瞭解詳情。

簡化 iOS 發佈

我們爲 flutter build ipa 命令添加了 新選項,使得 iOS 應用發佈更加簡便。在您準備好分發至 TestFlight 或 App Store 時,請運行 flutter build ipa 構建 Xcode 歸檔 (.xcarchive 文件) 和應用軟件包 (.ipa 文件)。您可選擇添加 --export-method ad-hoc、--export-method development 或 --export-method enterprise 選項。應用軟件包構建完成後,即可通過 Apple Transport macOS 應用 將其上傳至 Apple,或使用 xcrun altool 在命令行中完成上傳 (運行 man altool 獲取 App Store Connect API 密鑰驗證說明)。上傳完成後,您的應用即可發佈至 TestFlight 或 App Store。在完成應用顯示名稱、應用圖標等初始 Xcode 項目設置 後,您在發佈應用時就無需再打開 Xcode 了。

Gradle 版本更新

使用 Flutter 工具創建新項目時,您或許已經注意到,生成的文件現在使用了最新版本的 Gradle 和 Android Gradle 插件。對於現有的項目而言,您需要手動將 Gradle 版本升級至 7.4,Android Gradle 插件版本升級至 7.1.2。

停止更新 32 位 iOS/iOS 9/iOS 10

按照 2022 年 2 月 2.10 穩定版發佈的公告,Flutter 對 32 位 iOS 設備以及 iOS 9 和 10 的支持即將結束。這一變化會影響到 iPhone 4S、iPhone 5、iPhone 5C 以及 iPad 第二、三、四代設備。Flutter 3 是最後一個支持上述 iOS 版本和設備的穩定版本。

如需詳細瞭解此項變更,請參閱 RFC: 終止對 32 位 iOS 設備的支持

Web 端更新

我們針對 web 端的更新包括:

圖像解碼

在瀏覽器支持的情況下,Flutter web 現在可以自動檢測並使用 ImageDecoder API。到目前爲止,大多數基於 Chrome 的瀏覽器都添加了此 API,如 Chrome、Edge、Opera、Samsung Browser 等。

這個新 API 使用瀏覽器內置的圖像編解碼器在主線程之外異步解碼圖像。這使得圖像解碼速度提高 2 倍,而且完全不會阻塞主線程,消除了所有之前由圖像引起的卡頓現象。

Web 應用的生命週期

Flutter web 應用的新生命週期 API 提升了靈活性,可實現從託管 HTML 頁面控制 Flutter 應用的引導程序,並支持使用 Lighthouse 分析您的應用的性能表現。這適用於許多用例,包括以下常被開發者們提及的場景:

  • 啓動畫面。

  • 加載指示器。

  • 在 Flutter 應用之前顯示的純 HTML 交互式加載頁。

請閱讀官方文檔 "自定義 web 應用初始化" 瞭解詳細信息。

工具更新

我們針對 Flutter 和 Dart 工裝的更新內容包括:

Lint package 更新

Lint package 2.0 版現已發佈:

使用 flutter create 生成的 Flutter 3 應用將自動啓用 2.0 版 Lint 套件。我們建議大家運行 flutter pub upgrade --major-versions flutter_lints,將現有應用、package 和插件遷移到 2.0 版,以遵循 Flutter 最新、最優的最佳實踐。

Lint 2.0 版中新增的大多數警告都帶有自動修復功能。因此,當您在應用的 pubspec.yaml 中升級至最新 package 版本後,即可在代碼庫中運行 dart fix --apply 自動修復大多數 Lint 警告 (某些警告仍需部分手動操作)。對於尚未使用 package:flutter_lints 的應用、package 或插件,建議開發者按照 遷移指南 遷移至最新版本。

性能提升

感謝開源貢獻者 knopp,局部重繪已經在支持此功能的 Android 設備上實現。在我們的本地測試中,此功能在 Pixel 4XL 設備上將依照 backdrop_filter_perf 基準測試的幀柵格化時間的平均值、90 百分位值和 99 百分位值縮減了 5 倍。現在,iOS 設備和較新版本的 Android 設備上都已實現在單一矩形髒區出現時進行局部重繪。

我們 進一步提升 了簡單用例中不透明度動畫的性能。具體而言,當 Opacity widget 只包含單個渲染原語時,通常由 Opacity widget 調用的 saveLayer 方法可以省略。在爲此優化構建的基準測試中,此用例下的柵格化時間提升了 一個數量級。在今後的版本中,我們計劃爲更多場景應用此優化。

在開源貢獻者 JsouLiang 的努力下,引擎的光柵和界面線程在 Android 和 iOS 上的運行優先級已經高於其他線程 (比如 Dart VM 的後臺垃圾回收線程)。在我們的基準測試中,這使得幀構建平均時間提速 約 20%

在第 3 版發佈之前,光柵緩存的准入策略只查看圖片中繪製算子的數量 (假設任何具有多個算子的圖片都應該進入緩存)。但這會導致引擎消耗內存來緩存渲染速度極快的圖片。此版本 引入新的機制,根據所包含繪製算子的成本來估計圖像渲染的複雜性。在我們的性能測試中,使用新機制作爲柵格緩存准入策略可以 減少內存用量,而不會降低性能。

感謝開源貢獻者 ColdPaleLight,他修復了 iOS 上由於 幀調度 bug 而導致少量動畫幀丟失的問題。感謝所有報告此問題並提供掉幀復現視頻的每一個人。

Impeller

我們一直致力於解決 iOS 和其他平臺上的早期卡頓問題。在 Flutter 3 中,您可以在 iOS 上預覽一個名爲 Impeller 的實驗性渲染後端。Impeller 會在引擎構建時預編譯一組 較爲小巧、簡單的着色器,從而避免在應用運行時編譯,而後者是造成 Flutter 卡頓的主要原因。Impeller 尚未作好投產準備,距離完成也還有一段距離。目前 Impeller 尚未實現 Flutter 的所有功能特性,但我們對它在 flutter/gallery 應用中實現的保真度和性能感到滿意,並且很高興地在這裏和大家分享開發進度。特別是,在 Gallery 應用的過場動畫中,即便最差的幀速度也比之前快大約 20 倍

Impeller 可以帶標記在 iOS 上使用。如果您要試用 Impeller,可以傳遞 --enable-impeller 標記至 flutter run,或將 Info.plist 文件中的 FLTEnableImpeller 標記爲 true。Impeller 的開發會繼續在 Flutter 主渠道進行,我們希望在未來的版本中提供進一步更新。

Android 上的內聯廣

使用 google_mobile_ads package 時,您應該可以感受到用戶關鍵交互 (如頁面之間的滾動和切換) 的性能有所提升。在新興市場廣爲流行的設備上,這種性能提升尤其明顯。最棒的是,您無需更改任何代碼!

在具體實現方面,Flutter 現在是異步組合 Android 視圖 (即通常所說的 平臺視圖)。這意味着 Flutter 的光柵線程無需等待 Android 視圖渲染。現在,Flutter 引擎使用它管理的 OpenGL 紋理將視圖顯示在屏幕上。

更多令人興奮的更新

我們針對 Flutter 生態系統的其他更新包括:

Material 3

Flutter 3 支持新一代 Material Design,即 Material Design 3。Flutter 3 提供 Material 3 的可選支持,包括動態顏色、最新顏色系統和字體等 Material You 功能,還包含許多組件的更新,以及在 Android 12 中引入的新觸摸波紋設計和拉伸滾動等全新視覺效果。我們歡迎大家通過全新的 "將枯燥無味的 Flutter 應用變得生動有趣" 的 Codelab 來嘗試 Material 3 的功能特性。請參閱 API 文檔,詳細瞭解如何選用上述新功能特性,以及哪些組件支持 Material 3。另請關注 Material 3 Umbrella issue 瞭解最新開發進展。

主題擴展

藉助 "主題擴展 (Theme extension)",Flutter 現支持向 Material 庫中的 ThemeData 添加任何內容。您現在可以指定 ThemeData.extensions,而無需 (在 Dart 中) 擴展 ThemeData 並重新實現其 copyWithlerp 和其他方法。另外,package 開發者也可以提供 ThemeExtension。請參閱 官方文檔 瞭解詳情,並查看 GitHub 上的 相關示例

廣告

我們知道對於發佈商來說,徵求用戶同意對個性化廣告,以及應對 Apple 的 "應用追蹤透明度 (App Tracking Transparency, ATT)" 要求非常重要。

爲了支持這些需求,Google 提供了 "用戶消息平臺 (User Messaging Platform, UMP)" SDK,取代了之前的開源 Consent SDK。在即將發佈的 Google 移動廣告 SDK (Flutter) 中,我們會增加對 UMP (用戶消息平臺) SDK 的支持,讓發佈商能夠徵求用戶同意。如需瞭解詳情,請在 pub.dev 上查看 google_mobile_ads package 頁面。

重大變更

在持續擴展和改進 Flutter 的過程中,我們會盡量把重大變更的數量維持在最低限度。Flutter 3 包含以下重大變更:

如果您正在使用上述 API,請參閱 Flutter.dev 上的 遷移指南

總結

按照 Statista 和 SlashData 等分析機構的統計,Flutter 依然是最受歡迎的跨平臺界面工具包,我們能保持這種地位,社區的貢獻功不可沒,對此,Google Flutter 團隊向大家致以由衷敬意。期待與各位社區成員共同努力,繼續提供由社區驅動的工具,幫助大家爲用戶創造出更多令人愉悅的體驗!

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章