RainVisitor Blog

RainVisitor

0%

【文章翻譯】What’s new in Flutter 3.27

Posted on Edited on In

【文章內容使用 Gemini 1.5 Pro 自動翻譯產生】

使用 Impeller、Cupertino 更新等提升應用程式開發

簡介

讓我們深入了解 Flutter 3.27！此版本充滿了增強功能和特性，著重於改進您的開發體驗並提升應用程式的效能。

我們在架構、引擎和生態系統方面都進行了更新，包括 Impeller 的進展和 Cupertino widget 的改進。此外，我們還在 DevTools 中引入了令人興奮的新功能，讓管理 Flutter 專案比以往任何時候都更容易。Flutter 3.27 包含來自 187 位貢獻者（包括 49 位首次貢獻者！）的超過 1,400 個提交，證明了 Flutter 社群令人難以置信的活力和合作。讓我們一起探索新功能吧！

架構

Cupertino 更新

此版本包含對 CupertinoCheckbox 和 CupertinoRadio 的高保真度更新，其中包括對大小、顏色、筆劃寬度和按下時的行為的更新。CupertinoRadio、CupertinoCheckbox 和 CupertinoSwitch 也進行了大量的可自訂性更新，加入了滑鼠游標、語義標籤、縮圖和填充顏色等屬性。某些屬性（例如 CupertinoCheckbox 的非活動顏色）已被棄用，而其他屬性（例如 CupertinoSwitch 的軌跡顏色）則已重新命名。這些變更使這些 widget 與其 Material 對應項的功能齊平。

CupertinoSlidingSegmentedControl 的拇指半徑、分隔線高度、填充、陰影和拇指縮放對齊方式也進行了一些保真度更新。它現在還支援停用個別區段，以及根據區段內容進行比例佈局。

感謝社群成員 @veloce 的出色貢獻，CupertinoNavigationBar 和 CupertinoSliverNavigationBar 的背景現在是透明的，直到內容在其下方捲動。

這使得 sliver 導航欄在其展開狀態下可以擁有與其背景相同的顏色，但在其摺疊狀態下可以擁有不同的可自訂顏色（並且能夠在捲動時在這兩種顏色之間進行插值）。

感謝社群成員 @kerberjg 的出色貢獻，您現在可以使用 CupertinoButton 中新的 sizeStyle 屬性，透過新的 CupertinoButtonSize 列舉來應用 iOS 15+ 按鈕樣式。使用新的 CupertinoButton.tinted 建構函式來製作具有半透明背景的按鈕。

CupertinoButton 還有一個新的 onLongPress 處理程式，並且允許透過鍵盤快捷鍵執行操作。

CupertinoPicker 和 CupertinoDatePicker 現在將捲動到點擊的項目。

CupertinoAlertDialog 現在支援點擊滑動手勢。

CupertinoActionSheet 進行了一些高保真度更新，包括在所有系統文字大小設定中調整填充和字體大小，以及在滑過按鈕時支援觸覺回饋。

其他變更包括：CupertinoContextMenu 現在支援捲動（如果其動作超出螢幕範圍），CupertinoDatePicker 不再裁剪其欄中的長內容，以及 CupertinoMagnifier 透過提供放大比例來支援縮放效果。

標準化 Material 主題

在此版本中，CardTheme、DialogTheme 和 TabBarTheme 已經過重構，以使其符合 Flutter 的元件主題規範。加入了 CardThemeData、DialogThemeData 和 TabBarThemeData 來定義元件視覺屬性預設值的覆蓋。未來的版本將繼續標準化像這樣的元件主題，以便在 Material 函式庫中提供更一致的主題體驗。

CarouselView 的更多功能

此版本引入了 CarouselView.weighted，可以在 Carousel 中啟用更動態的佈局。透過調整建構函式中的 flexWeights 參數，您可以實現各種項目佈局。例如，[3, 2, 1] 建立 多瀏覽 佈局，[7, 1] 建立 英雄 佈局，而 [1, 7, 1] 建立 居中英雄 佈局。這些值表示每個項目在 Carousel 視圖中佔據的相對權重，並且可以自訂以滿足使用者的特定需求。

Material 中的更多內容

此版本包含許多小的功能增強和錯誤修復。一些增強功能範例：

  • SegmentedButton 現在有一個 direction 屬性，因此項目可以垂直對齊。
  • ButtonStyleButton 類別（ElevatedButton、FilledButton、OutlinedButton、TextButton、MenuItemButton 和 SubmenuButton）的 styleFrom 方法中加入了更多與圖示相關的屬性，以允許更多自訂。

一些錯誤修復範例：

  • ButtonStyleButton 類別的圖示大小和顏色預設值與 Material 3 規範一致。
  • AppBar 的捲動下行為現在可以在導航抽屜打開時正確保留，與原生 Android 體驗相符。
  • MenuAnchor 透過焦點修復得到了進一步改進，並且解決了幾個 DropdownMenu 問題，包括巢狀捲動元件中的捲動問題和過濾機制行為。

混合路由轉場

當先前的路由和新的路由具有不同的頁面轉場時，ModalRoutes 現在更加靈活。當新的路由進入螢幕時，有時它們需要先前的現有路由播放特定轉場以與新路由的進入轉場同步。現在，ModalRoutes 可以互相提供退出轉場建構函式，以便進入和退出轉場始終同步。這允許頁面使用 Flutter 的 Navigator 和 Router 在一個頁面上具有多個路由轉場選項。

文字選取改進

Flutter 的 SelectionArea 現在支援在 Linux、macOS 和 Windows 上使用 Shift + 點擊手勢將選取範圍的末尾移動到點擊位置。

您現在還可以透過 SelectableRegionState 上的 clearSelection 方法清除 SelectionArea 和 SelectableRegion 下的選取範圍。現在還可以透過提供 GlobalKey 並存取其 SelectionAreaState.selectableRegion 來透過 SelectionArea 存取 SelectableRegionState。

我們還解決了 RenderParagraph 的一些問題，因此在調整 視窗大小 後，以及在點擊或 點擊實際文字 [之外] 時，在 SelectionArea 或 SelectableRegion 下選取文字仍然可以按預期工作。

Row 和 Column 間距

此版本還提供了一個使用 Row 和 Column 的新便利方法：spacing！此雙精度參數將應用固定數量的像素來偏移 Row 和 Column 的子項之間的距離，從而減少先前執行此操作所需的程式碼量。

引擎

Android 上的 Impeller

我們很高興地宣布，Impeller 現在是現代 Android 設備上的預設渲染引擎。雖然自 Flutter 3.16 穩定版本於 2023 年 11 月發佈以來，這些設備上的 Impeller 一直處於預覽階段，但從那時起，我們根據使用者回饋對效能和保真度都進行了重大改進。

在較舊的 Android 設備和不支援 Vulkan 的設備上，仍然會像以前一樣使用 Skia 渲染引擎。雖然我們相信 Impeller 的效能和保真度都非常高，但使用者可以選擇退出並返回到傳統的 Skia 渲染器，方法是將 --no-enable-impeller 傳遞給 flutter 命令列工具，或者將以下內容放入您的 AndroidManifest.xml 檔案中：

1
2
3
<meta-data
  android:name="io.flutter.embedding.android.EnableImpeller"
  android:value="false" />

接下來，我們將繼續改進 Impeller 在 Android 上的效能和保真度。此外，我們打算讓 Impeller 的 OpenGL 後端做好生產準備，以移除 Skia 後備。

如同在預覽期間一樣，我們請求 Flutter 開發人員升級到最新的穩定版本，並提交在啟用 Impeller 時發現的任何缺點的錯誤。回饋對於確保 Impeller 在 Android 上取得成功仍然至關重要。Android 硬體生態系統比 iOS 生態系統更加多元。因此，關於 Impeller 最有用的回饋應包括有關發生問題的特定設備和 Android 版本的詳細資訊。

iOS 設備的改進

在以前的 Flutter 版本中，使用者可能會遇到 一個問題，即 iOS 設備上的應用程式在合成器反壓下每幀等待幾毫秒。這種反壓將被視為柵格工作負載開始時的延遲。在許多情況下，這種延遲會導致畫面丟失和卡頓。這種效應在具有較小畫面時間預算的高畫面播放速率設備上尤為明顯。

在此版本中，開源貢獻者 @knopp 加入了一個 新的實作 Metal 渲染表面，允許柵格工作負載在 UI 工作負載完成後更一致地開始。這意味著使用者將觀察到整體畫面時間更加穩定，因為在 iOS 系統合成器上的等待時間更少。特別是，Flutter 現在將在高畫面播放速率設備上更一致地達到 120Hz。在我們的基準測試中，我們觀察到在許多情況下平均畫面柵格化時間都大幅減少了。

此圖表顯示在 iPhone 11 設備上運行的許多不同基準測試中，平均畫面柵格化時間（以毫秒為單位）全面下降。

架構廣色域顏色

Flutter 現在支援使用 DisplayP3 色彩空間中的顏色來定義 UI，以充分利用 iOS 設備上的顯示器。它還具有更寬的位元深度，以支援 sRGB 和 DisplayP3 色彩空間中的更多顏色。此變更導致一些 Color 方法被棄用；更多資訊可以在 重大變更通知 中找到。

Web

Web 改進

此版本為 Flutter Web 帶來各種改進，著重於效能、效率和輔助功能：

  • 現在，Safari 和 Firefox 中的圖像解碼使用 <img> 元素完成，而不是對所有靜態圖像使用 WebAssembly 編解碼器。這消除了與圖像解碼相關的卡頓，並減少了 WASM 記憶體使用量。
  • 平台視圖經過優化，以減少畫布覆蓋層的數量，從而提高渲染效率。
  • Flutter 團隊開發的所有插件和套件現在都與 WebAssembly 相容。
  • 對標題、對話框、密碼、iOS 鍵盤、連結和捲動元件實作了多項輔助功能修復。
  • 在 CanvasKit 和 Skwasm 渲染器中修復了許多渲染錯誤，包括圖像濾鏡、裁剪和 Paint 物件的記憶體使用量。
  • 改進了多視圖模式下的拖動捲動。

iOS

Swift Package Manager

Flutter 正在遷移到 Swift Package Manager。這帶來了許多好處：

  1. 存取 Swift 套件生態系統。Flutter 插件將能夠利用不斷發展的 Swift 套件 生態系統！
  2. 簡化 Flutter 安裝。Swift Package Manager 與 Xcode 捆綁在一起。未來，您將不再需要安裝 Ruby 和 CocoaPods 來為 Apple 平台使用 Flutter。

以前，Swift Package Manager 支援僅在 Flutter 的「main」頻道上可用。我們很高興地宣布，Swift Package Manager 功能現在也在「beta」和「stable」頻道上可用！目前，Swift Package Manager 功能預設為關閉，因為我們正在解決一些問題。

鼓勵插件作者將 Swift Package Manager 支援加入到您的插件中。許多流行的插件——包括 Firebase、plus 插件 和 更多——已經遷移到 Swift Package Manager！

Pub.dev 現在會檢查插件的 Swift Package Manager 相容性。未來，不相容的套件將不會獲得完整的套件評分。

如果您對 Flutter 對 Swift Package Manager 的支援有任何回饋，請 提交問題。

Android

邊緣到邊緣

在運行 Android 15+ 的設備上，您的應用程式預設將使用邊緣到邊緣模式並以全螢幕運行！有關此變更以及如何選擇退出此行為的詳細資訊，請參閱指南。

支援 Freeform

Android Freeform 允許使用者調整應用程式視窗的大小，並且一直作為開發人員選項提供。Flutter 的 SafeArea 和 MediaQuery 已更新，以便在 freeform 視窗移動到硬體缺口時處理硬體缺口。

Kotlin 建置腳本支援和宣告式插件遷移

開發人員現在可以使用 build.gradle.kts 檔案。Flutter 工具現在支援 Kotlin 建置檔案。如果您遇到我們不支援 Kotlin 的地方，請提交錯誤。Groovy 仍然是支援的 Gradle 語言。

Flutter 3.27 是最後一個支援 Gradle 的傳統 apply 腳本方法 的版本。請參閱遷移文件。

注意：大多數應用程式需要手動遷移。新建立的應用程式將 使用 kotlin 建置檔案。

遷移到 Flutter Gradle 插件的宣告式包含有助於 Flutter 遷移到 Kotlin 建置檔案，從而提高類型安全性，並更容易維護建置程式碼的單元測試。這也是在 Android 工具版本之間帶來更多穩定性的一項更廣泛工作的一部分。

生態系統

Flutter 和 Dart 套件生態系統峰會美國 2024

作為 2024 年 9 月 Fluttercon USA 的一部分，我們舉辦了 Flutter 和 Dart 套件生態系統峰會。這是我們的第二次現場峰會，繼 2024 年 7 月 Fluttercon Europe 的峰會和我們於 2023 年 8 月舉辦的第一屆虛擬峰會之後。請參閱此處的討論會重點摘要 連結。

峰會匯集了套件作者和維護者，進行了以下主題的非會議式會議：

  • 會議 1 - 加入對 Swift Package Manager 的支援
  • 會議 2 - 原生互操作的過去、現在和未來
  • 會議 3 - 可持續的套件維護模型

我們期待與社群合作，在未來舉辦更多此類峰會。

pub.dev 上的套件下載次數

我們在 pub.dev 上推出了下載次數指標！

在 pub.dev 上提供更精確的受歡迎程度指標一直是該網站問題追蹤器中 請求最多的 功能。

現在，當您查看套件頁面時，您將看到一個 30 天下載次數，取代了以前的「受歡迎程度分數」。

此外，我們還加入了一個互動式折線圖，顯示隨著時間推移的每週下載活動。此圖表可幫助開發人員和套件作者發現套件使用趨勢。例如，它可能表明新版本導致使用量激增，或者套件正在變得越來越流行或越來越不受歡迎。

每次從 pub.dev 下載套件時都會註冊下載次數。例如，當您運行 flutter pub get 且套件尚未在您的 pub 快取中時。

顯示的下載次數是原始下載次數，反映了來自 CI 系統、套件分析、人工 pub 用戶端使用者等的使用情況。

Pub 工作區

我們將在 Dart 3.6 中推出 Pub 工作區，以支援在一個 monorepo 中開發多個相關套件。

透過定義引用儲存庫中其他套件的根 pubspec，在儲存庫中的任何位置運行 pub get 將會為所有套件產生共用解析。這可確保所有套件都使用一組一致的相依開發。

分析器也會選取共用解析，現在分析器只需追蹤整個工作區的單個分析上下文，從而可能在 IDE 中打開整個儲存庫時顯著減少記憶體使用量。

從 GitHub 自動發佈 Flutter 套件

我們擴展了 setup-dart 發佈 Github Actions 工作流程，還允許將 Flutter 套件 自動發佈 到 pub.dev，從而更容易以可驗證的方式為 Pub 生態系統做出貢獻。

推出互動式媒體廣告插件

我們推出了 互動式媒體廣告 (IMA) Flutter 插件，可以輕鬆地將多媒體廣告整合到使用 Flutter 建置的 iOS 和 Android 應用程式中。IMA 插件可以從任何符合 VAST 標準的廣告伺服器請求廣告，並在您的應用程式中管理廣告播放。廣告在位於應用程式內容影片播放器頂部的單獨影片播放器中播放。目前支援的功能包括：

  • 線性串流影片廣告請求的用戶端 API
  • VAST 和 VMAP
  • 單個和 Podded 請求
  • 可跳過廣告

應用程式內購買 iOS 和 macOS 插件更新

我們已將 StoreKit 2 支援加入到 in_app_purchase_storekit 套件中，以從 iOS 18 中棄用的 StoreKit 1 API 遷移。這使我們能夠在未來加入新的 StoreKit 2 功能，例如更好的訂閱管理。敬請期待即將推出的遷移指南，以説明您轉換到新的 StoreKit 2 功能。這是一個非重大變更，因此您可以隨時遷移。

DevTools 和 IDE

Flutter DevTools 更新

此版本包含新功能、整體穩健性和完善性改進，以及一些令人興奮的新的實驗性功能，您可以從 DevTools 中啟用這些功能。有關這些功能的更多資訊，請參閱下面的「預覽和實驗性功能」部分。

首先，我們在 Flutter Deep Links 工具中加入了對驗證 iOS 深度連結設定的支援。您現在可以驗證 Android 和 iOS 的深度連結。

DevTools Deep Links 工具中的 iOS 深度連結驗證。

接下來，我們對使用「離線」資料的工作流程進行了一些改進。有時需要將您在 DevTools 中查看的資料匯出以供將來使用或載入到其他工具中。此版本加入了將網路資料匯出為 .har 檔案的支援，以及將記憶體快照載入到 DevTools 中以便在 DevTools 未連線到正在運行的應用程式時查看的支援。

此外，如果您曾經在使用 DevTools 除錯記憶體問題時因為應用程式崩潰（可能是由於您正在嘗試除錯的 OOM 問題）而丟失了記憶體工具資料，我們感同身受！我們已透過允許您即使在應用程式斷開連線後仍然可以在 DevTools 中繼續查看最新的記憶體工具資料來修復此使用者體驗痛點。

這些只是此版本中的一些重點。若要進一步了解 Flutter 3.27 中包含的所有更新，請查看 DevTools 的發行說明 2.38.0、2.39.0 和 2.40.1。

預覽和實驗性功能

Flutter DevTools - 新的 Flutter Inspector

Flutter Inspector 已經過一些重大變更，以提高可用性並增強您的 UI 除錯體驗。透過切換「新的 Inspector」設定來啟用新的 Inspector。

DevTools 中的新 Flutter Inspector。

一些變更包括：

  • 簡潔的 Widget 樹，可以更輕鬆地查看深度巢狀的 Flutter widget 樹。當從 IDE 中使用 Flutter Inspector 時，這尤其有用，因為水平螢幕空間有限。
  • 一個選項，用於切換是否應在 widget 樹中包含實作 widget。實作 widget 是您未在應用程式程式碼中包含的 widget，而是由 Flutter 架構或其他套件加入到 widget 樹中的。
  • 選定 widget 的詳細資訊視圖，顯示內聯佈局查看器、widget 和渲染物件屬性，以及 Flex widget 及其子項的 Flex 佈局資源管理器。

新的 Inspector 很快就會有更多改進，但這些變更已經可以試用了！請提交您遇到的任何 問題，以便我們在預設啟用新的 Inspector 之前修復它們。

Flutter DevTools - 使用 WebAssembly 進行嘗試

在 DevTools 設定中啟用 WebAssembly 功能，以載入 WASM 編譯的 DevTools Web 應用程式。

這應該比預設的 JS 編譯版本的 DevTools 產生更好的效能。此功能是實驗性的，因此請提交您在 WASM 建置中遇到的任何 問題。

DevTools 設定，用於使用 WebAssembly 建置而不是 Javascript 建置。

重大變更和棄用

Material Design 3 標記

最新的 Material Design 3 標記 (v6.1) 已應用於 Flutter Material 函式庫。Material Design 標記更新了僅在亮模式下 4 種顏色角色的映射，以在保持可存取對比度的同時更具視覺吸引力。我們在測試此變更時沒有發現任何損壞，此變更應用於以下顏色屬性：

  • 主要容器上（Primary10 到 Primary30）
  • 次要容器上（Secondary10 到 Secondary30）
  • 三級容器上（Tertiary10 到 Tertiary30）
  • 錯誤容器上（Error10 到 Error30）

這會影響使用這些角色作為其預設值的 Widget。

晶片（Chip、ActionChip、ChoiceChip、FilterChip 和 InputChip）的邊框顏色已從 ColorScheme.outline 更新為 ColorScheme.outlineVariant。這改善了晶片和按鈕之間的視覺層次結構。

Objective-C iOS 專案

自 2019 年 Flutter 1.9.1 發佈以來，新的 iOS 專案預設使用 Swift。建立 新的 Objective-C iOS 專案現在已被棄用，並且 flutter create --ios-language objc 標誌將在 Flutter 的未來版本中移除。您仍然可以打開 Xcode 專案並加入 Objective-C 檔案，包括插件的檔案。Java 繼續透過 flutter create --android-language java 標誌支援 Android 應用程式。

深度連結預設標誌

Flutter 的深度連結標誌的預設值已從 false 變更為 true，這意味著深度連結現在預設為選擇加入。如果您使用 Flutter 的預設深度連結設定，則不再需要手動將標誌設定為 true。

但是，如果您使用協力廠商插件進行深度連結，例如：

此更新將引入重大變更。在這種情況下，您需要手動將 Flutter 深度連結標誌重置為 false。

有關更多詳細資訊，請參閱設計文件：flutter.dev/go/deep-link-flag-migration

在 IDE 中棄用對較舊 SDK 的支援

為了確保我們能夠繼續提供高品質的開發人員體驗，我們正在對 IDE 插件支援進行變更。隨著 VS Code 和 IntelliJ 的 Dart 和 Flutter 插件的發展，支援較舊的 Dart SDK 版本變得越來越具有挑戰性。

從 Dart 3.6 發佈開始，我們將棄用對早於 3.0（於 2023 年 5 月發佈）的 Dart SDK 版本的支援。這意味著雖然這些工具可能仍然可以使用較舊的 SDK，但我們將不再為特定於這些版本的問題提供官方支援或修復。

隨著 Dart 3.7（預計在 2025 年第一季度）的發佈，我們將完全移除對這些較舊 SDK 版本的支援。這些插件的未來版本可能與這些版本不相容。

這對您意味著什麼？

  • 如果您使用的是較舊的 Dart SDK，我們鼓勵您升級到 3.0 或更高版本，以繼續接收支援和更新。
  • 此變更影響不到我們 1% 的使用者，它將使我們能夠專注於為絕大多數開發人員提供最佳的體驗。

結束語

有關此版本中的所有重大變更，請參閱 重大變更頁面 上的完整遷移指南列表。

與往常一樣，非常感謝社群為 貢獻測試——這些測試幫助我們識別重大變更。若要進一步了解，請查看 Flutter 的重大變更政策。

結論

非常感謝整個 Flutter 社群使此版本成為可能！您的貢獻、回饋和熱情是推動 Flutter 向前發展的動力。我們對 Flutter 的未來感到無比興奮，並迫不及待地想看到您使用 Flutter 3.27 建置的出色應用程式。

有關所有變更的完整概要，請查看詳細的 發行說明和變更日誌。準備好體驗最新最好的功能了嗎？只需運行 flutter upgrade 並開始建置！

Flutter 3.27 的新功能 最初發佈在 Medium 上的 Flutter 中，人們在那裡透過突出顯示和回應這個故事來繼續討論。