面向 Jetpack Compose 開發者的 Flutter：完整實用指南

首页 » 蟒蛇 » 面向 Jetpack Compose 開發者的 Flutter：完整實用指南

如果你已經能熟練地使用 Jetpack Compose 編寫 UI，並且想知道遷移到 Flutter 有多難，那麼你正處於一個非常有利的位置。 這兩個工具包都是聲明式、響應式的，而且都由谷歌開發，因此你大部分的思維模式幾乎可以完全照搬。主要區別在於程式語言（Kotlin 與 Dart）、專案結構以及每個框架與底層 Android 層（以及 Flutter 中的 iOS、Web 和桌面層）的互動方式。

本指南專為希望深入了解 Flutter 的 Jetpack Compose 開發人員編寫，不包含任何行銷噱頭。 您將了解兩個世界的核心概念是如何映射的：可組合元件與控制項、修飾符與建構函數參數、惰性佈局與 ListView/GridView、Canvas 與 CustomPainter、導航組合與 Navigator、Remember 與 StatefulWidget 等等。我們也會將您更廣泛的 Android 背景知識（視圖、生命週期、資源、Intent、後台工作）與 Flutter 中的對應概念聯繫起來，讓您的學習過程更像是橫向移動而不是向上攀登。

從 Jetpack Compose 到 Flutter：你的技能如何遷移

Flutter 是 Google 的 UI 框架，用於使用 Dart 語言建立跨平台應用程式；而 Jetpack Compose 是 Google 的現代 UI 工具包，用於使用 Kotlin 建立原生 Android 應用程式。 從底層來看，它們針對的是不同的執行環境，但從架構上看，它們共享著同一個大理念：將 UI 描述為狀態的函數，讓框架來決定何時以及如何重新繪製。

在 Jetpack Compose 中，你考慮的是可組合函數、修飾符和重新組合；在 Flutter 中，你考慮的是元件、建構子參數和重新建構。 儘管名稱不同，但行為卻驚人地相似：你建立一個 UI 元素樹，每個節點都是不可變的，當狀態改變時，框架會再次遍歷這棵樹以產生更新後的介面。

一個關鍵差異在於，Flutter 從設計初就具備跨平台特性。 同一套 Dart 程式碼庫可以適用於 Android、iOS、Web、Windows、macOS 和 Linux 平台。 Compose 正在擴展到 Android 以外的領域（例如 Compose Multiplatform），但 Flutter 的多裝置支援目前更加成熟和完善，這正是許多以 Android 為先的團隊在想要發布 iOS 或桌面應用程式時會考慮 Flutter 的原因。

您對 Android 平臺本身的了解在 Flutter 專案中仍然非常有價值。 雖然 UI 層完全由 Dart 和元件構成，但 Flutter 依賴 Android（以及 iOS）來獲取權限、系統配置、平台 API、通知、後台運行以及許多其他功能，這些功能透過插件和平台通道存取。這意味著你對 Android 行為模式累積的所有經驗都不會白費——它只是被轉移到了更底層。

聲明式 UI 模型：可組合元件與小工具

Jetpack Compose 和 Flutter 都實作了宣告式 UI 模型：你描述的是在給定狀態下 UI 應該是什麼樣子，而不是「如何」逐步改變視圖。 與其在視圖上呼叫 setter，不如在狀態改變時重建視圖樹，讓框架有效率地進行差異比較和重繪。

在 Jetpack Compose 中，UI 元素是具有註解的可組合函數。 @Composable通常配置為 Modifier. 按鈕可能是 Button(onClick = ..., modifier = Modifier.padding(16.dp))修飾符鏈裝飾或佈局可組合對象，而不改變其底層類型，而 Compose 使用重新組合來僅刷新樹中輸入發生變化的部分。

在 Flutter 中，UI 元素是 widgets——描述配置的普通 Dart 物件。 它們也是不可變的，並且以樹狀結構排列，但通常情況下，你不是傳遞修飾符，而是直接透過建構函數參數傳遞佈局或樣式參數，或將一個控制項包裝在其他佈局控制項中。例如，你可能會這樣寫： Padding(padding: EdgeInsets.all(16), child: ElevatedButton(...)) 以達到類似的結果。

可組合組件和控制的生命週期都刻意設計得短暫且不可變。 它們只在新輸入需要替換時才會存在；它們都不會嘗試管理自身的生命週期或直接進行自我修改。這與舊版 Android View 的概念截然不同，在舊版 Android View 中，視圖是長期存在的對象，可以隨著時間的推移而被重複使用和修改。正因如此，你在 Flutter 中使用 Compose 的方式才會感覺如此自然。

從本質上講，這兩個框架的佈局都遵循相同的父元素驅動、基於約束的模式。 父組件測量自身尺寸，並將約束條件傳遞給子組件，子組件根據這些約束條件選擇合適的尺寸，然後父組件定位子組件。在 Flutter 中，你會看到這個過程直接以以下方式呈現： BoxConstraints在 Compose 中，這是透過 MeasurePolicy 實作來處理的。在這兩種情況下，父元件都可以限制子元件－元件不能隨意選擇大小或位置。

應用架構：入口點、鷹架和佈局

在 Android 上使用 Compose 時，您的入口點通常是 Activity （通常是 ComponentActivity）你打電話的地方 setContent 用於託管您的可組合檔案。 從那裡開始，建立可組合樹，通常從一個…開始 MaterialTheme 以及定義您整體佈局的表面或框架。

在 Flutter 中，入口點是 Dart。 main 呼叫函數 runApp 使用應用程式的根組件。 那個根通常是 MaterialApp or WidgetsApp 小部件，用於設定路由、主題、本地化和基本導航器。您顯示的第一個“螢幕”通常使用一個 Scaffold 小部件的作用與此非常相似 Scaffold 在 Material 3 Compose 中：它提供了應用程式列、主體、浮動操作按鈕、抽屜等等。

對於簡單的文字和靜態內容，Compose 可能會預設將內容包裹起來，使大小與內容本身相匹配，而許多 Flutter 小部件預設會佔用更多可用空間，除非受到限制。 例如，如果你放置一個 Text 即使它位於列內，也不會自動填充寬度。在 Flutter 中， Text 裡面 Column 根據父元素的約束條件，其行為可能有所不同。要在 Flutter 中居中內容，通常需要將元素包裹在 `<div>` 標籤中。 Center 元件，或使用佈局元件，例如 Align, Row, Column以及 Expanded 結合對齊屬性。

線性佈局幾乎完美映射：Compose 有 Row 以及 ColumnFlutter也是如此。 在 Flutter 中，你將 children 作為參數傳遞。 List<Widget> 並使用諸如以下屬性控制間距和對齊方式 MainAxisAlignment 以及 CrossAxisAlignment在 Compose 中，您依賴於 horizontalArrangement, verticalArrangement, horizontalAlignment 以及 verticalAlignment一個有用的思考方式是：以「Arrangement」結尾的屬性對應到 Flutter 的主軸，而以「Alignment」結尾的屬性對應到交叉軸。

當您需要相對或重疊佈局時，這些方法在概念上也是一致的。 在 Android XML 中，您可能會用到 RelativeLayout 或嵌套混合 LinearLayout 以及 FrameLayout在 Compose 中，您可以進行創作 Row, Column 以及 Box （或編寫自訂佈局）。在 Flutter 中，類似的操作是… Row, Column 以及 Stack 結合定位子元素和對齊選項，您排列元素之間關係的思維模式幾乎不會改變。

按鈕、輸入和交互

在 Jetpack Compose 中，建置按鈕通常意味著使用 Button 或其 Material 變體之一，在 Material 3 下，該變體解析為一個特定的實現，例如 FilledTonalButton. 您提供 onClick lambda 表達式和可選樣式，通常透過參數來實現，例如 colors 或使用修飾符來調整內邊距、寬度和對齊方式。

在 Flutter 中，等效的做法是使用類似這樣的元件： FilledButton, ElevatedButton, TextButton or OutlinedButton. 每人要花一個時間 onPressed 回調和 child 小部件－通常是 Text您可以透過傳遞參數來自訂它們。 style 通過 ButtonStyle 或使用全域主題覆蓋，您可以集中調整整個按鈕系列的顏色、形狀、高度和大小。

為了處理手勢，Compose 依賴修飾符，例如 Modifier.clickable 很多情況下都可以，但必要時也可以使用專門的手勢偵測器。 長按、拖曳和自訂手勢通常是透過專用的修飾符 API 和互動來源來構成的。

Flutter 公開了一個明確的 GestureDetector 一個可以包裹在任何沒有內建手勢支援的應用程式上的小部件。 它提供多種回調方式： onTap, onDoubleTap, onLongPress, onVerticalDragStart, onVerticalDragUpdate, onHorizontalDragEnd 以及其他許多小部件，例如 ElevatedButton 已經暴露出來 onPressed 屬性，但對於完全自訂的 UI 元素，您可以使用 GestureDetector 或更高層級的元件，例如 InkWell 用於材料漣漪回饋。

Flutter 中的文字輸入是透過以下方式管理的： TextField or TextFormField其風格與 Compose 的風格相似 TextField 以及 OutlinedTextField 可組合性。 您可以使用以下方式設定提示、標籤、錯誤和邊框： InputDecoration 類似於你使用的方式 TextFieldDefaults 或在 Compose 文字欄位中使用參數。與 Compose 類似，通常透過更改狀態並重建裝飾器來響應式地顯示錯誤訊息，而不是手動操作視圖。

清單、網格和捲動內容

Jetpack Compose 為清單提供了兩種主要策略：簡單策略和簡單策略。 Column/Row 對於小型集合，可以使用迭代法； LazyColumn/LazyRow/LazyVerticalGrid/LazyHorizontalGrid 適用於大型或動態清單。 惰性容器只組合可見的內容，這樣在處理數千個項目時可以保持較高的效能。

Flutter 也採用了類似的小尺寸與大尺寸的設計方法，但使用了不同的組件。 對於一個可以完整顯示在螢幕上的小型列表，你可以直接使用 Column 並將你的數據映射到 children對於任何可以滾動的東西，你都會伸手去拿 ListView or GridView，並採用建構器建構函數，僅在需要時才延遲建立子元件。

Flutter 中的常見模式是 ListView.builder這與 Compose 的惰性列表項目 DSL 相呼應。 您提供 itemCount 和 itemBuilder 回調函數；Flutter 呼叫該建構器，並傳入一個從 0 到 的索引。 itemCount - 1 每當有新項目進入視圖時。在建構器中，您可以返回幾乎任何小部件——從簡單的 ListTile 使用文字和圖示來建立複雜的自訂清單行。

對於網格，Compose 的 LazyVerticalGrid 以及 LazyHorizontalGrid 映射到 Flutter 的 GridView 小部件。 Flutter 通常不會直接將列數傳遞給網格，而是使用代理，例如： SliverGridDelegateWithFixedCrossAxisCount or SliverGridDelegateWithMaxCrossAxisExtent 用於控制單元格的佈局方式。這些委託封裝了諸如“列數”或“最大單元格寬度”之類的規則，其理念與您在“組合”中使用的網格大小參數類似。

兩種工具包的滾動行為也類似。 Compose 的惰性列表內建了滾動功能；你不需要將它們包裹在額外的滾動容器中。在 Flutter 中，許多列表和網格組件本身就是可滾動的，但對於需要滾動的單一、非重複內容，你可以使用 SingleChildScrollView建立自訂可捲動頁面就變成了嵌套或組合 sliver 以適應更高級的用例。

自適應和響應式使用者介面模式

Compose 為您提供了多種響應式設計策略：自訂佈局、 BoxWithConstraints, WindowSizeClass 以及 Material 3 自適應函式庫。 這些功能可以根據可用空間、姿勢和設備類別來改變您的構圖，並且您可以根據專案的複雜性將它們混合使用。

Flutter 並沒有試圖直接模仿這些 API，但其基本想法是相同的：檢查約束和螢幕特徵，然後分支你的佈局。 兩種主要工具是 LayoutBuilder 以及 MediaQuery. LayoutBuilder 通行證 BoxConstraints 向下移動，以便您可以交換或重新排列超過特定寬度或高度的小部件。 MediaQuery 顯示螢幕尺寸、方向、邊距和像素密度等進階斷點資訊。

與其追求 Compose 的自適應解決方案與 Flutter 的解決方案一一對應，不如根據你的設計需求來思考，這樣更有效。 一旦您了解了您的 UI 應該如何在手機、平板電腦和桌上型電腦上進行自適應，您就可以透過 Compose 的以下方式表達該邏輯： WindowSizeClass 以及自適應佈局或 Flutter 的約束驅動和媒體驅動分支。相同的設計理念—不同的 API。

狀態管理：記住 StatefulWidget 與其他狀態管理方式的差異及其他

Jetpack Compose 使用以下方式儲存臨時 UI 狀態 remember 以及像州持有者這樣的 mutableStateOf，經常與 ViewModel 以及用於實現更持久狀態的架構組件。 當狀態改變時，會發生重組，相關的可組合元素會獲得新的值。

Flutter 的底層狀態故事圍繞著… StatefulWidget 及其相關的 State 目的。 您可以透過擴充來定義一個需要保存狀態的小工具。 StatefulWidget然後實施一個單獨的 State<MyWidget> 用於儲存可變字段的類別。每當您更新這些欄位時，您都會呼叫它。 setState()這會將組件樹的該部分標記為已修改，並觸發重建。在這個層面上，它與儲存 Compose 狀態非常相似。 remember 當值發生變化時，使可組合物件失效。

對於更複雜的應用程序，Flutter 大量依賴社區和第一方模式： ProviderRiverpod、Bloc、Redux 風格的商店等等。 這些元件相當於 Android 架構棧：ViewModel + LiveData/Flow + Compose 專案中的儲存庫。它們集中管理業務邏輯，並公開驅動元件重建的響應式資料流。如果您有 Compose 的經驗，即使 API 有所不同，您也會發現其中許多模式似曾相識。

Android 開發人員經常感到驚訝的一點是，Flutter 中的無狀態和有狀態元件都會頻繁重建——在動畫期間甚至可能每一幀都會重建。 差別不在於重建頻率，而是可變狀態的儲存位置： StatefulWidget 給你一個伴侶 State 重建後仍然存在的對象，就像… remember 允許值在 Compose 中重新組合後仍然存在。

繪畫、動畫和視覺潤飾

如果你曾經直接使用過 Android 系統… Canvas 以及 Drawable，Compose的 Canvas 可組合性可能讓人感覺很簡單。 它提供了一種在 Kotlin 中繪製形狀、圖像和文字的聲明式方法，隱藏了傳統自訂視圖中許多繁瑣的命令式操作。

Flutter 透過以下方式提供了一個類似的繪圖介面： Canvas API，可透過以下方式存取 CustomPaint 以及 CustomPainter. 你實施了一個 CustomPainter 重寫的類別 paint 使用以下方法在畫布上繪製： Paint 物件、路徑、變換等等。然後，將該繪製器附加到 CustomPaint 小部件。 Compose 和 Flutter 的底層都依賴 Skia 引擎，因此基本元素——線條、路徑、著色器——與 Android 的 2D 渲染非常相似。

對於動畫，Flutter 依賴一個圍繞其構建的顯式動畫系統。 AnimationController, Animation<T> 還有 Tweens，以及豐富的動畫組件。 您實例化一個控制器（通常使用） SingleTickerProviderStateMixin 對於垂直同步），定義將 0-1 進度對應到域值的 CurvedAnimations 或 Tweens，然後將它們連接到諸如 FadeTransition, ScaleTransition, AnimatedBuilder 或隱式組件，例如 AnimatedContainer動畫系統也展現了 AnimationStatus 回調函數用於回應開始、完成或反轉。

Jetpack Compose 的動畫 API 從上到下都是宣告式的，包含諸如以下函數： animate*AsState轉場效果和動畫可見性。 大多數情況下，無需手動管理控制器，只需描述目標狀態，框架即可隨時間自動驅動插值。如果需要更精細的控制，您仍然可以存取底層原語，但通常的方法比傳統的 Android XML 或命令式動畫程式碼更簡潔。

從概念上講，這兩個工具包的使用方式相同：保持組件/可組合組件輕量且純粹，透過它們推送隨時間變化的值，並讓框架處理插值和失效。 作為 Compose 開發者，Flutter 的額外明確性… AnimationController 起初可能會感覺有點老派，但它能讓你對時間、曲線和編曲進行非常精細的控制。

樣式、主題、字體和素材

現代應用程式的成敗取決於其外觀設計，因此 Flutter 和 Compose 都非常重視主題和樣式。 組合用途 MaterialTheme 透過配色方案、字體和形狀定義，您可以嵌套主題來覆蓋子樹的值，包括強制特定區域使用淺色或深色表面。

在 Flutter 中，等效項是 ThemeData 傳遞給 MaterialApp or Theme 小部件。 您可以定義主色、亮度、字體和組件特定的主題，例如 elevatedButtonTheme, textButtonTheme, appBarTheme 還有更多功能。您可以透過將子樹包裝起來，在本地覆蓋主題。 Theme 複製父組件並調整某些欄位的小部件。可以透過提供以下資訊在應用程式層級切換淺色和深色模式： theme 以及 darkTheme 並控制 themeMode.

文字樣式是大家熟悉的領域：在 Compose 中，您可以直接傳遞簡單的屬性到 Text 或提供 TextStyle 目的。 Flutter 也透過這種方式實現了這一點。 Text 接受以下參數的小部件 TextStyle 通過其 style 參數。 TextStyle 涵蓋字體系列、字號、字重、字間距、行高、裝飾等。您可以在其中定義全域文字主題。 ThemeData.textTheme 並像使用字體排印一樣，在各處引用它們。 MaterialTheme 在 Compose 中。

字體和圖像是透過資源而不是 Android 的傳統方式來管理的。 /res 目錄樹。 Flutter 不強制要求特定的資料夾佈局；你可以在其中聲明資源。 pubspec.yaml 然後從程式碼中引用它們。圖像通常以以下方式載入： Image.asset()從而根據以下條件解析到正確的密度桶： devicePixelRatio邏輯像素的作用與…相同 dp 在安卓系統上，物理像素密度被抽象化了。

對於自訂字體，Compose 允許您打包字體資源，或在運行時透過 Google Fonts 等提供者取得字體資源，然後將其連接到… FontFamily 以及排版。 Flutter 也採用了幾乎相同的模式：將字體檔案放在 assets 資料夾中，並在其中列出它們。 pubspec.yaml然後按名稱引用字體系列。 TextStyle如果您需要運行時獲取的字體，這裡有一個常用的方法。 google_fonts 插件，用於公開以字體命名的 Dart 函數—例如 GoogleFonts.robotoTextTheme()—快速將它們整合到您的主題中。

這兩個生態系統都將字串和本地化視為首要考慮因素，儘管 Flutter 沒有與 Android 的 XML 字串資源直接對應的功能。 相反，最佳實踐是將翻譯保留在… .arb 文件並將其與 Flutter 本地化工具鏈連接起來。然後透過生成的 Dart 類別進行訪問，這與使用類似。 R.string Android 程式碼中的識別碼。

透過 Flutter 視角看 Android 平台概念

除了 UI 之外，Compose 開發人員面臨的最大問題之一是，他們的 Android 知識如何對應到 Flutter 的架構。 幸運的是，許多核心概念——活動、生命週期、意圖、後台工作、資源、網路——都有清晰的對應物，即使表面 API 看起來有所不同。

在安卓系統中， Activity 以及 Fragment 是你的主要螢幕和容器；在 Flutter 中，一切皆為組件，導航通過它們進行。 Navigator 以及 Route 對象。 路由大致對應於一個活動或片段，但通常只有一個託管伺服器。 Activity 在嵌入了 Flutter 引擎的 Android 裝置上，您可以透過在 Navigator 堆疊中定義的命名路由來推送和彈出路由。 MaterialApp 或透過直接建造 PageRoute 例如 MaterialPageRoute.

Android 的生命週期回檔（onCreate, onStart, onResume等等）在 Flutter 程式碼中沒有一對一的鉤子，但您可以使用它們來觀察應用程式的生命週期。 WidgetsBindingObserver. 它暴露了諸如此類的狀態 resumed, inactive, paused 以及 detached這大致對應於 Android 的可見、背景和銷毀階段。當確實需要用於資源管理的底層生命週期鉤子時，通常會在原生 Android 端實現它們。 FlutterActivity 或是一個插件，但不是 Dart 語言編寫的。

Intent 在 Android 系統中扮演兩個角色：應用程式內導航和跨應用程式通訊。 如前所述，Flutter 沒有基於 intent 的導航 API——Navigator 在 Dart 世界中完全取代了它。對於跨應用程式任務（例如啟動相機、檔案選擇器、處理分享 intent），通常需要使用封裝了必要 Android（和 iOS）呼叫的插件。如果沒有現成的插件，您可以使用 MethodChannels 編寫自己的插件，在 Dart 和原生程式碼之間進行通信，並將 intent 和結果作為訊息轉發。

你對後台工作和線程的理解也會遷移過來，但基本原理看起來有所不同。 Android 鼓勵你使用協程、AsyncTask（舊版）、WorkManager、JobScheduler、RxJava 等工具將網路和磁碟 I/O 操作移出主執行緒。相較之下，Dart 為每個隔離區使用單執行緒事件循環，使用 async/await 處理 I/O 操作，並為 CPU 密集型任務建立單獨的隔離區。對於任何 I/O 密集型操作，只需標記你的函數即可。 async, await 操作並讓事件循環保持 UI 的響應性；對於 CPU 密集型任務，您可以啟動隔離區並透過訊息傳遞而不是共享記憶體進行通訊。

在網路方面，Flutter 的流行之處在於 http 該軟體包在基本用例中扮演著類似於 OkHttp + Retrofit 的角色。 它隱藏了許多底層套接字操作，並與 async/await 自然整合。對於更複雜的需求，您可以升級到類似這樣的軟體包。 dio但基本模式依然不變：發起非同步調用，等待結果，然後用…更新狀態 setState() 或使用您選擇的狀態管理器，並重建受影響的小工具。

插件、儲存、Firebase 和工具

在 Android 開發中，你習慣在 Gradle 中聲明依賴項；在 Flutter 中，你需要在 [此處應填寫 Flutter 的檔案名稱] 中聲明它們。 pubspec.yaml 並從 pub.dev 取得它們。 Gradle 檔案位於 android/ Flutter 專案的資料夾主要用於平台特定的集成，或者當您需要自訂原生程式庫時——日常應用程式開發仍然在 Dart 領域進行。

Shared preferences 和 SQLite 也有現成的等效項。 Android 提供 SharedPreferences Flutter 透過外掛程式封裝了小型鍵值儲存和 SQLite（或 Room）等儲存設備，用於儲存結構化資料。 shared_preferences 以及 sqflite這些外掛程式統一了 Android 和 iOS 的行為，因此無論平台如何，您都可以使用單一 Dart API，同時仍依賴底層原生實作。

Firebase 整合同樣簡單易用，而且非常出色。 大多數 Firebase 服務——包括身份驗證、Firestore、即時資料庫、雲端訊息、分析、遠端配置等等——都有由 Firebase 和 Flutter 團隊維護的官方 Flutter 外掛程式。這些外掛程式借鑒了 Android Firebase SDK 的概念模型，但採用了 Dart 慣用的 API。對於 Firebase 未直接涵蓋的更細分的功能，pub.dev 上也提供了豐富的第三方插件生態系統。

對於除錯和效能分析，Flutter 的 DevTools 套件提供了一個功能豐富的工具箱，可以直接與 Android Studio 的效能分析器和佈局檢查器相媲美。 您可以檢查組件樹、追蹤重新建置、監控記憶體分配、診斷記憶體洩漏和碎片化問題，並單步執行 Dart 程式碼。結合 Android Studio 和 VS Code 中的 IDE 支援、熱重載和熱重啟功能，Flutter 開發的回饋週期至少與您使用 Compose 時一樣緊密，甚至通常更緊密。

推播通知是 Android 系統的另一個常見問題，在 Flutter 中，推播通知是透過外掛程式來處理的，例如 firebase_messaging. 底層，這些元件會與 Firebase 雲端訊息傳遞以及 Android 和 iOS 的原生通知框架進行通信，但您的應用程式邏輯運行在一個統一的 Dart API 中。配置和平台特定的行為（例如 Android 上的通知管道）仍然非常重要，您先前在這些平台細節方面的經驗仍然具有很高的參考價值。

即使是無法完全用 Flutter 實現的 Android 主螢幕小部件，仍然可以與 Flutter 程式碼整合。 通常情況下，您可以使用 Jetpack Glance 或 XML 佈局來建立它們，然後使用諸如此類的軟體包。 home_widget 為了與 Flutter 應用程式通訊、共享數據，甚至將柵格化的 Flutter UI 作為圖像嵌入到原生元件中，這種混合方法讓您能夠在遵守平台限制的同時，保持 Flutter 的核心體驗。

縱觀所有這些相似之處，Jetpack Compose 開發人員轉而學習 Flutter 並非從零開始。 你對聲明式 UI、Android 生命週期、導航、狀態、資源和非同步工作的理解可以非常自然地應用到 Flutter 的世界；最大的變化在於名稱、語言（Dart）和跨平台思維。一旦你了解 widgets 和 Navigator 這些基礎概念，其餘部分就會很快上手。