Jetpack Compose 是建構原生 Android UI 的新型工具包。本文件提供 Compose 最新資訊。
Foundation
- Compose 的使用思維:瞭解 Compose 宣告方法與先前以 View 為基礎的方法有哪些不同,並學習 Compose 的建構思維。
- 管理狀態:瞭解如何在 Compose 應用程式中設定及使用狀態。
- 可組合項的生命週期:瞭解可組合項的生命週期,以及 Compose 如何判斷是否需要重新繪製。
- 修飾符:瞭解如何使用修飾符增強或裝飾可組合項。
- Compose 中的副作用:瞭解管理副作用的最佳方式。
- Jetpack Compose 階段:瞭解需要完成哪些步驟才能讓 Compose 轉譯 UI,以及如何使用該資訊編寫有效的程式碼
- 架構分層:瞭解構成 Jetpack Compose 的架構層,以及傳達其設計的核心原則。
- 效能:瞭解如何避免可能影響應用程式效能的常見程式設計問題。
- Compose 中的語意:瞭解語意樹狀結構,這種結構的用途是無障礙服務和測試架構。
- 使用 CompositionLocal 的本機資料範圍:瞭解如何透過 Composition 使用
CompositionLocal
傳遞資料。
開發環境
- Android Studio 搭配 Compose:設定使用 Compose 的開發環境。
- Compose 適用的工具:瞭解 Android Studio 支援 Compose 的新功能。
- Compose 適用的 Kotlin:瞭解特定 Kotlin 慣用方法如何搭配 Compose 使用。
- 比較 Compose 和 View 指標:瞭解遷移至 Compose 對應用程式的 APK 大小和執行階段效能有何影響。
- 物料清單:只要指定 BOM 版本,即可管理所有 Compose 相依項目。
設計
- 版面配置:瞭解 Compose 的原生版面配置元件,以及如何設計自己的版面配置。
- 版面配置基本概念:瞭解直觀應用程式 UI 的建構模塊。
- Material Design 元件和版面配置:瞭解 Compose 中的 Material Design 元件和版面配置。
- 自訂版面配置:瞭解如何控管應用程式的版面配置,以及如何設計自己的自訂版面配置。
- 支援不同的螢幕大小:瞭解如何使用 Compose 建構能適應不同螢幕大小、方向和板型規格的版面配置。
- 對齊線條:瞭解如何建立自訂對齊線條,以精確對齊並定位 UI 元素。
- 內建函式測量:由於 Compose 僅允許您在每次傳遞中測量 UI 元素一次,因此本頁面說明如何先查詢子元素相關資訊,然後再進行測量。
- ConstraintLayout:瞭解如何在 Compose UI 中使用
ConstraintLayout
。
- 設計系統:瞭解如何導入設計系統,並讓應用程式擁有一致的外觀和風格。
- Material Design 3:瞭解如何使用 Compose 的 Material Design 3 實作方式導入 Material You。
- 從 Material 2 遷移至 Material 3:瞭解如何在 Compose 中將應用程式從 Material Design 2 遷移至 Material Design 3。
- Material Design 2:瞭解如何依據產品品牌的需求,自訂 Compose 的 Material Design 2 實作方式。
- 自訂設計系統:瞭解如何在 Compose 中導入自訂設計系統,以及如何調整現有的 Material Design 可組合項以因應這種情況。
- 主題剖析:瞭解
MaterialTheme
和自訂設計系統採用的較低階結構和 API。
- 清單和格線:瞭解 Compose 在管理和顯示資料清單與格線的一些選項。
- 文字:瞭解 Compose 的主要顯示及編輯文字選項。
- 圖形:瞭解 Compose 建構及使用自訂圖形的功能。
- 動畫:瞭解 Compose 的各種 UI 元素動畫選項。
- 手勢:瞭解如何建構 Compose UI,藉此偵測使用者的手勢,並與使用者互動。
- 處理使用者互動:瞭解 Compose 如何將低階輸入內容轉為較高階互動,以自訂元件對使用者動作做出的回應。
採用 Compose
- 遷移以 View 為基礎的現有應用程式:瞭解如何將以 View 為基礎的現有應用程式遷移至 Compose。
- Compose 和其他程式庫:瞭解如何在 Compose 內容中使用以 View 為基礎的程式庫。
- Compose 架構:瞭解如何在 Compose 中實作單向流程模式、如何實作事件和狀態容器,以及如何在 Compose 中使用
ViewModel
。 - Navigation:瞭解如何使用
NavController
,將 Navigation 元件與您的 Compose UI 整合。- 回應式 UI 導覽:瞭解如何設計應用程式導覽,以依照不同螢幕大小、方向和板型規格調整。
- 資源:瞭解如何在 Compose 程式碼中使用應用程式的資源。
- 無障礙設計:瞭解如何依照不同的無障礙需求調整 Compose UI。
- 測試:瞭解如何測試 Compose 程式碼。
- 測試一覽表:針對實用的 Compose 測試 API,提供快速參考資料。
其他資源
為您推薦
- 注意:系統會在 JavaScript 關閉時顯示連結文字
- 使用 CompositionLocal 的本機範圍資料
- 其他考量
- Compose 主題剖析