close

作者 / 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 應用菜單中的顯示內容。

△ 級聯菜單示意完整支持全桌面平台多國文本輸入

全部三種桌面平台完整支持多國文本輸入,包括使用文本 輸入法編輯器[1] (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 不再支持這些舊版本[2],我們僅會針對這些版本提供有限的測試。儘管我們會盡力為舊版本提供支持,但還是建議您升級版本。

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

移動端更新

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

支持可摺疊設備

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

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

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

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

支持 iOS 可變刷新率

Flutter 現已在使用 ProMotion 顯示屏的 iOS 設備上支持可變刷新率,包括 iPhone 13 Pro 和 iPad Pro。在這些設備上 Flutter 應用的渲染刷新率可達 120 Hz,而之前最高為 60 Hz,這使得滾動等快速動畫的觀感體驗更加流暢。請查看 [官方文檔](https://docs.google.com/document/d/1O-ot6MydAl5pAr_XGnpR-Qq5A5CPDF6edaPu8xQtgCQ/edit?resourcekey=0-LlXeGtGRC67XL4NrGoc91A "在Flutter (iOS "官方文檔")中增加了對可變刷新率顯示的支持") 了解詳情。

簡化 iOS 發布

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

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 應用初始化[13]" 了解詳細信息。

工具更新

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

Lint package 更新

Lint package 2.0 版現已發布:

Flutter[14]
Dart[15]

使用 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 或插件,建議開發者按照 遷移指南[16] 遷移至最新版本。

性能提升

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

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

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

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

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

Impeller

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

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

Android 上的內聯廣 告

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

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

更多令人興奮的更新

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

Material 3

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

主題擴展

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

廣告

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

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

重大變更

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

2.10 版之後移除已棄用的 API[41]
頁面切換轉為使用 ZoomPageTransitionsBuilder[42]
Chips 的 useDeleteButtonTooltip 遷移至 deleteButtonTooltipMessage[43]

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

總結

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

文內鏈接
[1]

輸入法編輯器: https://baike.baidu.com/item/%E8%BE%93%E5%85%A5%E6%B3%95%E7%BC%96%E8%BE%91%E5%99%A8/8970940

[2]

Windows 生命周期常見問題解答: https://docs.microsoft.com/en-us/lifecycle/faq/windows

[3]

MediaQuery API 文檔: https://api.flutter-io.cn/flutter/widgets/MediaQuery-class.html

[4]

DisplayFeature API 文檔: https://api.flutter-io.cn/flutter/dart-ui/DisplayFeature-class.html

[5]

DisplayFeatureSubScreen API 文檔: https://api.flutter-io.cn/flutter/widgets/DisplayFeatureSubScreen-class.html

[6]

@andreidiaconu Github 主頁: https://github.com/andreidiaconu

[7]

Surface Duo 模擬器示例: https://docs.microsoft.com/en-us/dual-screen/flutter/samples

[8]

使用 flutter build spa 發布 IPA,無需使用 --export-options-plist: https://github.com/flutter/flutter/pull/97672

[9]

Apple Transport macOS 應用: https://apps.apple.com/us/app/transporter/id1450874784

[10]

在 App Store 發布您的應用: https://flutter.cn/docs/deployment/ios#release-your-app-to-the-app-store

[11]

檢查 Xcode 項目設置: https://flutter-io.cn/docs/deployment/ios#review-xcode-project-settings

[12]

RFC: 終止對 32 位 iOS 設備的支持: https://docs.google.com/document/d/1cc5EOsuTlbf4dTDTwmkD3aKjS8XEbVCIqi9BFct9XHM/edit?resourcekey=0-Iv0gXDx7nSDCe3YDfxDKqw

[13]

自定義 web 應用初始化: https://flutter-io.cn/docs/development/platform-integration/web/initialization

[14]

Flutter Lint 2.0.0 package: https://pub.flutter-io.cn/packages/flutter_lints/versions/2.0.0

[15]

Dart Lint 2.0.0 package: https://pub.flutter-io.cn/packages/lints/versions/2.0.0

[16]

Flutter Lint 遷移指南: https://flutter-io.cn/docs/release/breaking-changes/flutter-lints-package#migration-guide

[17]

knopp 的 Github 主頁: https://github.com/knopp

[18]

Android 設備上實現的 PR: https://github.com/flutter/engine/pull/29591

[19]

Flutter 引擎性能進一步提升 PR: https://github.com/flutter/engine/pull/30957

[20]

一個數量級: https://flutter-flutter-perf.skia.org/e/?begin=1643063115&end=1644004520&keys=X32827d8819e8271e025f50e77bf2bec0&requestType=0&xbaroffset=27447

[21]

JsouLiang 的 Github 主頁: https://github.com/JsouLiang

[22]

提升幀構建速度的基準測試結果: https://flutter-flutter-perf.skia.org/e/?begin=1644581114&end=1644647407&keys=X3999dc0a0c89054eaa9f66bcff27d882&num_commits=50&request_type=1&xbaroffset=27549

[23]

實現新光柵緩存機制的 PR: https://github.com/flutter/engine/pull/31417

[24]

減少內存用量的測試結果: https://flutter-flutter-perf.skia.org/e/?begin=1644790212&end=1646044276&keys=X4c7dd4e4903a38523816c00b31d4d787&requestType=0&xbaroffset=27636

[25]

ColdPaleLight 的 Github 主頁: https://github.com/ColdPaleLight

[26]

修復幀調度 bug 的 PR: https://github.com/flutter/engine/pull/31513

[27]

Impeller 一個Flutter 引擎新增的實驗性渲染後端: https://github.com/flutter/engine/tree/main/impeller

[28]

較為小巧、簡單的着色器實現 PR: https://github.com/flutter/flutter/issues/77412

[29]

flutter/gallery 源碼: https://github.com/flutter/gallery

[30]

幀速度提升 20 倍的測試結果: https://flutter-flutter-perf.skia.org/e/?begin=1650297849&end=1651261748&queries=sub_result%3Dworst_frame_rasterizer_time_millis%26test%3Dnew_gallery_impeller_ios__transition_perf%26test%3Dnew_gallery_ios__transition_perf&requestType=0

[31]

google_mobile_ads package: https://pub.flutter-io.cn/packages/google_mobile_ads

[32]

在 Flutter 應用中使用集成平台視圖託管您的原生 Android 和 iOS 視圖: https://flutter-io.cn/docs/development/platform-integration/platform-views

[33]

Material Design 3 文檔: https://m3.material.io/

[34]

將枯燥無味的 Flutter 應用變得生動有趣 Codelab: https://codelabs.developers.google.com/codelabs/flutter-boring-to-beautiful

[35]

Material 3 大的 API 文檔: https://api.flutter-io.cn/flutter/material/ThemeData/useMaterial3.html

[36]

Material 3 Umbrella issue: https://github.com/flutter/flutter/issues/91605

[37]

ThemeExtension 的官方文檔: https://docs.google.com/document/d/1LbD4JqBgAfHex02oR3r2jyu9lTBBNBmyec2ovT59Kr8/edit

[38]

ThemeExtension 相關示例: https://github.com/guidezpl/flutter/blob/master/examples/api/lib/material/theme/theme_extension.1.dart

[39]

Consent SDK: https://github.com/googleads/googleads-consent-sdk-ios

[40]

google_mobile_ads package: https://pub.flutter-io.cn/packages/google_mobile_ads

[41]

2.10 版之後移除已棄用的 API: https://flutter-io.cn/docs/release/breaking-changes/2-10-deprecations

[42]

頁面切換轉為使用 ZoomPageTransitionsBuilder: https://flutter-io.cn/docs/release/breaking-changes/page-transition-replaced-by-ZoomPageTransitionBuilder

[43]

Chips 的 useDeleteButtonTooltip 遷移至 deleteButtonTooltipMessage: https://flutter-io.cn/docs/release/breaking-changes/chip-usedeletebuttontooltip-migration

[44]

FLutter 3 的破壞性改動: https://flutter-io.cn/docs/release/breaking-changes

arrow
arrow
    全站熱搜
    創作者介紹
    創作者 鑽石舞台 的頭像
    鑽石舞台

    鑽石舞台

    鑽石舞台 發表在 痞客邦 留言(0) 人氣()