在應用程式中新增 Jetpack Compose

透過集合功能整理內容 你可以依據偏好儲存及分類內容。

如果您想在現有專案中使用 Jetpack Compose,就必須使用必要的設定和依附元件來設定專案。

設定開發環境

安裝正確的 Android Studio 版本

為了在使用 Jetpack Compose 進行開發時享有最佳體驗,請下載 Android Studio,並設定與 Android Studio 版本對應的 Android Gradle 外掛程式:

buildscript {
    ...
    dependencies {
        classpath "com.android.tools.build:gradle:7.3.0"
        ...
    }
}

設定 Kotlin

請確認您在專案中使用的是 Kotlin 1.7.20:

plugins {
    id 'kotlin-android'
}

設定 Gradle

您必須將應用程式的最低 API 級別設為 21 以上、在應用程式的 build.gradle 檔案中啟用 Jetpack Compose,並新增程式庫依附元件 (如快速入門指南所示)。

在 Compose 中重複使用 View 主題

如果您剛剛才在專案中加入 Compose,可能會希望讓 Compose 沿用 View 系統提供的主題,而非從頭開始撰寫質感主題。

如果您在 Android 應用程式中使用 MDC 程式庫,可以利用 MDC Compose Theme Adapter 程式庫,在可組合項目中重複使用以 View 為基礎的現有主題顏色、字體排版和形狀主題設定。只要使用 MdcTheme API 即可進行這項作業。

如果您要改為採用 AppCompat XML 主題,請使用內含 AppCompatTheme API 的 AppCompat Compose Theme Adapter

在應用程式的 build.gradle 檔案中加入所需依附元件,如下所示:

dependencies {
    // When using a MDC theme
    implementation "com.google.android.material:compose-theme-adapter:1.1.16"

    // When using a AppCompat theme
    implementation "com.google.accompanist:accompanist-appcompat-theme:0.25.1"
}

開始遷移至 Compose

請參閱遷移策略,瞭解如何開始遷移至 Compose。接著,您可以瞭解如何以安全的方式逐步將 Compose 導入到程式碼集中。

如需 ComposeView 和其他互通性 API 的詳細資訊,請參閱 Interoperability API 指南。如要進一步瞭解 Compose 中的其他資源 API,請參閱 Compose 中的資源指南

測試混合的 Compose/View 使用者介面

將應用程式的各個部分遷移至 Compose 後,請務必進行測試,以確保沒有任何內容遭到毀損。

當活動或片段使用 Compose (而不是使用 ActivityScenarioRule) 時,您必須使用 createAndroidComposeRule 以整合 ActivityScenarioRuleComposeTestRule,藉此同時測試 Compose 和 View 程式碼。

class MyActivityTest {
    @Rule
    @JvmField
    val composeTestRule = createAndroidComposeRule<MyActivity>()

    @Test
    fun testGreeting() {
        val greeting = InstrumentationRegistry.getInstrumentation()
            .targetContext.resources.getString(R.string.greeting)

        composeTestRule.onNodeWithText(greeting).assertIsDisplayed()
    }
}

如要進一步瞭解測試方式以及與 Espresso 的互通性,請參閱測試 Compose 版面配置指南

如果您在應用程式中使用導覽元件,請參閱使用 Compose 進行導覽指南的互通性一節

後續步驟

如要進一步瞭解 Compose,請前往說明文件索引。您可以透過不同方式在應用程式中採用 Compose,詳情請參閱在您的應用程式中採用 Compose 指南,您也可以透過這篇文章連結至其他指南,例如「在現有架構中的 Compose」以及「在現有 UI 中的 Compose」。