RainVisitor Blog

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

宣布 Flutter 2.10：穩定版 Windows、效能提升、Material 3 更新等等！

我簡直不敢相信又到了 Flutter 穩定版本發佈的時候！大家好，歡迎來到 Flutter 2.10。距離我們上次發佈版本還不到兩個月，但即使在那段時間裡，我們也收到了來自全球 155 位貢獻者的 1,843 個已解決的議題和 1,525 個已合併的 PR。感謝大家辛勤付出，特別是在 2021 年的假期期間。

這個版本有許多令人興奮的更新，包括 Flutter 對 Windows 支援的重大進展、幾個重要的效能提升、框架中對圖示和顏色的新支援，以及一些工具的改進。此外，我們還有一些關於移除 dev 頻道的更新、對舊版 iOS 的支援減少，以及一些重大變化的簡短清單。讓我們開始吧！

Windows 上的生產應用程式準備就緒

首先，Flutter 2.10 版本帶來了 Windows 支援的穩定版本。您不再需要切換旗標來獲得在 Flutter 的 stable 頻道上生成 Windows 應用程式的功能 - 現在這個功能預設提供！

當然，我們做的不僅僅是切換旗標。這個版本包括對文字處理、鍵盤處理和鍵盤快捷鍵的廣泛改進，以及與 Windows 的直接整合，支援命令列參數、全球化文字輸入和無障礙功能。

關於 Windows 穩定版發佈的更多資訊，請參閱 宣布 Flutter for Windows 部落格文章，這篇文章描述了 Flutter 在 Windows 上的架構，它允許深度整合，並讓您了解有多少 Flutter 套件和插件已經支援 Windows。您也可以看到我們的工具和應用程式合作夥伴使用 Flutter 在 Windows 上做的一些例子！

效能提升

此版本包含 Flutter 的初始支援，即由 Flutter 社群成員 knopp 提供的 髒污區域管理。他為 iOS/Metal 上單個髒污區域啟用了局部重新繪製。此變更將幾個基準測試的第 90 個和第 99 個百分位數的柵格化時間減少了數量級，並且將這些基準測試上的 GPU 使用率從 90% 以上降至 10% 以下。

我們預計在未來的版本中將局部重新繪製的好處帶到 其他平台。

在 Flutter 2.8 版本中，我們 推出了我們自己的內部圖片記錄格式。現在在 Flutter 2.10 中，我們已經開始利用它建立優化。例如，**透明度層的常見用例現在 實現得更加高效**。即使在最壞的情況下，基準測試中的畫面柵格化時間也降至之前值的 1/3 以下。

我們預計這種優化將在我們繼續開發圖片記錄格式時擴展到更多案例。

在 Profile 和 Release 模式下，Dart 程式碼會提前編譯成原生機器碼。此程式碼效率高且體積小的關鍵是全程式碼類型流分析，它可以解鎖許多編譯器優化和積極的樹狀搖動。然而，由於類型流分析必須涵蓋整個程式碼，因此它可能有點昂貴。這個版本包含 類型流分析的更快速實作。基準測試中 Flutter 應用程式的整體構建時間下降了約 10%。

與往常一樣，效能提升、減少記憶體使用和降低延遲是 Flutter 團隊的優先順序。期待在未來的版本中看到更多改進。

iOS 更新

除了效能提升，我們還新增了一些平台特定的功能和增強功能。一個新的增強功能是來自 luckysmg 的 iOS 上更平滑的鍵盤動畫，它會自動提供給您的應用程式，您無需做任何事情。

我們還透過修復一些 邊緣 案例 的 崩潰 來提高 iOS 相機插件的穩定性。

最後，64 位 iOS 架構獲得了一個新的功能來減少記憶體使用：壓縮 **指標****。

一個 64 位架構將指標表示為一個 8 位元組的資料結構。當您有很多物件時，指標本身佔用的空間會增加應用程式的整體記憶體使用量，特別是如果您有更大、更複雜的應用程式，這些應用程式具有更多 GC 抖動。但是，您的 iOS 應用程式不太可能擁有足夠的物件來需要大量使用 32 位地址空間（20 億個物件），更不用說 64 位地址空間的巨大空間（90 億億個物件）。

壓縮指標在 Dart 2.15 中提供，在此版本中，我們使用它們來減少 64 位 iOS 應用程式的記憶體使用量。您可以 查看 Dart 2.15 部落格文章以獲取詳細資訊。

當您閱讀 Dart 部落格文章時，別忘了 查看 Dart 2.16 宣布，其中包含關於使用套件平台標記支援 Flutter for Windows 以及在 pub.dev 上推出新的搜尋體驗的更新。

Android 更新

這個版本還包含許多針對 Android 的改進。預設情況下，當您建立新的應用程式時，Flutter 預設支援最新版本的 Android，版本 12（API 級別 31）。此外，在此版本中，**我們已 **自動啟用 multidex 支援**。如果您的應用程式支援 Android SDK 版本低於 21，並且超過 64K 方法限制，只需將 --multidex 旗標傳遞給 flutter build appbundle 或 flutter build apk，您的應用程式就會支援 multidex。

最後但並非最不重要的一點是，我們聽取了您的反饋意見，認為 Gradle 錯誤訊息會令人望而生畏。因此，Flutter 工具現在會建議如何解決常見問題的步驟 。例如，如果您為應用程式加入一個 Plugin，它需要您提高最低支援的 Android SDK 版本，您現在會在日誌中看到一個「Flutter Fix」建議。

我們將繼續為常見的錯誤訊息新增更多建議，並且樂於收到您對其他錯誤訊息的回饋，這些錯誤訊息也可能需要這種處理方法。

Web 更新

這個版本還包含一些針對 Web 的改進。例如，在之前的版本中，當捲軸到 Web 上多行 TextField 的邊緣時，它不會正確捲軸。這個版本引入了 文字選取的邊緣捲軸：當選取範圍移動到文字欄位之外時，欄位會捲軸以顯示捲軸範圍。這種新的行為適用於 Web 和桌面應用程式。

此外，這個版本的 Flutter 包含了另一個針對 Web 的顯著改進。我們一直在尋找方法來減少 Flutter 對 Web 的對映開銷。在之前的版本中，每次我們想要將原生 HTML Widget 加入到 Flutter 應用程式時，我們都需要一個覆蓋層作為我們針對 Web 的平台視圖支援的一部分。這些覆蓋層中的每一個都允許自訂繪製，但會造成一定程度的開銷。如果您的應用程式中有大量的原生 HTML Widget，例如連結，這些開銷會加起來。在此版本中，我們為 Web 建立了一個新的「非繪製平台視圖」，基本上消除了這種開銷。我們已經 在 連結 Widget 中利用了這種優化，這意味著如果您的 Flutter Web 應用程式中有許多連結，它們將不再會造成任何顯著的開銷。我們將隨著時間推移將這種優化應用於其他 Widget。

Material 3

此版本是過渡到 Material 3 的開始，其中包括 從單個種子顏色生成整個顏色配置 的功能。

使用任何顏色，您可以構造一個新的 ColorScheme 類型的實例：

ThemeData 工廠建構函式中還有一個新的 colorSchemeSeed 參數，允許您生成主題的顏色配置：

此外，此版本還包含 ThemeData.useMaterial3 旗標，它將組件切換到新的 Material 3 外觀。

最後但並非最不重要的一點是，**我們已新增 1,028 個新的 Material 圖示**。

可以在 跟踪我們 Material 3 工作的議題 中找到更新；歡迎您提供您的回饋。

整合測試改進

在 2020 年 12 月，我們宣布了一種使用 integration_test 套件 進行端到端測試的新方法。這個新的套件取代了 flutter_driver 套件，成為進行整合測試的推薦方法，它提供了一些新功能，例如 Firebase Test Lab 支援以及對 Web 和桌面的支援。

從那時起，我們在整合測試方面又進行了進一步的改進，包括 將 integration_test 套件捆綁到 Flutter SDK 本身，使其更容易與您的應用程式整合。還有一個 **新的 遷移指南，如果您要將現有的 flutter_driver 測試遷移到 integration_test**。

幾個 現有的 文件，範例 和 codelab 也已更新為 integration_test。要開始使用，請將您的瀏覽器指向 flutter.dev 上的 測試 Flutter 應用程式 頁面。如果您還沒有在 Flutter 應用程式中使用 integration_test，現在是開始的時候了！

Flutter DevTools

我們也在這個版本中為 Flutter DevTools 做了一些工作，包括如果您從命令列使用 DevTools 的一個易用性功能。您現在不再需要使用 pub global activate 來下載和執行最新版本，而是可以 直接使用 dart devtools 並獲得與您正在使用的 Flutter 版本保持一致的版本。

我們還進行了一些 許多 可用性 更新，包括 改進了在除錯器變數窗格中檢視大型列表和映射的支援（感謝 elliette）。

最後，我們即將發佈 年度 DevTools 調查！請提供您的回饋，幫助我們改進您的開發體驗。

這個調查提示將在 2 月中旬左右直接顯示在 DevTools 中。謝謝！

VSCode 改進

Flutter 的 Visual Studio Code 擴展也獲得了一些增強功能，包括 在程式碼中更多位置顯示顏色預覽 和 一個可以為您更新程式碼的顏色選擇器。

此外，如果您想成為 VSCode 的 Dart 和 Flutter 擴展的預發行版本的測試人員，您可以在 [擴展設定中切換到預發行版本](https://github.com/Dart-Code/Dart-Code/issues/
3729)。

您可以在 flutter-announce 郵件列表 上的 這篇文章 中閱讀有關此更新的詳細資訊以及更多內容。

• VS Code 擴展 v3.32
• VS Code 擴展 v3.34

移除 dev 頻道

在 Flutter 2.8 版本 中，我們宣布我們正在進行 移除 dev 頻道 的工作，簡化您的選擇，並減少工程開銷。在此版本中，我們已完成這項工作，包括：

• 更新了 Flutter 工具，以幫助開發人員從 dev 頻道遷移
• 更新了 Wiki 以反映更新後的客戶承諾
• 更新了棄用政策
• 從 DartPad、預提交測試和網站中移除 dev 頻道支援

dev 頻道現在已經被清除了。如果您發現我們遺漏了某個地方，請 告訴我們。

停止支援 iOS 9.3.6

由於使用率下降以及在實驗室中維護目標設備的難度越來越大，我們正在 停止支援 iOS 9.3.6，將其從「支援」層級移動到「最佳努力」層級。這意味著對 iOS 9.3.6 和 32 位 iOS 設備的支援將僅透過編碼實務、臨時和社群測試來維護。

在 2022 年第三季度的穩定版本中，我們預計將從 Flutter 穩定版本中刪除對 32 位 iOS 設備和 iOS 版本 9 和 10 的支援。這意味著從那時起針對穩定版 Flutter SDK 構建的應用程式將不再能在 32 位 iOS 設備上運行，Flutter 支援的最低 iOS 版本將升級到 iOS 11。

重大變更

我們還努力讓每個版本中都 只有少數重大變更，而這個版本雖然還沒有完全達到零，但我們會繼續努力！

• 所需的 Kotlin 版本
• 在 v2.5 之後移除的棄用 API
• Web 上的原始圖片使用正確的來源和顏色
• 手寫文字輸入客戶端

如果您仍然使用這些 API，您可以 閱讀 flutter.dev 上的遷移指南。與往常一樣，非常感謝社群為 貢獻測試，這些測試幫助我們識別出這些重大變更。

總結

來自 Google Flutter 團隊的所有人，我們想說 - 謝謝。謝謝您成為社群的一部分，幫助 Flutter 成為最受歡迎的跨平台 UI 工具包，這一點得到了 Statista 和 SlashData 等分析師的認可。對 Windows 的穩定支援只是我們忙碌的一年的開始，我們迫不及待地想看到我們一起構築的每一樣東西！

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

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

宣布 Flutter for Windows

自我們推出 Flutter 以來，我們一直專注於提供一個跨平台解決方案，用於構建精美的自定義應用程式，這些應用程式被編譯為機器碼，並充分利用您設備的底層圖形硬體。今天，隨著 Windows 作為應用程式目標的首次生產版本支援的發布，我們擴展了這個願景，使 Windows 開發人員能夠從移動開發人員一直以來享有的相同生產力和功能中受益。

我們對 Flutter 的目標是為您提供構建出色體驗所需的工具，無論您是在為哪個作業系統構建應用程式。因此，我們希望將相同的核心框架和工具帶到您想繪製像素的所有地方。Flutter 允許您精雕細琢 **精美** 的體驗，讓您的品牌和設計成為焦點。Flutter **快速**，直接編譯為機器碼；通過狀態熱重載支援，您可以獲得互動式開發環境的 **生產力**，讓您可以在應用程式運行時進行更改，並立即看到結果。Flutter **開源**，擁有數千名貢獻者為核心框架添加內容，並用套件生態系統擴展它。

幾乎有 50 萬個應用程式使用 Flutter……

到目前為止，我們已經看到了超出預期的發展勢頭，現在已經發布了近 50 萬個使用 Flutter 的應用程式，包括來自 Betterment、BMW 和 ByteDance 等公司的重大應用程式，以及來自 Google 的 30 個團隊的應用程式。在 2021 年，Flutter 根據 Statista 和 SlashData 等分析師的衡量標準，成為最受歡迎的跨平台 UI 工具包：

我們自己的數據證實了這一點，在 2021 年的所有四個季度調查中，有 92% 的 Flutter 開發人員對我們的工具表示滿意。 (對於其他 8% 的用戶，我們正在傾聽您的反饋，並希望您也感到滿意！)

一個常見的要求是 Windows 支援。

今天，我們很高興宣布 Flutter 在穩定版本中完整支援 Windows 應用程式。

Windows 和 Flutter

幾年前，我們為 Flutter 構建了一個雄心勃勃的願景，從 iOS 和 Android 上的行動應用程式擴展到其他平台，包括 Web 和 *桌面*。

Flutter 的核心跨越平台：從可移植的硬體加速 Skia 圖形引擎到 Flutter 渲染系統；核心原語，如動畫、主題、文字輸入和國際化；以及 Flutter 提供的數百個 Widget。

但是，桌面應用程式不僅僅是在更大螢幕上運行的行動應用程式。它們是為不同的輸入設備（例如鍵盤和滑鼠）而設計的。它們具有可調整大小的視窗，通常在寬螢幕顯示器上運行。對於關鍵事項（如輔助功能、輸入法編輯器和視覺樣式）存在不同的慣例。它們與底層作業系統中的不同 API 整合：桌面應用程式支援從檔案系統選擇器到設備硬體到 Windows 登錄等數據存儲的所有內容。

因此，雖然我們將 Flutter *帶到* Windows，但我們也為 Windows *量身定制* 了它。

與我們對 Android 和 iOS 的支援一樣，Flutter 的 Windows 實作結合了 Dart 框架和 C++ 引擎。Windows 和 Flutter 通過一個嵌入層進行通訊，該嵌入層託管 Flutter 引擎，並負責轉換和分派 Windows 消息。Flutter 與 Windows 配合將您的 UI 繪製到螢幕上，處理視窗調整大小和 DPI 變化等事件，並使用現有的 Windows 模式進行國際化，例如輸入法編輯器。

您的應用程式可以使用 Flutter 框架的每個部分，在 Windows 上，它也可以直接通過 Dart 的 C 互操作層或使用用 C++ 編寫的平台插件與 Win32、COM 和 Windows 執行時 API 通話。我們還適應了一些常見的 Plugin，以包含 Windows 支援，包括 camera、file_picker 和 shared_preferences。更重要的是，社群已經為各種其他套件添加了 Windows 支援，涵蓋從 Windows 工作列整合到串列埠存取的所有內容。

為了獲得完全自定義的 Windows UI，您還可以利用 `fluent_ui` 和 `flutter_acrylic` 等套件來建立一個精美地表達 Microsoft Fluent 設計系統的應用程式。使用 `msix` 工具，您可以將應用程式包裝在安裝程式中，可以上傳到 Windows 上的 Microsoft Store。

總之，這促進了應用程式的創建，這些應用程式在 Windows 上看起來很棒，在 Windows 上運行很快，並且仍然可以傳輸到其他桌面或行動設備以及 Web。以下是我們到目前為止看到的一些早期範例：

Microsoft 和 Flutter

我們詢問 Windows 團隊是否願意分享一些關於 Flutter 支援的意見。以下是 Microsoft Windows 開發者平台公司副總裁 Kevin Gallo 的說法：

“我們很高興看到 Flutter 添加了對創建 Windows 應用程式的支援。Windows 是一個開放平台，我們歡迎所有開發人員。我們很興奮看到 Flutter 開發人員將他們的經驗帶到 Windows，並發布到 Microsoft Store。Flutter 對 Windows 的支援是社群的一大步，我們迫不及待地想看看您將為 Windows 帶來什麼！”

事實上，Microsoft 的幾個團隊都為今天的公告做出了貢獻。特別是，我們想感謝 Fluent 設計團隊為 Windows 上的 Flutter 應用程式貢獻圖標。他們的 `fluentui_system_icons` 套件已獲得 Flutter Favorite 狀態，以證明其品質。

我們還對 Microsoft 在 Windows 輔助功能方面進行的投資印象深刻，我們感謝該團隊的幫助，確保 Flutter 從一開始就支援螢幕閱讀器。將輔助功能視為利基需求是一個錯誤。正如 Microsoft 包容性設計工具包中的這張圖所示，我們都有理由關心提供適合不同永久性、暫時性或情境性需求的體驗。

下面的視頻演示了 Flutter 如何與 Windows Narrator 整合。出於這個視頻的目的，我們故意模糊了螢幕，讓您了解這項功能對需要它的人來說是多麼有價值。

Windows 開發工具的生態系統

我們的工具合作夥伴也正在添加對 Windows 的支援。以下是一些重點：

• FlutterFlow，低程式碼 Flutter 應用程式設計工具，今天宣布支援 Windows，以及幫助 Flutter 開發人員構建針對桌面使用量身定制的應用程式的功能。
• Realm 是一個超快速的本地數據存儲。今天發布的最新版本現在支援使用 Flutter 構建 Windows 應用程式，使用 Dart FFI 快速存取底層數據庫，從而為 iOS 和 Android 等行動平台提供現有的支援。
• Nevercode 已更新其 Codemagic CI/CD 工具以支援 Windows，使您能夠在雲端測試和構建 Windows 應用程式，並自動將應用程式部署到 Microsoft Store。
• Syncfusion 已更新其 Widget 套件，以充分利用 Windows。如果您訂閱其工具包，您將發現數據可視化組件，例如樹狀圖和圖表，豐富的數據網格 Widget，日曆，甚至支援 PDF 創建和 Excel 電子表格。
• 最後，Rive 今天宣布即將推出的其熱門圖形工具套件的 Windows 版本，允許設計人員和開發人員創建互動式矢量動畫，這些動畫可以使用狀態機實時響應程式碼。其應用程式即將推出的 Windows 版本提供超快的效能和更低的內存占用率，並將很快在 Microsoft Store 上供下載。

看到圍繞 Flutter 建立的成熟生態系統，我們感到非常興奮，我們鼓勵您在使用 Flutter 構建 Windows 應用程式時查看每一個合作夥伴。

Windows 支援在 Flutter 2.10 中推出

構建 Windows 應用程式的穩定、生產級品質支援作為 Flutter 2.10 的一部分提供，該版本今天發布。Flutter 2.10 還包含許多其他功能、效能改進和錯誤修復，這些內容在單獨的部落格文章中詳細介紹。

在接下來的幾個月裡，您將從我們那裡聽到更多關於完成對 macOS 和 Linux 的穩定支援的消息，為您的生產 Flutter 應用程式提供完整的桌面、Web 和行動平台。

同時，感謝您對 Flutter 的支援。我們很興奮看到您為 Windows 構建的內容！

宣布 Flutter for Windows 最初發佈在 Flutter 上的 Medium，人們在那裡透過突出顯示和回應這個故事來繼續討論。

http://creativecommons.org/licenses/by/4.0/

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

您可能已經閱讀過 [Flutter 拼圖黑客挑戰](https://flutterhack.devpost.com/)，並正在思考如何將您的創造力推向新的極限。我們在此提供有關樣本程式碼庫結構的更多資訊，並提供一些關於如何建立您的比賽提交的一些想法。

滑動拼圖架構

提供的原始碼實作了一個分層架構，使用 flutter_bloc 管理狀態。Bloc 處理從遊戲邏輯到主題的所有內容。所有狀態都以一致的方式管理；針對拼圖邏輯的任何更新，您只需要找到對應的 bloc 並更新它。重設和洗牌遊戲按鈕、計時器和倒計時都是獨立的 bloc，因此這些可能是您考慮實作創造性的其他地方：也許是沙漏作為計時器？或者是一個華麗的洗牌順序？

請注意，所有遊戲邏輯都包含在一個名為 PuzzleBloc 的單一 bloc 中。它將透過事件更新，例如點擊一個磁磚以移動拼圖磁磚的 TileTapped 事件，或使用 PuzzleReset 完全重設拼圖板。每次拼圖更新時，都會發出新的拼圖狀態。

class PuzzleBloc extends Bloc<PuzzleEvent, PuzzleState> {
  PuzzleBloc(this._size, {this.random}) : super(const PuzzleState() {
    on<PuzzleInitialized>(_onPuzzleInitialized);
    on<TileTapped>(_onTileTapped);
    on<PuzzleReset>(_onPuzzleReset);
  }

  void _onPuzzleInitialized(
    PuzzleInitialized event,
    Emitter<PuzzleState> emit,
  ) {...}
  void _onTileTapped(
    TileTapped event,
    Emitter<PuzzleState> emit,
  ) {...}
  void _onPuzzleReset(
    PuzzleReset event,
    Emitter<PuzzleState> emit,
  ) {...}
}

自訂主題

樣本拼圖程式碼包含 Simple 和 Dashatar 兩種主題。這些可以用作您自訂主題的起點 - 盡情借用所需部分，或從頭開始。您如何實作拼圖取決於您自己！您可以考慮發揮創造力的其中一個地方是拼圖主題。

所有演示中的主題都在 PuzzlePage 的頂部發生。它已抽象化，因此您只需要更新一個地方的主題元素，更改就會反映到所有地方。Simple 和 Dashatar 主題都定義了一系列選項，例如螢幕背景、選單、標誌、按鈕、文字顏色、主題是否顯示計時器（Dashatar 主題中出現，但 Simple 主題中沒有），等等。您可以在儲存庫根目錄的「dashatar」和「simple」目錄中找到它們。

/// {@template simple_theme}
/// The simple puzzle theme.
/// {@endtemplate}
class SimpleTheme extends PuzzleTheme {
  /// {@macro simple_theme}
  const SimpleTheme() : super();

  @override
  Color get backgroundColor => PuzzleColors.white;

  @override
  Color get buttonColor => PuzzleColors.primary6;

  @override
  Color get hoverColor => PuzzleColors.primary3;

  @override
  Color get pressedColor => PuzzleColors.primary7;

  ...
}

每個拼圖主題都有一個 LayoutDelegate，它計算該主題的佈局。您可以透過重複使用相同的佈局物件，僅調整一些主題選項來建立新的主題。對於更進階的設計，整個主題 LayoutDelegate 都可以自訂。例如，您可以覆寫 backgroundBuilder 以製作自訂背景，僅在大型螢幕上顯示。

@override
Widget backgroundBuilder(PuzzleState state) {
  return Positioned(
    bottom: 74,
    right: 50,
    child: ResponsiveLayoutBuilder(
      small: (_, child) => const SizedBox(),
      medium: (_, child) => const SizedBox(),
      large: (_, child) => const DashatarThemePicker(),
    ),
  );
}

實作動畫

動畫是您在滑動拼圖中探索的絕佳元素。雖然 Simple 主題不包含任何動畫，但 Dashatar 程式碼實作了一些動畫，其中一些是 [交錯](https://docs.flutter.dev/development/ui/animations/staggered-animations) 的。這些動畫由單一動畫控制器驅動，使用 [Interval](https://api.flutter.dev/flutter/animation/Interval-class.html) 調整以延遲動畫，並使用 [Tween](https://api.flutter.dev/flutter/animation/Tween-class.html) 定義動畫的數值範圍。這可以在 Dashatar 拼圖的成功狀態中看到，其中多個 Widget 透過動畫其偏移量和不透明度而逐漸出現。類似地，倒計時器的每個滴答都使用相同的技術，緩慢地增長然後淡出，就像下一個滴答即將出現一樣。

Dashatar 主題中的大多數動畫都是隱含的。這表示您無需自行撰寫整個動畫，因為 Widget 會自行對屬性更改進行動畫。舉例來說，請查看 DashatarPuzzleTile Widget，了解如何對使用者點擊磁磚時磁磚的移動進行動畫。每當點擊磁磚時，其目前的 position 會更新，並透過隱含動畫的 AnimatedAlign 在給定的 movementDuration 內轉場。

class DashatarPuzzleTile extends StatelessWidget {
  ... 
  
  final Tile tile;
  
  @override
  Widget build(BuildContext context) {
    return AnimatedAlign(
      alignment: FractionalOffset(
        (tile.currentPosition.x - 1) / (size - 1),
        (tile.currentPosition.y - 1) / (size - 1),
      ),
      duration: movementDuration,
      curve: Curves.easeInOut,
      child: ResponsiveLayoutBuilder(...),
    );
  }
}

為網頁設計

樣本拼圖是為網頁而建的。它為三個螢幕尺寸實作了響應式設計：小型、中型和大型。此外，還有一個 ResponsiveLayoutBuilder，它使用 Flutter LayoutBuilder Widget 的包裝器，允許您根據不同的斷點指定不同的 Widget。

由於我們以網頁為目標，因此有一些額外的注意事項需要牢記。應用程式會預先快取圖片和一些音訊，以幫助優化遊戲期間的效能。當使用者到達預設的 Simple 拼圖遊戲時，Dashatar 版本的資產會在後台載入（我們對 [I/O 照片亭](https://github.com/flutter/photobooth) 載入所有道具的方式採取了類似的方法）。這將確保一旦使用者導航到 Dashatar 主題，大多數資產將已經載入，確保順暢的使用者體驗。

雖然應用程式在網頁上很方便，但您可以挑戰自己探索以創新方式讓拼圖擴展到多個平台的方法。您的拼圖在行動裝置和桌面上會是什麼樣子？您如何為多個平台調整您的想法？

無障礙性

滑動拼圖的設計考慮了無障礙性。使用者可以使用鍵盤與拼圖互動。這是透過 RawKeyboardListener 完成的，RawKeyboardListener 是一個在使用者按下或放開鍵盤上的鍵時會呼叫回呼的 Widget。使用者也可以使用螢幕閱讀器與應用程式互動。這是透過 [語義標籤](https://api.flutter.dev/flutter/widgets/Semantics-class.html) 完成的。還有一些提示，使用 Tooltip Widget 為某些操作顯示。如果您要從頭開始建立滑動拼圖提交，我們強烈建議使用上面類似的策略，使您的拼圖對所有使用者都具有無障礙性。

額外想法

您可以隨意使用演示程式碼庫作為您的提交的基礎。或者，您可以從頭開始實作一個新想法。重要的是您的提交是一個有效的滑動拼圖 - 但您如何實現它取決於您自己！

Simple 和 Dashatar 範例應該可以讓您了解您可以自訂的地方，或者您可以自行建立的酷炫事物。我們探索的一個有趣想法是將 [由 Felix Blaschke 建立的 Flutter Plasma](https://flutterplasma.dev/) 投影到拼圖磁磚上。電漿效果可以使用包裝在 Transform Widget 中的 CustomPaint Widget 實現，並使用 AnimationController 進行動畫。您可以在 [此處](https://github.com/felixblaschke/sa3_liquid/blob/main/lib/liquid/plasma/plasma.dart) 找到用在演示中的電漿渲染器的範例。

另一個想法是從 API 擷取圖片或其他資料。例如，您可以使用 [Google 照片 API](https://developers.google.com/photos) 使用您最喜歡的 Google 照片相簿中的照片製作滑動拼圖。這個挑戰的可能性是無限的！

在此查看樣本拼圖程式碼 [here](https://github.com/VGVentures/slide_puzzle)。在 Twitter 上使用 #FlutterPuzzleHack 與我們分享您的創作。我們迫不及待想看看您會建立什麼！

如何建立您自己的 Flutter 滑動拼圖 最初發佈在 Flutter 上的 Medium，人們在那裡透過突出顯示和回應這個故事來繼續討論。

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

宣布 Flutter Puzzle Hack！

準備好拋開節日塵埃，嘗試一個有趣的程式設計專案，測試您對 Flutter 的知識嗎？我們很高興宣布 Flutter Puzzle Hack，這是我們最新的挑戰，看看您能用 Flutter 做出什麼，以及贏得超過 50,000 美元獎金的機會。我們請您開發出最具創意但可解的滑動拼圖，目標是網頁上的 Flutter。無論您是創造出新的設計、從頭開始重建拼圖，還是以新的有趣方式整合套件，我們都希望看到您能將想像力發揮到什麼程度。

為了讓您開始，我們編寫了範例程式碼，它處理所有拼圖邏輯。我們還整理了大量其他文件和資源來幫助您建立引人入勝的提交，因此無論您是經驗豐富的 Flutter 開發人員，還是您只是在閱讀 Flutter Apprentice 後加入 Flutter 社群，這裡都有適合您的東西！

請務必在 Twitter 上分享您的解決方案，並使用標籤 #flutterpuzzlehack 標記，以便有機會在我們的 Twitter 帳戶上獲得展示！

詳細資訊

日期： 所有專案必須在 2022 年 2 月 28 日下午 1:59 PT (GMT -7) 之前提交。獲獎者將於 2022 年 3 月 23 日公布。

如何提交： 可以在 DevPost 找到註冊和提交參賽作品的說明。

類別： 獲獎者將在以下類別中選出：

• 整體執行
• 最佳動畫和設計使用
• 創意
• 最佳跨平台解決方案
• 社群選擇

我們還將頒發獎品給提交具有對 Flutter 社群有幫助的內容以及提交高品質 Flutter 團隊回饋的提交。

獎品 包括一台功能齊全的 Macbook Pro、現金、Flutter 周邊商品以及在 Flutter 推廣渠道上獲得展示的機會。

產品資訊會議

除了所有這些資源之外，我們還與 Flutter Community YouTube 頻道合作，邀請 Google Chrome、Firebase 和 Rive 等團隊來分享從網頁構建最佳實務到有效使用整合以將您的專案提升到新水平的內容。查看 競賽頁面 以獲取詳細的時程表。

保持聯繫

我們與 DevPost 的朋友合作進行此挑戰，這意味著您可以在 DevPost 平台上為您最喜歡的提交作品投票、與其他參與者建立聯繫並找到所有相關的競賽更新。

前往 flutterhack.devpost.com 開始。祝您好運，玩得開心！

宣布 Flutter Puzzle Hack！ 最初發佈在 Flutter 上的 Medium，人們在那裡透過突出顯示和回應這個故事來繼續討論。

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

Flutter 2.8 的新功能

北半球的季節變換，樹葉變色，氣溫下降，今年的最後一個穩定版本也到來了。歡迎來到 Flutter 2.8！這個版本代表了 207 位貢獻者和 178 位審查者的辛勤工作，共產生了 2,424 個合併的 PR 和 2976 個已關閉的議題。特別感謝本次版本的主要社群貢獻者 Bartosz Selwesiuk，他是 Very Good Ventures 的 Flutter 工程師，他貢獻了 23 個 PR，其中大部分都與 Web 平台的相機功能相關。

所有這些共同努力導致了引擎和 Flutter DevTools 的顯著性能提升，為 Flutter 提供了穩定的 Google Mobile Ads SDK 版本，加入了一系列新的 Firebase 功能和改進，更新了 WebView 3.0，推出了一批新的 Flutter Favorite 套件，對桌面平台進行了大量更新，為穩定版本發佈鋪平了道路，以及推出了支援更多套件（包括 Firebase 自身）的 DartPad 新版本。這可能是今年最後一個版本，但絕對不是最不重要的。讓我們一起來看看吧！

性能

始終如一，Flutter 的首要任務是品質。我們花費大量時間確保 Flutter 在所有支援的設備上都能盡可能順暢且穩定地運行。

啟動

此版本包含對應用程式啟動延遲的改進。我們使用 Google Pay（一個大型、流行的應用程式，擁有超過 100 萬行代碼）來測試這些改進，以確保這些更改可以對現實世界的應用程式產生可感知的影響。總體而言，這些改進導致 Google Pay 在低端 Android 設備上的啟動延遲降低了 50%，在高端設備上則降低了 10%。

Flutter 影響 Dart VM 垃圾回收策略的方式的改進，現在可以幫助在應用程式啟動過程中避免不合時宜的 GC 循環。例如，在 Android 上渲染第一個畫面之前，Flutter 現在 僅在 TRIM_LEVEL_RUNNING_CRITICAL 及以上時通知 Dart VM 記憶體壓力。在本地測試中，此更改將低端設備上的第一個畫面渲染時間最多縮短了 300 毫秒。

出於 謹慎，在之前的版本中，Flutter 在建立平台視圖時會阻塞平台執行緒。仔細的推理和測試 確定可以移除一些序列化操作，這在低端設備上啟動 Google Pay 時，可以移除超過 100 毫秒的阻塞。

先前，建立預設字體管理器會在建立第一個 Dart 隔離區時引入人工延遲。將預設字體管理器建立延遲到與 Dart 隔離區建立同時執行 既改進了啟動延遲，又使上述優化的效果更加明顯，因為這是主要的瓶頸。

記憶體

在記憶體受限設備上運行的 Flutter 開發者 遇到過問題，因為 Flutter 會急切地載入 Dart VM 的「服務隔離區」，而其 AOT 程式碼與應用程式捆綁在一起，導致 Flutter 同時將兩者讀取到記憶體中。在 2.8 版本的 Android 中，Dart VM 的服務隔離區 被拆分到自己的捆綁包中，可以單獨載入，這將記憶體節約了 40 MB，直到需要服務隔離區為止。Dart VM 通知作業系統 記憶體中由 AOT 程式使用的頁面由一個可能不需要再次讀取的檔案備份，從而進一步將記憶體佔用降低了 10%。因此，先前保存檔案備份資料副本的頁面可以被回收，並用於其他用途。

分析

有時開發人員希望查看 Flutter 的性能追蹤資料以及 Android 原生追蹤事件。此外，他們通常希望即使在發佈模式下也能查看追蹤事件，以便更好地理解已部署應用程式中的性能問題。為了實現這個目標，2.8 版本的穩定版本 現在會將追蹤事件發送到 Android systrace 記錄器（如果在應用程式啟動時啟用），即使 Flutter 應用程式是在發佈模式下構建的，這些事件也會被發送。

此外，為了幫助創建更少的卡頓動畫，一些開發者希望 在性能追蹤中獲取更多有關柵格快取行為的資訊，柵格快取允許 Flutter 複製昂貴且重複使用的圖片，而不是在每個畫面都重新繪製。性能追蹤中的全新流程事件 現在允許您追蹤柵格快取圖片的生命週期。

Flutter DevTools

為了除錯性能問題，此版本的 DevTools 加入了一個 全新的「增強追蹤」功能，以幫助您診斷由昂貴的構建、佈局和繪製操作造成的 UI 卡頓。

當任何這些追蹤功能啟用時，時間線會包含新的事件，用於構建 Widget、佈局渲染物件以及繪製渲染物件（如適用）。

此外，此版本的 DevTools 加入了一個 新的功能，用於分析應用程式啟動的性能。這個分析包含從 Dart VM 初始化到渲染第一個 Flutter 畫面之間的 CPU 樣本。在您按下「分析應用程式啟動」按鈕並載入應用程式啟動分析後，您會看到選擇了「AppStartUp」使用者標籤用於分析。您也可以在可用的使用者標籤列表中選擇此使用者標籤過濾器（如果存在），從而載入應用程式啟動分析。選擇此標籤會顯示應用程式啟動的分析資料。

Web 平台視圖

Android 和 iOS 並不是唯一獲得性能提升的平台。此版本還改進了 Flutter Web 的平台視圖性能。如果您不熟悉平台視圖，它們是 Flutter 允許您在應用程式中託管來自底層平台的原生 UI 組件的方式。Flutter Web 使用 HtmlElementView Widget 實作此功能，它允許您在 Flutter Web 應用程式中託管 HTML 元素。如果您使用的是 google_maps_flutter 或 video_player Plugin 的 Web 版本，或者您遵循 Flutter 團隊關於如何優化 在 Web 上顯示圖片 的建議，那麼您就在使用平台視圖。

在之前的 Flutter 版本中，嵌入平台視圖會立即創建一個新的畫布，每個額外的平台視圖會再增加一個畫布。額外的畫布成本很高，因為每個畫布的大小都是整個視窗的大小。此版本 重新使用為先前平台視圖創建的畫布，因此您不會在每秒鐘都產生 60 次成本，而只會在應用程式整個生命週期中產生一次成本。這意味著您可以在 Web 應用程式中擁有多個 HtmlElementView 實例，而不會降低性能，同時也能在使用平台視圖時減少捲軸卡頓。

生態系統

Flutter 不僅僅是框架、引擎和工具，它還有超過 20,000 個與 Flutter 相容的套件和 Plugin 在 pub.dev 上，而且每天還有更多套件被加入。Flutter 開發人員每天都會與大量生態系統中的套件互動，因此讓我們看看自上次版本發佈以來 Flutter 生態系統中發生了什麼。

Flutter Ads 正式發佈

最重要的是 Google Mobile SDK for Flutter 正式發佈，這是在 11 月發生的。

此版本支援 5 種廣告格式，整合了 AdMob 和 Ad Manager 支援，並包含了一個新的中介功能的測試版本，以幫助您優化廣告性能。有關將 Google Ads 整合到 Flutter 應用程式以及其他變現選項的更多資訊，請 查看 flutter.dev 上新的變現頁面。

WebView 3.0

Flutter 此次另一個新的版本是 webview_flutter Plugin 的 3.0 版本。我們提升了版本號碼，因為加入了許多新功能，還因為 Android 上 Web 視圖工作方式的潛在重大變更。在之前的 webview_flutter 版本中，混合合成模式已經可用，但不是預設模式。混合合成修復了先前預設虛擬顯示模式的許多問題。根據使用者回饋和議題追蹤，我們認為混合合成是時候成為預設模式了。此外，webview_flutter 還加入了一些廣受歡迎的功能：

• 支援 POST 和 GET 來填充內容 (4450，4479，4480，4573)
• 從檔案和字串載入 HTML (4446，4486，4544，4558)
• 透明背景支援 (3431，4569，4570)
• 在載入內容之前寫入 cookie (4555，4556，4557)

此外，在 3.0 版本中，webview_flutter 為一個新的平台提供了初步支援：Web。我們已經有很多開發者詢問是否能夠在 Flutter Web 應用程式中託管 Web 視圖，這允許您從單個程式碼庫中為行動設備或 Web 構建應用程式。在 Flutter Web 應用程式中託管 Web 視圖是什麼樣子的呢？從程式碼的角度來看，它看起來完全一樣：

在 Web 上運行時，它按預期工作：

請注意，目前 webview_flutter 的 Web 實作有一些限制，因為它是使用 iframe 構建的，iframe 只支援簡單的 URL 載入，而且無法控制或與載入的內容互動（有關更多資訊，請查看 webview_flutter_web README）。但是，我們正在根據大眾的需求將 webview_flutter_web 作為 未經認證的 Plugin 提供。如果您想嘗試一下，請將以下行添加到您的 pubspec.yaml 文件中：

如果您對 Web 或其他平台的 webview_flutter v3.0 有任何回饋，請 在 Flutter 儲存庫中將其記錄為 Web 視圖議題。此外，如果您之前沒有使用過 Web 視圖，或者您想複習一下，請查看 新的 Web 視圖 Codelab，它會逐步引導您完成在 Flutter 應用程式中託管 Web 內容的過程。

Flutter Favorites

Flutter 生態系統委員會 再次開會，指定以下套件為 Flutter Favorite 套件：

• 三個針對新的 Router API 的自訂路由套件： beamer，routemaster 和 go_router
• drift，一個已經非常強大且流行的 Flutter 和 Dart 反應式持久化函式庫的重命名版本，建立在 sqlite 的基礎上
• freezed，一個 Dart 語言補丁，用於提供一個簡單的語法來定義模型、複製物件、模式匹配等等
• dart_code_metrics
• 以及幾個外觀很棒的 GUI 套件： flex_color_scheme，flutter_svg，feedback，toggle_switch 和 auto_size_text

恭喜這些套件作者，感謝您透過辛勤工作支援 Flutter 社群。如果您有興趣提名您最喜歡的 Flutter 套件參加 Flutter Favorite 獎項，請遵循 Flutter Favorite 程式頁面 上的指南和說明。

平台特定套件

如果您是套件作者，您必須做出的一個決定是您將支援哪些平台。如果您要構建一個包含平台特定原生程式碼的 Plugin，您可以 使用專案 pubspec.yaml 文件中的 pluginClass 屬性 來做到這一點，它指示提供功能的原生類別：

但是，隨著 Dart FFI 的日益成熟，您可以在 100% 的 Dart 代碼中實作平台特定功能，就像 path_provider_windows 套件 一樣。當您沒有任何原生類別可以使用，但仍然希望將您的套件指定為只支援某些平台時，請改用 dartPluginClass 屬性：

此設定到位後，即使您沒有任何原生程式碼，您也會將您的套件指定為只支援某些平台。您還必須提供 Dart Plugin 類別；在 Flutter.dev 上的 Dart-only 平台實作文件 中了解更多資訊。

Firebase

Flutter 生態系統的另一個重要組成部分是 FlutterFire，它被三分之二的 Flutter 應用程式使用。此版本加入了一組新的功能，可以更輕鬆地使用 Flutter 和 Firebase 構建應用程式：

• 所有 FlutterFire Plugin 都從測試版本升級到穩定版本
• DartPad 中對多個 Firebase 服務的新支援
• 更方便地為認證和實時 Firestore 查詢構建 UI 的新函式庫
• 可在 Alpha 版本中使用的 Flutter 的全新 Firestore 物件/文件映射

生產品質

FlutterFire Plugin 已經（幾乎）全部從測試版本轉移到穩定品質。

轉移到 Android、iOS 和 Web 穩定版本的 Plugin 包括 Analytics，Dynamic Links，In-App Messaging，Performance Monitoring，Realtime Database，Remote Config 以及新加入的 Installations。App Check Plugin 和 macOS 平台支援仍然處於測試階段，因為 Firebase 函式庫本身也處於測試階段。如果您擔心是否要選擇 Realtime Database、Analytics 或 Remote Config，因為 FlutterFire 函式庫還沒有準備好投入生產環境，那麼現在可以不用再擔心了。這些現在都是支援生產環境的完整 Plugin。

Dart-only Firebase 初始化

隨著套件的轉移到生產品質，我們加入了 從 Dart 初始化任何支援平台上的 Firebase 的功能：

此程式碼使用每個支援平台的適當選項來初始化 Firebase 應用程式，如 firebase_options.dart 文件中所定義，該文件包含每個平台的資料結構，如下所示：

若要收集每個平台的初始化選項資料結構的資料，請查看 新的 flutterfire CLI 工具。

此工具會深入您的平台特定子資料夾中的資料，以找到唯一的捆綁 ID，然後使用該 ID 來查詢與您的匹配平台特定應用程式相符的 Firebase 專案的特定詳細資訊，甚至在沒有任何專案或應用程式的

http://creativecommons.org/licenses/by/4.0/

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

宣布 Flutter 2.8：回顧一年的成長

正值節日，我們今天宣布 Flutter 的重大更新，其中包含許多新功能和改進，以優化行動和網頁開發人員的體驗，並且讓我們更接近穩定支援桌面平台。

Flutter 的目標是改變應用程式的建構方式。它將行動、網頁、桌面和嵌入式開發整合到一個工具集中：讓開發人員首先專注於他們想要建構的內容，而不是他們想要鎖定的平台；提供一個高性能、高生產力的框架，縮短開發人員的內部迴圈；並讓一個程式碼庫能夠鎖定多個平台和外型。

新功能和改進：更快、更高效

此版本的主要重點之一是 行動性能。理想情況下，出色的性能應該免費提供，但實際上任何複雜的應用程式都需要優化，以確保它能很好地使用底層硬體和函示庫。這包括啟動性能，它可能會受到網路頻寬或其他初始化成本的限制；記憶體使用情況，特別是在記憶體受限的設備上；以及圖形渲染。我們一直在利用在 Google Pay 等大型 Google 應用程式中獲得的一些經驗，投資於讓 Flutter 本身更具性能，以及為您提供更好的工具來指導您對自己的應用程式進行分析和優化。只要升級到 Flutter 2.8，您的應用程式應該就能更快地啟動，並使用更少的記憶體。

最新的更新讓 將應用程式連接到後端服務 比以往更容易，例如 Firebase 和 Google Cloud。它新增了 生產級 Google Ads 的支援，以及對相機和嵌入式網頁插件的重大升級。此版本還包含 Dart 2.15，它在並發性方面做了重大改進，增加了新的語言功能，例如建構函式 tearoff 和增強的枚舉，以及優化，使記憶體使用率降低 10%。

此版本中我們投入的另一個重要主題（您會看到我們在未來版本中繼續投入），是進一步 提高開發人員生產力。有了狀態熱重載等功能，我們一直專注於為開發人員創造一個緊密的內部迴圈。我們現在開始探索一些更高階的抽象，讓開發人員更容易快速運行。例如，在此版本中，我們新增了一個登入 Widget，它使用 Firebase 來處理驗證。有了這個 Widget，您不必擔心登入的所有邊緣情況，例如雙重驗證或重置密碼使用者流程，也不必擔心支援 Google、Apple、Twitter 或 Facebook 作為驗證提供者的複雜性。像這樣的功能，基於 Flutter 的核心基礎，有可能改變開發人員建構應用程式的模式，將低程式碼解決方案的開發速度與完整的 UI 框架的靈活性與功能結合起來。

Flutter 2.8 和 Dart 2.15 現在都已推出，對於運行先前版本的現有應用程式來說，應該是一個輕鬆的升級。為了更詳細地說明，我們有一篇技術部落格文章涵蓋了 Dart 和 Flutter 中的增強功能。

使用 Flame 開發休閒遊戲

對於大多數開發人員來說，Flutter 是一個應用程式框架。但圍繞休閒遊戲開發的生態系統也在不斷增長，利用 Flutter 提供的硬體加速圖形支援。

今天，我們很高興慶祝 Flame 1.0 版的發佈，這是一個基於 Flutter 之上的模組化 2D 遊戲引擎。Flame 提供了您快速建構遊戲所需的一切：除了遊戲迴圈之外，它還包含核心基本元素，例如元件系統、動畫精靈和圖片、碰撞偵測、世界攝影機、效果系統，以及手勢和輸入支援。

Flame 是模組化的，也可以透過提供與其他函式庫整合的套件進行擴展，例如 Rive（用於動畫）、audioplayers（用於音樂和音效）、Forge2D（一個 Box2D 風格的物理引擎）、Tiled（地圖編輯器）、Fire Atlas（一個精靈表和動畫編輯器）。總之，Flame 和更廣泛的生態系統為休閒遊戲或 2D 遊戲開發人員提供了一套強大的服務。

Flame 由 Blue Fire 創建，這是一個專注於為 Flutter 和 Dart 創建開源套件和插件的貢獻者組成的小組。我們很高興與他們合作，並鼓勵您查看 Flame，如果您對遊戲開發感興趣。

Flutter 的持續發展

我們驚嘆地看到 Flutter 的發展速度有多快，它擁有一個欣欣向榮的應用程式和工具生態系統，建立在核心框架的基礎之上。在今年的 Google I/O 活動上，我們注意到，Play 商店中已經有超過 200,000 個使用 Flutter 建構的應用程式。在該活動舉行後的短短六個多月時間裡，Flutter 應用程式的數量幾乎增加了一倍，Play 商店中現在有超過 375,000 個 Flutter 應用程式。

當然，Flutter 不僅僅用於 Android。根據獨立的行動分析公司 AppAnnie 的數據，使用 Flutter 在 iOS 上運行的應用程式包括頂級品牌和應用程式，包括 BMW，eBay，微信，SHEIN，飛利浦 Hue，諾頓，Trip.com 和 Greggs。在網頁上，Flutter 成為了應用程式體驗的理想選擇，為 FlutterFlow 和 Rive 等設計工具帶來了益處。在桌面平台上，Ubuntu 工程團隊繼續使用 Flutter 建構各種 新的體驗 ，包括一個新的安裝程式和韌體更新程式。甚至像 PUBG 這樣的遊戲也發現 Flutter 非常適合 UI 螢幕。

生態系統的建立需要很長時間，但 Flutter 現在是佔據主導地位的多平台工具包，根據 Statista、JetBrains、SlashData 和 Stack Overflow 的獨立數據顯示。我們不會因此而感到自滿，但 Flutter 人氣的提升導致了一個越來越廣泛的 套件 和工具生態系統來支援它。

回顧 2021，展望 2022

在過去艱難的一年裡，我們自己的工程團隊一直在忙碌。除了 Flutter 2.8 中的功能之外，我們還重寫了開發人員工具，發佈了空安全和 Web 支援，完成了用於原生程式碼整合的 FFI，增加了對 Material You 的初步支援，並努力提高性能和品質。我們總共關閉了近 20,000 個議題。我們創建了一個 全新的智慧網站 以更好地展示 Flutter。在過去的幾個月裡，我們投入了大量的精力來徹底改造我們的工程基礎設施，以提高工程師的生產力，並擴展測試。

展望 2022 年，我們希望能夠親自見到你們中的一些人。我們預計將更多投資於核心開發人員體驗，包括語言增強、文件更新，以及使使用 Flutter 建構複雜應用程式變得更容易的更高階抽象。我們將完成穩定的桌面支援，並進一步擴展我們在 Web 上的工作。我們還計畫擴展與其他平台的互操作性，以及將其移植到新的目標平台。我們才剛剛開始！

一些結語和致敬

我們想將這個 Flutter 2.8 版本獻給凱文·格雷，一位 Very Good Ventures 的開發人員，他一個星期前不幸去世了。自 Flutter 最初誕生以來，凱文一直是 Flutter 成功的重要貢獻者；他是許多早期 Flutter 範例的開發人員，包括我們最早的幾個高知名度客戶成功案例，例如 Flutter 在桌面平台上的首次演示，以及在 Google I/O 主題演講中展示的第一個 Flutter 範例。他是一個有天賦、關心他人、有趣且善良的人，認識他的人都會同意，他的離去留下了巨大的空缺。在悲傷的同時，我們也慶祝他的生命，並公開紀念他，以便他的影響力可以為所有人所知。沒有他，Flutter 就不會是現在這個樣子。

凱文，我們已經開始想念你了。感謝你為 Flutter 所做的一切，以及你的友誼。我們向他的家人和朋友致以愛意。

對於我們更廣大的 Flutter 開發人員和支援者社群，我們對你們表示感謝。我們希望 Flutter 2.8 能讓你們有足夠的探索空間。如果您還沒開始學習 Flutter，請加入近 40,000 名目前正在學習 Flutter Apprentice 書籍 的開發人員，這本書直到 1 月初對所有人免費。我們祝您節日快樂，平安健康。

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

http://creativecommons.org/licenses/by/4.0/

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

應用程式有許多賺錢方式：作為實體商店的店面接受付款；提供訂閱或應用程式內購；或在您的應用程式中直接包含廣告。今天，我們很興奮地宣布，在六個月的 Beta 測試期後，[Google 行動廣告 SDK for Flutter](https://pub.dev/packages/google_mobile_ads) 現在正式上市。這是需要在應用程式中顯示廣告的 Flutter 應用程式的重大消息！

支援的廣告格式

Google 行動廣告 (GMA) SDK for Flutter 適用於 iOS 和 Android，並支援載入和顯示所有 Google [行動廣告格式](https://developers.google.com/admob/flutter/quick-start)，包括：

橫幅廣告：一種矩形廣告，佔用應用程式佈局中的位置。這些廣告會在使用者與應用程式互動時保持在螢幕上，無論是固定在螢幕頂部或底部，還是與內容保持一致並隨著使用者捲軸而捲動。除了標準的固定尺寸橫幅廣告外，我們還支援適應橫幅廣告，這些廣告會根據設備的寬度和高度顯示最佳橫幅大小。

插頁式廣告：全螢幕廣告，會覆蓋應用程式的整個螢幕。這些廣告最適合放置在應用程式中的自然間隔或轉場處。

獎勵影片廣告：一種獎勵廣告單元，讓您可以透過與影片廣告、可玩廣告和調查互動來獎勵使用者應用程式內物品。這是遊戲開發人員中最受歡迎的廣告格式之一。

原生廣告：一種高度自訂的格式，讓您可以設計廣告以符合應用程式內容的外觀和風格。

應用程式開啟廣告：一種廣告格式，用於變現您的行動應用程式載入體驗。應用程式開啟廣告會在使用者開啟或切回您的應用程式時顯示。

Google AdMob 和廣告管理員

我們與 Google 廣告團隊合作建立了這個 Plugin，作為 Flutter 開發人員的官方廣告解決方案。GMA SDK for Flutter 將對 **Google AdMob 和 Google 廣告管理員** 的支援整合到單一 Plugin 中。

如果您不熟悉 Google 的廣告服務，您可能不知道 [AdMob](https://admob.google.com/home/) 和 [廣告管理員](http://admanager.google.com/home) 是兩種具有不同變現功能的不同產品。AdMob 平台專為希望從廣告中賺錢並獲得可行洞察以發展應用程式業務的行動開發人員設計。廣告管理員平台專為擁有大量直接銷售或多種庫存類型的發佈者設計。

[GMA SDK for Flutter](https://pub.dev/packages/google_mobile_ads) 整合了這些產品，透過在 iOS 和 Android 之間共用程式碼來滿足您的變現需求，並且無需重新編寫程式碼即可滿足不斷增長的需要。

中介和出價

此版本還包含新的中介功能預覽，可幫助您優化廣告效能。[中介](https://developers.google.com/admob/flutter/mediation/get-started) 可幫助您在一個位置管理用於向您的應用程式提供廣告的各種廣告來源。除了 Google 的需求外，您也可以透過此功能從非 Google 廣告網路提供廣告。使用中介，您可以將收到的廣告請求發送到多個廣告來源，並找到最佳的可用來源來滿足這些請求。除了傳統的中介外，它還支援出價，讓廣告來源可以透過即時拍賣來爭奪滿足您的廣告請求。這有助於確保您的每次展示都能獲得最高收益。

GMA SDK for Flutter 提供了與 iOS 和 Android 應用程式相同的廣告功能。您可以使用相同的工具來管理您的活動、追蹤廣告效能等等。

早期採用者

我們一直在與一些早期採用者合作，他們渴望在我們的生產版本發佈之前先開始使用 Flutter 的廣告支援。其中一位開發人員是 Lotum，他們最近重寫了他們非常成功的文字遊戲「[4 Pics 1 Word](https://play.google.com/store/apps/details?id=de.lotum.whatsinthefoto.us&hl=en_US&gl=US)」，這是一款在 50 個國家名列前茅的應用程式，僅 Android 版本的安裝次數就超過了 5000 萬次。他們選擇使用 Flutter 重寫，並使用 GMA SDK for Flutter 顯示插頁式廣告和獎勵影片。

應用程式 Flutter 開發人員 Petra Langenbacher 表示：

「我們已經對我們的應用程式進行了多年的微調和優化，我們想知道完整的重寫是否會影響我們的收益或使用者群體。但我們很驚喜地發現，情況並非如此：我們能夠進行這些更改，而不會產生任何負面影響！」

感謝 Lotum 和所有其他早期採用者提供寶貴的回饋。我們感謝您對此初始版本的幫助。

其他變現功能

除了廣告外，Flutter 還提供其他變現應用程式的方法。例如，[應用程式內購](https://pub.dev/packages/in_app_purchase) Plugin 讓您可以在您的應用程式中提供額外的內容，例如付費服務、數位商品和訂閱。Flutter 的 [Pay](https://pub.dev/packages/pay) Plugin 讓您的應用程式可以在 Android 設備上整合 Google Pay，在 iOS 上整合 Apple Pay。這使您能夠透過使用者在支付雜貨、零售商品和外送等事物時透過無縫體驗快速輕鬆地支援兩個平台。

有關我們的廣告或其他變現產品的更多資訊，請[查看我們新更新的網站](https://flutter.dev/monetization)，您可以在其中找到範例、Codelab 和文件！

建立 Flutter 應用程式僅是開始。我們希望透過我們的變現功能套件，幫助您使用 Flutter 成功創業！

宣布 Google 行動廣告 SDK for Flutter 正式上市 最初發佈在 Flutter 上的 Medium，人們在那裡透過突出顯示和回應這個故事來繼續討論。

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

關於網頁、社群和程式碼範例 - Q3 2021 調查結果

Flutter UX 團隊的季度調查報告回來了！這是我們第 14 次季度調查，在 8 月份持續了一週，透過各種管道宣佈，例如 IDE 彈出視窗、推特公告以及在 flutter.dev 上。我們收到了超過 8,000 位您的回應，一如往常，我們從中學到了很多關於您需求的資訊。

如果您想了解團隊如何分析資料，請查看此影片。

在本季度，我們發現 92% 的受訪者對 Flutter 感到滿意（39% 有些滿意 + 53% 非常滿意）。這個數字在過去 4 個季度一直很穩定，而 Flutter 開發人員的數量也在持續增長。我們仍然想聽聽您對 Flutter 各個部分的想法，因此在本季度的調查中，我們詢問了以下三個主題：

• 開發人員社群
• 網頁支援
• 原始碼檔案中的程式碼範例。

請继续阅读，了解我們從調查中學到了什麼以及我們打算做些什麼。

開發人員社群

Flutter 很自豪能成為一個開源專案。Google 的 Flutter 團隊在社群計畫上投入了大量資源，以建立一個友善且包容的開發人員社群，並讓 Flutter 開發人員獲得成功。由於了解我們需要在哪些地方投入更多資源以及做得更好非常重要，因此我們詢問受訪者他們對 Flutter 開發人員社群的各種陳述的認同程度。當我們說「開發人員社群」時，我們指的是社交網路群組、問答論壇、聊天室、聚會等等。

49% 的所有開發人員表示，他們參與了某種形式的線上或線下社群。我們發現大多數開發人員在社群中感到受到歡迎（86%）並敢於提出問題（86%）。

我們要感謝您，我們的開發人員社群，為建立一個安全和支持的空間。Flutter 旨在帶來 樂趣，而擁有一定的心理安全感，能夠嘗試新事物、犯錯，以及對自己能夠建造的東西感到驚奇，是獲得樂趣的重要組成部分。我們確定了 Flutter 團隊可以努力發揮影響力的幾個領域，例如讓更多問題得到解答，以及為社群中的領導者提供更好的曝光率。我們將與社群密切合作，共同改善兩者。

網頁支援

Flutter 團隊在今年早些時候宣佈 網頁支援已穩定。現在，在 6 個月後，大約 13% 的 flutter run 指令以及 11% 的 flutter build 指令都針對網頁。因此，我們想知道穩定版本發佈後，您對網頁支援的看法如何變化。我們在 2020 年第 3 季度也詢問了類似的調查問題，因此我們能夠比較一些數據點。

首先，我們發現 38% 的開發人員在調查前一個月中使用 Flutter Web 應用程式進行開發。此外，在所有開發人員中，有 52% 的開發人員在過去 6 個月（自穩定版本發佈以來）使用過 Flutter Web 應用程式。本節中的問題僅針對這組開發人員。

總體而言，有 63% 的開發人員對 Flutter 開發生產級別 Web 應用程式的能力感到滿意（23% 非常滿意）。當我們專門詢問 Flutter 應用程式在網頁上的效能時，67% 的開發人員感到滿意（23% 非常滿意）。雖然這個數字低於整體滿意度，但我們很高興地看到對網頁效能的滿意度從 2020 年第 3 季度的 59% 上升到 67%。

為了了解我們有哪些機會，我們詢問開發人員遇到了哪些效能問題。不出所料，初始頁面載入速度是最常見的效能問題（48%），其次是捲軸（32%）。在頁面載入方面，我們正在研究縮減 Canvas Kit 下載大小並提供啟動畫面的 API。在捲軸方面，我們正在解決許多行為問題以及由於圖片解碼造成的卡頓。您可以在 公開路線圖 中找到更多詳細資訊。

我們還詢問了哪些功能需要改進。SEO 被最多開發人員選中（36%），其次是下載（套件）大小（27%）。雖然我們了解索引在網頁上的重要性，但我們最初發佈的網頁支援專注於 Web 應用程式的利基市場，這些應用程式更重視內容創作，因此不需要索引。Rive 使用的 rive.app 就是一個很好的例子。他們有一個用 HTML 編寫的登陸頁面，該頁面對 SEO 友好，而當使用者啟動用 Flutter Web 編寫的主要應用程式時，SEO 就變得不再必要。我們目前的計畫是首先提高 Flutter 在網頁上的品質，使其在 Web 應用程式中表現出色，然後再解決其他用例，例如更重視內容消費的應用程式或頁面。

原始碼檔案中的程式碼範例

由於 Flutter 是一個開源專案，因此您可以在 IDE 中跳轉到 API 的定義並閱讀其程式碼範例，這些範例嵌入在原始碼中。但是，框架團隊正在考慮將程式碼範例從原始碼移到單獨的檔案中，以便啟用語法高亮顯示並將符號轉換為可點擊的連結。（有關更多資訊，請查看 中型程式碼範例 和 測試程式碼範例 的設計文件。）由於這可能會影響您使用文件的方式，因此我們在本次調查中加入了一個部分，以了解有多少人可能會受到提議的設計的影響。

令我們驚訝的是，許多人經常使用原始碼檔案。事實上，有 70% 的開發人員每週至少閱讀一次原始碼檔案，如果不是每天的話。

我們想了解有多少人實際上閱讀並使用了 /// 註釋中的程式碼範例。結果表明，50% 的受訪者閱讀了程式碼範例，大約 21% 的受訪者複製了程式碼範例，即使現在這樣做不太容易。

然後我們詢問了與 /// 註釋中的程式碼範例互動時的相關問題。我們發現最大的問題是缺乏語法高亮顯示（27%）。此外，大量的程式碼範例塊使得閱讀其餘的文件變得困難（25%）。

這個結果支持將程式碼範例單獨儲存的益處，這將縮短實際 API 文件的長度，並啟用對語法高亮顯示和將符號轉換為可點擊的連結的支援。但是，由於許多人今天閱讀和複製文件中的程式碼範例，我們可能會考慮使用語法高亮顯示以內聯方式顯示程式碼；因此，在視覺上將程式碼範例與其餘文件隔開。

如果您有興趣關注這個主題，請關注與導航支援相關的以下問題： Dart，IntelliJ Plugin，VSCode Plugin。

下次調查見！

我們看到越來越多的開發人員將 Flutter 作為其主要工作的一部分。這對我們來說是個好消息，我們致力於根據您的回饋，為您提供最佳的跨平台技術。

請繼續將您的回饋意見發送給我們。但季度調查不是您唯一可以使用的管道。如果您有需要跟進的緊急問題，請在 GitHub 上提交。

Flutter UXR 團隊將繼續每季度進行調查。我們會在 flutter.dev、Flutter IDE Plugin 和 Twitter @FlutterDev 上宣佈調查。請繼續貢獻您的想法，因為團隊正在尋找重要問題的答案。您也可以透過 註冊即將進行的 UX 研究 來參與其他研究。

再次感謝所有參與本次調查並提供寶貴回饋的人。我們的目標是建立一個您喜歡的產品，我們感謝您抽出時間和精力幫助我們。

關於網頁、社群和程式碼範例 - Q3 2021 調查結果 最初發佈在 Flutter 上的 Medium，人們在那裡透過突出顯示和回應這個故事來繼續討論。

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

免費學習 Flutter 的書籍，限時供應！

我們聽說很多人都想要學習 Flutter，但不知道從哪裡開始。所以我們有好消息要告訴你 - 我們將在接下來的 3 個月內免費贈送一本書，還可以參加讀書會來幫助您追蹤進度並回答問題。

《Flutter Apprentice》是為了在行動開發基礎之上建立而寫的。它將帶領您完成您的第一個完整的 Flutter 應用程式，包括設計複雜的 UI，以及更進階的概念，例如持久性、狀態管理，以及使用 Firebase 的雲端儲存。這本書甚至還涵蓋了在 iOS 和 Android 平台上發佈的內容。

《Flutter Apprentice》出自 Razeware，該團隊開發了 raywenderlich.com 的書籍、影片和教學課程。這本書的售價通常為 60 美元，但您可以在 2021 年 10 月 6 日到 2022 年 1 月 6 日之間免費存取《Flutter Apprentice》。

《Flutter Apprentice》是一本實用的書籍，有許多範例可以供您參考，以及您可以用在自己的應用程式中的程式碼。它基於最新的 Flutter 2.5 版本和 Dart 語言中的最新功能。無論您是想要深入了解 Flutter 更進階功能的經驗豐富的開發人員，還是您是應用程式開發新手並且有興趣將 Flutter 加入您的前端開發工具集中，我們相信您都能在其中找到很多有用的內容。

一起學習

我們很高興舉辦 《Flutter Apprentice 讀書會》，這是每週一次的機會，可以聆聽現場討論，並由這本書的作者和社群專家解答您的問題。我們將與 Flutteristas 和 Flutter 社群中的其他知名領袖合作，主持讀書會。每個週三下午 12 點（美國東部時間）/ 上午 9 點（太平洋時間）加入 Flutter Community YouTube 頻道 參加總結和討論。

關注我們，參加隨堂測驗、贏取您自己的 Dash 毛絨玩具的機會、與這本書的作者進行 AMA 等等。

取得存取權

若要開始，請前往 flutter.dev/apprentice-giveaway，您將在其中找到存取這本書的說明。

您也可以訂閱 Flutter 團隊的更新。我們期待在旅途中與您同行；一路順風！

使用 Flutter Apprentice 免費學習 Flutter！ 最初發佈在 Flutter 上的 Medium，人們在這裡透過突出顯示和回應這個故事來繼續討論。

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

介紹 Flutter Meetup 網絡！

Flutter Meetup 網絡 (FMN) 是一個由對 Flutter 熱情的 Meetup 小組組成的國際網絡。FMN 計畫的使命是 透過賦予社群組織者權力，讓他們能夠透過引人入勝的活動來教育和啟發當地社群，從而培養一個蓬勃發展的全球 Flutter 開發人員社群。

Meetup（以及類似的開發人員社群）是極好的資源。隨著 Flutter 在過去幾年中越來越受歡迎，全球各地自發地出現了 100 多個 Meetup 小組，用來慶祝 Flutter 並教育其成員有關 Flutter 的知識。這些小組的志願者舉辦了 許多 棒的活動和研討會。

我們 Flutter 團隊見證並感謝這些了不起的社群。💙 Flutter Meetup 網絡 (FMN) 現在將正式推出，以支援這些小組。網絡成員將能夠存取各種資源（更多詳細資訊即將推出！），讓規劃和主辦以 Flutter 為主題的活動變得更加容易。

除了建立人脈之外，Meetup 還有許多其他優點。當您在目前的 Flutter 專案中遇到問題時，很有可能您可以在當地的 Flutter Meetup 中找到一位開發人員，他們已經解決了類似問題。或者，也許他們知道最適合您需求的套件。

我們很高興支援我們了不起且熱情的組織者，並迫不及待地想看看 Flutter Meetup 網絡在未來會做些什麼。

加入您附近的 Meetup！

介紹 Flutter Meetup 網絡！ 最初發佈在 Flutter 上的 Medium，人們在那裡透過突出顯示和回應這個故事來繼續討論。