Menggunakan Jetpack Compose di Android TV

Compose untuk TV adalah pendekatan modern untuk mem-build antarmuka pengguna Android TV. Compose untuk TV membuka semua manfaat Jetpack Compose Android untuk aplikasi TV Anda, sehingga membuat pembuatan UI yang menarik dan fungsional untuk aplikasi Anda jauh lebih mudah.

Beberapa manfaat spesifik dari penggunaan Compose untuk TV mencakup hal berikut:

  • Fleksibilitas: Compose dapat digunakan untuk membuat jenis UI apa pun, mulai dari tata letak sederhana hingga animasi yang kompleks. Komponen berfungsi secara default, tetapi juga dapat disesuaikan dan diberi gaya agar sesuai dengan kebutuhan aplikasi Anda.
  • Pengembangan yang Disederhanakan & Dipercepat: Compose kompatibel dengan kode yang ada dan memungkinkan developer mem-build aplikasi dengan lebih efisien dengan lebih sedikit kode.
  • Intuitif: Compose menggunakan sintaksis deklaratif yang memungkinkan Anda membuat perubahan pada UI, men-debug, memahami, dan meninjau kode.

Jika Anda tidak terbiasa menggunakan toolkit Jetpack Compose, lihat jalur Compose. Banyak prinsip pengembangan untuk Compose seluler juga berlaku untuk TV. Lihat Alasan Compose untuk mengetahui informasi selengkapnya tentang keunggulan umum framework UI deklaratif. Untuk mempelajari selengkapnya, lihat juga repositori contoh Compose untuk TV di GitHub.

Pelajari cara menambahkan dukungan untuk Android TV

Perintah ini meminta panduan tentang cara menambahkan dukungan Android TV ke aplikasi Anda menggunakan Jetpack Compose untuk TV, bukan Leanback.

How do I add support for Android TV to my application?

Use Jetpack Compose for TV as part of the response instead of Leanback.

Menggunakan perintah AI

Perintah AI dimaksudkan untuk digunakan dalam Gemini di Android Studio (versi Canary terbaru diperlukan)

Pelajari Gemini di Studio lebih lanjut di sini: https://developer.android.com/studio/preview/gemini

Kompatibilitas

Compose untuk TV berfungsi di Android TV dengan Android 5.0 (API level 21) atau yang lebih tinggi. Menggunakan Compose versi 1.0 untuk TV memerlukan library androidx.compose versi 1.3.0 dan Kotlin 1.7.10.

Penyiapan

Menggunakan Jetpack Compose di Android TV mirip dengan menggunakan Jetpack Compose untuk project Android lainnya. Perbedaan utamanya adalah Compose untuk TV menambahkan library yang menawarkan komponen yang dioptimalkan untuk TV dan mempermudah pembuatan antarmuka pengguna yang disesuaikan untuk TV. Terkadang, komponen tersebut memiliki nama yang sama dengan komponen non-TV, seperti androidx.tv.material3.Button dan androidx.compose.material3.Button.

Dependensi toolkit Jetpack Compose

Untuk menggunakan Compose untuk TV, sertakan dependensi toolkit Jetpack Compose dalam file build.gradle aplikasi Anda sebagai berikut:

Kotlin

dependencies {
   val composeBom = platform("androidx.compose:compose-bom:2024.12.01")
   implementation(composeBom)

   // General compose dependencies.
   implementation("androidx.activity:activity-compose:1.9.2")

   implementation("androidx.compose.ui:ui-tooling-preview")
   debugImplementation("androidx.compose.ui:ui-tooling")

   // Compose for TV dependencies.
   implementation("androidx.tv:tv-material:1.0.0")
}

Groovy

dependencies {
   def composeBom = platform('androidx.compose:compose-bom:2024.12.01')
   implementation composeBom

   // General compose dependencies.
   implementation 'androidx.activity:activity-compose:1.9.2'

   implementation 'androidx.compose.ui:ui-tooling-preview'
   debugImplementation 'androidx.compose.ui:ui-tooling'

   // Compose for TV dependencies.
   implementation 'androidx.tv:tv-material:1.0.0'
}

Perbedaannya

Komponen material TV dirancang untuk ruang keluarga, dengan indikator fokus yang jelas dan perilaku input yang mudah diakses dengan remote. Untuk mengetahui detail tentang cara menggunakan komponen spesifik ini, lihat panduan desain UI TV.

Gambar 1. Contoh komponen dari library material TV.

Gunakan API versi TV jika memungkinkan untuk mendapatkan manfaat dari fitur ini.

Meskipun secara teknis penggunaan Compose Material versi seluler itu memungkinkan, versi ini tidak dioptimalkan untuk gaya interaksi unik di Android TV. Selain itu, menggabungkan Compose Material dengan Compose Material dari Compose untuk TV dapat menyebabkan perilaku yang tidak terduga. Misalnya, karena setiap library memiliki objek MaterialTheme-nya sendiri, ada kemungkinan warna, tipografi, atau bentuk menjadi tidak konsisten jika kedua versi digunakan.

Tabel berikut menguraikan perbedaan dependensi antara TV dan Perangkat seluler:

Dependensi TV
(androidx.tv.*)
Perbandingan Mobile Dependency
(androidx.compose.*)
androidx.tv:tv-material bukan androidx.compose.material3:material3

Referensi lainnya

  • Panduan desain TV
    Ringkasan komponen TV khusus untuk membuat antarmuka pengguna dengan link ke referensi developer yang relevan.

  • Contoh Katalog Material TV
    Aplikasi katalog yang menunjukkan cara menerapkan prinsip Desain Material menggunakan Compose untuk TV.

  • Contoh JetStream
    Aplikasi streaming media yang menunjukkan penggunaan TV Compose dengan aplikasi Material standar dan arsitektur dunia nyata.

  • Pengantar Compose untuk TV
    Codelab ini menjelaskan langkah-langkah untuk mem-build aplikasi pemutar video dengan layar browser katalog dan layar detail.

Bacaan lebih lanjut

Pelajari panduan ini untuk mempelajari cara membuat pengalaman yang dioptimalkan untuk TV yang luar biasa bagi: