Membuat navigasi TV

Perangkat TV menyediakan serangkaian kontrol navigasi yang terbatas untuk aplikasi. Pembuatan skema navigasi yang efektif untuk aplikasi TV Anda bergantung pada pemahaman kontrol terbatas ini dan batas persepsi pengguna saat mengoperasikan aplikasi Anda. Karena Anda membangun aplikasi Android untuk TV, berikan perhatian khusus pada cara sebenarnya yang digunakan pengguna untuk bergerak dalam aplikasi saat menggunakan tombol kontrol jarak jauh sebagai ganti layar sentuh.

Tutorial ini menjelaskan persyaratan minimum untuk membuat skema navigasi aplikasi TV yang efektif dan cara menerapkannya pada aplikasi Anda.

Mengaktifkan navigasi D-pad

Di perangkat TV, pengguna melakukan navigasi dengan kontrol yang ada di perangkat remote kontrol, baik menggunakan tombol arah (D-Pad) maupun tombol panah. Tipe kontrol seperti ini membatasi gerakan ke atas, bawah, kiri, dan kanan. Untuk membuat aplikasi terbaik yang dioptimalkan bagi TV, Anda harus menyediakan skema navigasi yang mudah dipelajari oleh pengguna menggunakan kontrol yang terbatas ini.

Framework Android menangani navigasi arah antar elemen tata letak secara otomatis, jadi Anda biasanya tidak perlu lagi melakukan apa pun untuk aplikasi. Namun, Anda harus menguji secara tuntas navigasi dengan pengontrol D-pad untuk menemukan masalah navigasi. Ikuti panduan ini untuk menguji apakah sistem navigasi aplikasi Anda berfungsi baik dengan D-pad di perangkat TV:

  • Pastikan pengguna bisa menjelajahi semua kontrol yang terlihat di layar dengan pengontrol D-pad.
  • Untuk men-scroll daftar dengan fokus, pastikan tombol atas dan bawah D-pad men-scroll daftar, dan tombol Enter memilih item dalam daftar. Pastikan pengguna bisa memilih elemen dalam daftar dan daftar tersebut masih bisa di-scroll saat elemen dipilih.
  • Pastikan peralihan antarkontrol tidak rumit dan bisa diprediksi.

Mengubah navigasi direksional

Framework Android secara otomatis menerapkan skema navigasi direksional berdasarkan posisi relatif elemen yang bisa difokuskan dalam tata letak. Anda harus menguji skema navigasi yang dihasilkan dalam aplikasi menggunakan pengontrol D-pad. Setelah mengujinya, jika ingin agar pengguna bisa berpindah dalam tata letak dengan cara khusus, Anda bisa menetapkan navigasi direksional eksplisit untuk kontrol Anda.

Catatan: Hanya gunakan atribut ini untuk mengubah urutan navigasi jika urutan default yang diterapkan sistem tidak berfungsi dengan baik.

Contoh kode di bawah menunjukkan cara menentukan kontrol berikutnya untuk menerima fokus bagi objek tata letak TextView:

    <TextView android:id="@+id/Category1"
            android:nextFocusDown="@+id/Category2"\>
    

Tabel berikut ini mencantumkan semua atribut navigasi yang tersedia untuk widget antarmuka pengguna Android:

Atribut Fungsi
nextFocusDown Menentukan tampilan berikutnya yang akan menerima fokus ketika pengguna mengarahkan ke bawah.
nextFocusLeft Menentukan tampilan berikutnya yang akan menerima fokus ketika pengguna mengarahkan ke kiri.
nextFocusRight Menentukan tampilan berikutnya yang akan menerima fokus ketika pengguna mengarahkan ke kanan.
nextFocusUp Menentukan tampilan berikutnya yang akan menerima fokus ketika pengguna mengarahkan ke atas.

Untuk menggunakan salah satu atribut navigasi eksplisit ini, atur nilai ID (nilai android:id) widget lain dalam tata letak. Anda harus menetapkan urutan navigasi sebagai loop agar kontrol yang paling akhir mengarahkan fokus kembali ke yang pertama.

Menyediakan fokus dan pemilihan yang jelas

Keberhasilan skema navigasi aplikasi di perangkat TV bergantung pada seberapa mudah pengguna dapat menentukan elemen antarmuka pengguna yang sedang difokuskan di layar. Jika Anda tidak menyediakan indikasi yang jelas mengenai item yang difokus (dan item apa yang dapat ditindaklanjuti pengguna, mereka dapat cepat frustrasi dan keluar dari aplikasi Anda. Karena alasan yang sama, item yang difokus harus dapat ditindaklanjuti pengguna begitu aplikasi dimulai, atau kapan saja aplikasi tidak aktif.

Implementasi dan tata letak aplikasi harus menggunakan warna, ukuran, animasi, atau kombinasi dari semua atribut ini untuk memudahkan pengguna menentukan tindakan apa yang dapat mereka ambil berikutnya. Gunakan skema seragam untuk menunjukkan fokus dalam aplikasi Anda.

Android menyediakan Resource daftar status drawable untuk mengimplementasikan sorotan bagi kontrol yang difokuskan dan dipilih. Contoh kode berikut ini mendemonstrasikan cara mengaktifkan perilaku visual bagi sebuah tombol untuk menunjukkan bahwa pengguna telah menjelajah ke kontrol kemudian memilihnya:

    <!-- res/drawable/button.xml -->
    <?xml version="1.0" encoding="utf-8"?>
    <selector xmlns:android="http://schemas.android.com/apk/res/android">
        <item android:state_pressed="true"
              android:drawable="@drawable/button_pressed" /> <!-- pressed -->
        <item android:state_focused="true"
              android:drawable="@drawable/button_focused" /> <!-- focused -->
        <item android:state_hovered="true"
              android:drawable="@drawable/button_focused" /> <!-- hovered -->
        <item android:drawable="@drawable/button_normal" /> <!-- default -->
    </selector>
    

Kode contoh XML tata letak berikut menerapkan daftar status drawable sebelumnya ke Button:

    <Button
        android:layout_height="wrap_content"
        android:layout_width="wrap_content"
        android:background="@drawable/button" />
    

Pastikan untuk menyediakan padding yang mencukupi dalam kontrol yang dapat difokuskan dan dapat dipilih agar sorotan di sekelilingnya terlihat jelas.

Untuk rekomendasi selengkapnya tentang mendesain pemilihan dan fokus yang efektif pada aplikasi TV, lihat Mendesain aplikasi untuk Android TV.