Indikator progres media

Komponen indikator progres media bersifat unik untuk aplikasi media.

Indikator progres adalah representasi visual durasi dan waktu pemutaran yang telah berlalu untuk sumber media. Tombol ini muncul di aplikasi media selama pemutaran.


Anatomi

Indikator progres media terdiri dari trek yang tidak aktif (ditampilkan dalam warna abu-abu) yang mewakili durasi sumber media, dan trek aktif (ditampilkan dengan warna aksen) yang menempatkan trek tidak aktif untuk menunjukkan waktu pemutaran yang berlalu.

Anatomi indikator progres media
1. Jalur aktif
2. Jalur tidak aktif

Indikator progres media dapat bersifat linear atau melingkar.

Indikator progres media linear

Indikator progres linear menampilkan durasi dan waktu yang berlalu pada sumbu horizontal. Bagian trek yang terlihat berada di tengah area target sentuh 76 dp. Dengan mengetuk atau menarik waktu yang berlalu, pengguna dapat berpindah ke lokasi lain di sumber media. Indikator progres media linear ditujukan untuk layar berukuran 800 dp atau lebih tinggi.

Anatomi indikator kemajuan melingkar

Indikator progres melingkar menampilkan durasi dan waktu yang berlalu sebagai lingkaran. Mengetuk atau menarik waktu yang berlalu tidak didukung untuk berpindah ke lokasi yang berbeda. Indikator progres media melingkar ditujukan untuk layar yang berukuran kurang dari 800 dp, dan untuk digunakan saat kontrol pemutaran media diperkecil.

Status indikator progres media

Selama pemutaran, indikator kemajuan berada dalam salah satu dari empat status:

  • Diputar: Media sedang diputar dan trek aktif maju di seluruh trek yang tidak aktif untuk menunjukkan waktu yang berlalu.
  • Dijeda: Pengguna menjeda pemutaran. Trek aktif berhenti di titik pemutaran dijeda.
  • Buffering: Aplikasi media memuat konten untuk diputar. Indikator menampilkan garis putih yang berulang kali melewati trek tidak aktif saat konten dimuat.
  • Error: Media tidak dapat diputar. Tidak ada jalur yang aktif dan jalur yang tidak aktif dinonaktifkan.
Trek aktif maju di seluruh trek yang tidak aktif saat media diputar
Status pemutaran: Trek aktif maju di seluruh trek yang tidak aktif saat media diputar.
Jalur aktif tidak bergerak saat media playbsck dijeda
Status dijeda: Trek aktif tidak bergerak selama pemutaran media dijeda.
Garis putih berulang kali melewati trek yang tidak aktif saat konten dimuat
Status buffer: Garis putih berulang kali melewati trek yang tidak aktif saat konten dimuat.
Jalur yang tidak aktif dinonaktifkan saat terjadi error pemutaran medai Status error: Saat terjadi error media, trek aktif tidak akan ditampilkan dan trek tidak aktif akan dinonaktifkan.

Spesifikasi

Indikator progres media linear

Indikator indikator progres media linear

Indikator progres media melingkar

Redaksi indikator kemajuan media melingkar

Penyesuaian

Selama pemutaran media, trek aktif indikator kemajuan media ditampilkan menggunakan warna aksen. Warna aksen default adalah bayangan biru. Developer aplikasi dapat memilih untuk memberikan warna aksen aplikasi yang mencerminkan merek medianya. OEM juga dapat menyediakan warna aksen yang mencerminkan merek mobilnya. Jika disediakan, warna aksen OEM akan lebih diprioritaskan daripada warna aksen aplikasi.

Status progres media linear yang menampilkan trek aktif menggunakan warna aksen default, pihak ketiga, dan OEM
Gaya default untuk indikator progres adalah warna biru. Developer aplikasi dapat mengganti gaya visual aplikasi default dengan warna aksen merek mereka sendiri (hijau dalam contoh ini). OEM juga dapat mengganti gaya default dan gaya aplikasi dengan warna aksen merek mereka sendiri (oranye dalam contoh ini).
Status progres media melingkar yang menampilkan trek aktif menggunakan warna aksen default, pihak ketiga, dan OEM
Contoh gaya visual aksen default, aplikasi, dan OEM yang diterapkan pada indikator progres melingkar

Panduan Integrasi Library UI Mobil memberikan panduan OEM untuk menyesuaikan komponen.

Untuk panduan khusus penggunaan warna guna menyesuaikan komponen, kunjungi Warna.


Contoh

Cara kerja indikator progres media linear
Indikator progres media linear dalam tampilan pemutaran aplikasi media
Indikator progres media melingkar beraksi
Di sini, indikator progres media melingkar muncul pada kontrol pemutaran yang diperkecil. Kontrol yang dikurangi menempatkan layar playlist.