Menggunakan Jetpack Compose di Wear OS

Compose untuk Wear OS mirip dengan Compose untuk seluler. Namun, ada beberapa perbedaan utama. Panduan ini membimbing Anda untuk mengetahui beberapa kesamaan dan perbedaan.

Compose untuk Wear OS adalah bagian dari Android Jetpack, dan seperti library Wear Jetpack lainnya yang Anda gunakan, fitur ini membantu Anda menulis kode yang lebih baik dengan lebih cepat. Ini adalah pendekatan yang kami rekomendasikan untuk membuat antarmuka pengguna untuk aplikasi Wear OS.

Jika Anda tidak terbiasa menggunakan toolkit Jetpack Compose, lihat jalur Compose. Banyak prinsip pengembangan untuk Compose seluler juga berlaku untuk Compose untuk Wear OS. Lihat Mengapa Compose untuk informasi selengkapnya tentang keuntungan umum framework UI deklaratif. Agar dapat mempelajari Compose untuk Wear OS lebih lanjut, lihat Jalur Compose untuk Wear OS dan repositori contoh Wear OS di GitHub.

Kompatibilitas

Compose untuk Wear OS berfungsi di smartwatch yang mendukung Wear OS 3.0 (Level API 30) dan smartwatch yang menggunakan Wear OS 2.0 (Level API 25 dan versi lebih baru). Penggunaan versi 1.0 Compose untuk Wear OS memerlukan penggunaan library androidx.compose versi 1.2 dan Kotlin 1.7.0.

Platform

Compose untuk Wear OS memudahkan pembuatan aplikasi di Wear OS. Untuk informasi selengkapnya, lihat Aplikasi. Gunakan komponen bawaan kami untuk menciptakan pengalaman pengguna yang sesuai dengan panduan Wear OS. Untuk informasi selengkapnya tentang komponen, lihat panduan desain kami.

Menyiapkan

Menggunakan Jetpack Compose dengan Wear OS mirip dengan menggunakan Jetpack Compose untuk project Android lainnya. Perbedaan utamanya adalah Jetpack Compose untuk Wear menambahkan library khusus Wear yang mempermudah pembuatan antarmuka pengguna yang disesuaikan untuk smartwatch. Terkadang, komponen tersebut memiliki nama yang sama dengan komponen bukan Wear, seperti androidx.wear.compose.material.Button dan androidx.compose.material.Button.

Membuat aplikasi baru di Android Studio

Untuk membuat project baru yang menyertakan Jetpack Compose, lakukan langkah berikut:

  1. Jika baru memulai di jendela Welcome to Android Studio, klik Start a new Android Studio project. Jika sudah membuka project Android Studio, pilih File > New > Import Sample dari panel menu.
  2. Telusuri Compose for Wear lalu pilih Compose for Wear OS Starter.
  3. Di jendela Configure your project, lakukan langkah berikut:
    1. Setel Application name.
    2. Pilih Project location untuk contoh.
  4. Klik Finish.
  5. Pastikan file build.gradle project sudah dikonfigurasi dengan benar, seperti yang dijelaskan dalam file properti Gradle.

Sekarang, Anda pun siap memulai pengembangan aplikasi menggunakan Compose untuk Wear OS.

Dependensi toolkit Jetpack Compose

Untuk menggunakan Jetpack Compose dengan Wear OS, Anda harus menyertakan dependensi toolkit Jetpack Compose dalam file build.gradle aplikasi, seperti yang ditampilkan pada cuplikan berikut:

Kotlin

dependencies {

    val composeBom = platform("androidx.compose:compose-bom:2024.09.00")

    // General compose dependencies
    implementation(composeBom)
    implementation("androidx.activity:activity-compose:1.9.2")
    implementation("androidx.compose.ui:ui-tooling-preview:1.7.1")
    // Other compose dependencies

    // Compose for Wear OS Dependencies
    implementation("androidx.wear.compose:compose-material:1.4.0")

    // Foundation is additive, so you can use the mobile version in your Wear OS app.
    implementation("androidx.wear.compose:compose-foundation:1.4.0")

    // Wear OS preview annotations
    implementation("androidx.wear.compose:compose-ui-tooling:1.4.0")

    // If you are using Compose Navigation, use the Wear OS version (NOT THE MOBILE VERSION).
    // Uncomment the line below and update the version number.
    // implementation("androidx.wear.compose:compose-navigation:1.4.0")

    // Testing
    testImplementation("junit:junit:4.13.2")
    androidTestImplementation("androidx.test.ext:junit:1.1.3")
    androidTestImplementation("androidx.test.espresso:espresso-core:3.4.0")
    androidTestImplementation("androidx.compose.ui:ui-test-junit4:1.0.3")
    debugImplementation("androidx.compose.ui:ui-tooling:1.0.3")
}

Yang berbeda

Gunakan versi WearComposeMaterial API jika memungkinkan. Meskipun secara teknis dapat dilakukan, tetapi penggunaan Compose Material versi seluler tidak dioptimalkan untuk persyaratan unik Wear OS. Selain itu, menggabungkan Compose Material dengan Compose Material untuk Wear OS dapat menyebabkan perilaku yang tidak terduga. Misalnya, karena setiap library memiliki class MaterialTheme sendiri, ada kemungkinan warna, tipografi, atau bentuk menjadi tidak konsisten jika kedua versi tersebut digunakan.

Tabel berikut menguraikan perbedaan dependensi antara Wear OS dan Seluler:

Dependensi Wear OS

(androidx.wear.*)

Perbandingan Dependensi Perangkat Seluler

(androidx.*)

androidx.wear.compose:compose-material bukan androidx.compose.material:material
androidx.wear.compose:compose-navigation bukan androidx.navigation:navigation-compose
androidx.wear.compose:compose-foundation selain juga androidx.compose.foundation:foundation

Berikut adalah contoh file build.gradle:

// Example project in app/build.gradle file
dependencies {
    // Standard Compose dependencies...

    // Wear specific Compose Dependencies
    implementation "androidx.wear.compose:compose-material:$rootProject.wearVersion"
    implementation "androidx.wear.compose:compose-foundation:$rootProject.wearVersion"

    // For navigation within your app...
    implementation "androidx.wear.compose:compose-navigation:$rootProject.wearVersion"

    // Other dependencies...
}

Masukan

Coba Compose untuk Wear OS dan gunakan issue tracker untuk memberikan saran dan masukan.

Bergabunglah dengan channel #compose-wear di Kotlin Slack untuk terhubung dengan komunitas developer, dan beri tahu kami pengalaman Anda.