Menambahkan Jetpack Compose ke aplikasi Anda

Jika ingin menggunakan Jetpack Compose dalam project yang sudah ada, Anda harus mengonfigurasi project dengan setelan dan dependensi yang diperlukan.

Menyiapkan lingkungan pengembangan

Menginstal versi Android Studio yang tepat

Untuk pengalaman terbaik dalam mengembangkan aplikasi dengan Jetpack Compose, Anda harus mendownload Android Studio, dan mengonfigurasi Plugin Android Gradle yang sesuai dengan versi Android Studio:

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

Mengonfigurasi Kotlin

Pastikan Anda menggunakan Kotlin 1.8.10 dalam project:

plugins {
    id 'kotlin-android'
}

Mengonfigurasi Gradle

Anda perlu menetapkan API level minimum aplikasi ke 21 atau yang lebih tinggi, mengaktifkan Jetpack Compose dalam file build.gradle aplikasi, dan menambahkan dependensi library, seperti yang ditunjukkan pada panduan Mulai cepat.

Menggunakan kembali tema View di Compose

Jika baru saja menambahkan Compose ke project, Anda mungkin ingin Compose menggunakan kembali tema yang tersedia di sistem View, bukan menulis ulang tema Material Anda sendiri di Compose dari awal.

Jika menggunakan library MDC di aplikasi Android, library MDC Compose Theme Adapter memungkinkan Anda menggunakan kembali tema warna, tipografi, dan bentuk dari tema berbasis View yang ada dalam composable. Hal itu tercapai dengan menggunakan MdcTheme API.

Jika Anda menggunakan tema XML AppCompat, gunakan Adaptor Tema AppCompat Compose yang berisi AppCompatTheme API.

Sertakan dependensi yang Anda butuhkan dalam file build.gradle aplikasi, seperti yang ditunjukkan di bawah ini:

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.28.0"
}

Memulai migrasi ke Compose

Lihat Strategi migrasi untuk mendapatkan panduan tentang cara memulai migrasi Anda ke Compose. Di sana, pelajari cara memperkenalkan Compose dengan aman dan bertahap ke dalam codebase Anda.

Untuk informasi selengkapnya tentang ComposeView dan API interoperabilitas lainnya, lihat panduan API Interoperabilitas. Untuk mempelajari lebih lanjut API resource lainnya di Compose, lihat panduan Resource di Compose.

Menguji UI Compose/Views campuran

Setelah memigrasikan bagian aplikasi ke Compose, pengujian sangat penting dilakukan untuk memastikan Anda tidak merusak apa pun.

Saat aktivitas atau fragmen menggunakan Compose, daripada menggunakan ActivityScenarioRule, Anda harus menggunakan createAndroidComposeRule yang mengintegrasikan ActivityScenarioRule dengan ComposeTestRule yang memungkinkan Anda menguji kode Compose dan View secara bersamaan.

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()
    }
}
AddingComposeToYourAppSnippets.kt

Lihat panduan Menguji tata letak Compose Anda untuk mempelajari pengujian dan interoperabilitas dengan Espresso lebih lanjut.

Jika Anda menggunakan Komponen Navigation di aplikasi, lihat bagian Interoperabilitas panduan Menavigasi dengan Compose.

Langkah berikutnya

Informasi selengkapnya tentang Compose dapat ditemukan di indeks dokumentasi. Ada berbagai pendekatan untuk mengadopsi Compose di aplikasi, pelajari lebih lanjut di Panduan Mengadopsi Compose di aplikasi Anda yang juga terhubung ke panduan lain seperti Compose di arsitektur yang sudah ada dan Compose di UI yang sudah ada.