Potongan layar adalah area di beberapa perangkat yang meluas ke permukaan tampilan. Hal ini memungkinkan pengalaman dari tepi ke tepi sekaligus menyediakan ruang untuk sensor penting di bagian depan perangkat.
Android mendukung potongan tampilan di perangkat yang menjalankan Android 9 (API level 28) dan yang lebih tinggi. Namun, produsen perangkat juga dapat mendukung potongan layar di perangkat yang menjalankan Android 8.1 atau yang lebih lama.
Dokumen ini menjelaskan cara menerapkan dukungan untuk perangkat yang memiliki potongan, termasuk cara menggunakan area potongan—yaitu, persegi panjang tepi ke tepi pada permukaan layar yang berisi potongan tersebut.
Memilih cara aplikasi Anda menangani area potongan
Jika tidak ingin konten tumpang-tindih dengan area potongan, secara umum Anda
cukup memastikan konten tidak tumpang tindih dengan status bar dan
menu navigasi. Jika Anda merender ke area potongan, gunakan
WindowInsetsCompat.getDisplayCutout()
untuk mengambil objek DisplayCutout
yang berisi inset aman dan kotak pembatas untuk setiap potongan. API ini memungkinkan
Anda memeriksa apakah konten tumpang-tindih dengan potongan sehingga Anda dapat
posisinya ulang jika diperlukan.
Anda juga dapat menentukan apakah konten diletakkan di belakang area potongan. Atribut tata letak jendela
layoutInDisplayCutoutMode
mengontrol cara konten digambar di area potongan.
Anda dapat menetapkan layoutInDisplayCutoutMode
ke salah satu nilai berikut:
LAYOUT_IN_DISPLAY_CUTOUT_MODE_DEFAULT
: konten dirender ke area potongan saat ditampilkan dalam mode potret, tetapi konten akan memiliki tampilan lebar saat ditampilkan dalam mode lanskap.LAYOUT_IN_DISPLAY_CUTOUT_MODE_SHORT_EDGES
: konten dirender ke area potongan dalam mode potret dan lanskap.LAYOUT_IN_DISPLAY_CUTOUT_MODE_NEVER
: konten tidak pernah dirender di area potongan.
Anda dapat menetapkan mode potongan secara terprogram atau dengan menetapkan
gaya dalam aktivitas Anda. Contoh berikut
menentukan gaya untuk menerapkan atribut LAYOUT_IN_DISPLAY_CUTOUT_MODE_SHORT_EDGES
ke aktivitas.
<style name="ActivityTheme"> <item name="android:windowLayoutInDisplayCutoutMode"> shortEdges <!-- default, shortEdges, or never --> </item> </style>
Bagian berikut ini menjelaskan berbagai mode potongan secara lebih mendetail.
Perilaku default
Secara default, dalam mode potret tanpa tanda khusus yang ditetapkan, status bar pada perangkat yang memiliki potongan layar akan diubah ukurannya menjadi setidaknya setinggi potongan, dan konten Anda ditampilkan di area di bawahnya. Dalam mode lanskap atau layar penuh, jendela aplikasi Anda akan diberi tampilan lebar sehingga tidak ada konten yang ditampilkan di area potongan.
Merender konten di area potongan tepi pendek
Untuk konten tertentu, seperti video, foto, peta, dan game, rendering di
area potongan dapat menjadi cara yang tepat untuk memberikan pengalaman menyeluruh
yang lebih imersif bagi pengguna. Dengan LAYOUT_IN_DISPLAY_CUTOUT_MODE_SHORT_EDGES
, konten diperluas ke area potongan di tepi pendek tampilan dalam
potret dan lanskap, terlepas dari apakah kolom sistem tersembunyi atau
terlihat. Saat menggunakan mode ini, pastikan tidak ada konten penting yang tumpang-tindih dengan
area potongan.
Gambar berikut adalah contoh LAYOUT_IN_DISPLAY_CUTOUT_MODE_SHORT_EDGES
untuk perangkat dalam mode potret:
Gambar berikut adalah contoh LAYOUT_IN_DISPLAY_CUTOUT_MODE_SHORT_EDGES
untuk perangkat dalam mode lanskap:
Dalam mode ini, jendela memanjang di bawah potongan di tepi pendek tampilan dalam mode potret dan lanskap, terlepas dari apakah jendela menyembunyikan kolom sistem atau tidak.
Potongan di sudut dianggap berada di tepi pendek:
Tidak merender konten di area potongan layar
Dengan LAYOUT_IN_DISPLAY_CUTOUT_MODE_NEVER
, jendela tidak akan diizinkan untuk tumpang-tindih dengan area potongan.
Berikut adalah contoh LAYOUT_IN_DISPLAY_CUTOUT_MODE_NEVER
dalam
potret:
Berikut adalah contoh LAYOUT_IN_DISPLAY_CUTOUT_MODE_NEVER
dalam
mode lanskap:
Praktik terbaik untuk dukungan potongan layar
Saat bekerja dengan potongan layar, pertimbangkan hal berikut:
- Perhatikan penempatan elemen penting UI. Jangan biarkan area potongan mengaburkan teks, kontrol, atau informasi penting lainnya.
- Jangan menempatkan atau memperluas elemen interaktif apa pun yang memerlukan pengenalan sentuhan ke area potongan. Sensitivitas sentuh mungkin lebih rendah di area potongan.
Jika memungkinkan, gunakan
WindowInsetsCompat
untuk mengambil tinggi status bar dan menentukan padding yang sesuai untuk diterapkan ke konten Anda. Hindari melakukan hardcode tinggi status bar, karena dapat menyebabkan konten yang tumpang tindih atau terpotong.Gunakan
View.getLocationInWindow()
untuk menentukan berapa banyak ruang jendela yang digunakan aplikasi Anda. Jangan berasumsi bahwa aplikasi menggunakan seluruh jendela, dan jangan gunakanView.getLocationOnScreen()
.Gunakan mode potongan
shortEdges
ataunever
jika aplikasi Anda perlu bertransisi ke dan keluar dari mode imersif. Perilaku potongan default dapat menyebabkan konten di aplikasi Anda dirender di area potongan saat kolom sistem ada, tetapi tidak saat dalam mode imersif. Hal ini menyebabkan konten bergerak naik dan turun selama transisi, seperti yang ditunjukkan dalam contoh berikut.Dalam mode imersif, berhati-hatilah saat menggunakan koordinat jendela versus layar, karena aplikasi Anda tidak menggunakan seluruh layar saat dijadikan tampilan lebar. Karena tampilan lebar ini, koordinat dari asal layar tidak sama dengan koordinat dari asal jendela. Anda dapat mengubah koordinat layar menjadi koordinat tampilan sesuai kebutuhan menggunakan
getLocationOnScreen()
. Gambar berikut menunjukkan perbedaan koordinat saat konten diberi tampilan lebar:Saat menangani
MotionEvent
, gunakanMotionEvent.getX()
danMotionEvent.getY()
untuk menghindari masalah koordinat serupa. Jangan gunakanMotionEvent.getRawX()
atauMotionEvent.getRawY()
.
Menguji cara konten dirender
Uji semua layar dan pengalaman aplikasi Anda. Uji di perangkat dengan jenis potongan yang berbeda, jika memungkinkan. Jika tidak memiliki perangkat yang memiliki potongan, Anda dapat menyimulasikan konfigurasi potongan umum pada perangkat atau emulator apa pun yang menjalankan Android 9 atau yang lebih tinggi dengan melakukan hal berikut:
- Aktifkan Opsi developer.
- Di layar Developer options, scroll ke bawah ke bagian Drawing, lalu pilih Simulate a display with a berguna.
Pilih jenis potongan.