Layout Inspector di Android Studio memungkinkan Anda men-debug tata letak aplikasi dengan menampilkan hierarki tampilan tempat Anda dapat memeriksa properti setiap tampilan. Dengan Layout Inspector, Anda dapat membandingkan tata letak aplikasi dengan tiruan desain, menampilkan tampilan aplikasi yang diperbesar atau 3D, dan memeriksa detail tata letaknya saat runtime. Alat ini sangat berguna jika tata letak Anda dibuat saat runtime, bukan sepenuhnya dalam XML, dan tata letak berperilaku secara tidak terduga.
Memulai
Untuk memulai Layout Inspector, jalankan aplikasi Anda, buka jendela
Running Devices, lalu klik Toggle Layout Inspector 
.
Jika Anda beralih di antara beberapa perangkat atau project, Layout Inspector
akan otomatis terhubung ke proses yang dapat di-debug dan berjalan di latar depan
perangkat yang terhubung.
Berikut cara melakukan beberapa tugas umum:
- Untuk melihat hierarki dan memeriksa properti setiap tampilan, gunakan jendela alat Pohon Komponen dan Atribut. Layout Inspector mungkin memerlukan mulai ulang aktivitas untuk mengakses atribut. Untuk mengetahui informasi selengkapnya, lihat Melihat Pemeriksaan Atribut.
- Untuk memilih tampilan dengan mengklik langsung tampilan satu kali atau membuka kode dengan mengklik dua kali tampilan, aktifkan Toggle Deep Inspect
. - Untuk berinteraksi dengan aplikasi, nonaktifkan Toggle Deep Inspect .
- Untuk memeriksa perangkat fisik, aktifkan pencerminan perangkat.
- Untuk mengaktifkan update langsung saat Anda memperbarui UI aplikasi, pastikan Edit Langsung diaktifkan.
- Untuk menggunakan mode 3D, ambil snapshot Layout Inspector
, lalu
klik Mode 3D 
.
Memilih atau memisahkan tampilan
Tampilan biasanya menggambar sesuatu yang terlihat, dan pengguna dapat berinteraksi dengannya. Component Tree menampilkan hierarki aplikasi secara real time dengan setiap komponen tampilan, yang membantu Anda men-debug tata letak aplikasi karena dapat memvisualisasikan elemen dalam aplikasi dan nilai yang terkait dengannya.
Untuk memilih tampilan, klik tampilan di Component Tree atau Layout Display. Semua atribut tata letak untuk tampilan yang dipilih akan muncul dalam panel Attributes.
Jika tata letak Anda menyertakan tampilan tumpang-tindih, Anda dapat melihat semua tampilan dalam suatu region
saat Anda mengklik kanan dalam mode Deep Inspect
. Untuk memilih
tampilan yang tidak berada di depan, klik tampilan di Component Tree atau
putar tata letak.
Jika mengerjakan tata letak yang rumit, Anda dapat memisahkan masing-masing tampilan sehingga hanya bagian tertentu dari tata letak yang diperlihatkan dalam Component Tree dan dirender dalam Layout Display. Untuk memisahkan tampilan, ambil snapshot
, klik kanan
tampilan di Component Tree, lalu pilih Show Only Subtree atau
Show Only Parents. Untuk kembali ke tampilan penuh, klik kanan tampilan, lalu
pilih Show All. Anda harus mengambil snapshot sebelum mengisolasi tampilan.
Menyembunyikan batas tata letak dan label tampilan
Untuk menyembunyikan kotak pembatas atau label tampilan elemen tata letak, klik View
Options 
di bagian atas Layout Display, lalu ganti ke Show Borders atau Show View
Label.
Mengambil snapshot hierarki tata letak
Layout Inspector memungkinkan Anda menyimpan snapshot hierarki tata letak aplikasi yang sedang berjalan, sehingga Anda dapat membagikannya kepada orang lain atau menunjukkannya nanti.
Snapshot merekam data yang biasanya akan Anda lihat saat menggunakan Layout Inspector, termasuk rendering 3D mendetail dari tata letak, hierarki komponen tata letak View, Compose, atau hybrid, serta atribut mendetail untuk setiap komponen UI Anda. Untuk menyimpan snapshot, klik Snapshot Export/Import
, lalu
Export Snapshot.
Muat snapshot Layout Inspector yang disimpan sebelumnya dengan mengklik Import Snapshot.
Mode 3D
Layout Display menampilkan visualisasi 3D yang canggih dari
hierarki tampilan aplikasi Anda saat runtime. Untuk menggunakan fitur ini, ambil snapshot
, klik
tombol 3D Mode
di jendela
snapshot Inspector, lalu putar dengan menarik mouse.
Membandingkan tata letak aplikasi dengan gambar overlay referensi
Untuk membandingkan tata letak aplikasi Anda dengan gambar referensi, seperti tiruan UI, Anda dapat memuat gambar overlay bitmap di Layout Inspector.
- Untuk memuat overlay, pilih opsi Load Overlay
dari toolbar Layout Inspector. Overlay diskalakan agar sesuai dengan tata letak. - Untuk menyesuaikan transparansi overlay, gunakan penggeser Overlay Alpha.
- Untuk menghapus overlay, klik Clear Overlay
.
Memeriksa Compose
Layout Inspector memungkinkan Anda memeriksa tata letak Compose di dalam aplikasi yang berjalan di emulator atau perangkat fisik. Anda dapat menggunakan Layout Inspector untuk memeriksa seberapa sering composable direkomposisi atau dilewati, yang dapat membantu mengidentifikasi masalah pada aplikasi. Misalnya, beberapa error coding dapat memaksa UI Anda merekomposisi secara berlebihan, yang dapat menyebabkan performa yang buruk. Beberapa error coding dapat mencegah rekomposisi UI Anda dan, oleh karena itu, mencegah perubahan UI Anda muncul di layar.
Pelajari Layout Inspector for Compose lebih lanjut
Melihat Inspeksi Atribut
Layout Inspector memerlukan setelan global berikut agar berfungsi dengan benar:
adb shell settings put global debug_view_attributes 1
Opsi ini menghasilkan informasi tambahan untuk pemeriksaan pada semua proses di perangkat.
Pemeriksa Tata Letak akan otomatis mengaktifkan setelan saat dimulai. Hal ini menyebabkan Aktivitas latar depan saat ini dimulai ulang. Anda tidak akan melihat mulai ulang Activity lain kecuali jika tanda dinonaktifkan secara manual di perangkat.
Untuk menonaktifkan tanda, jalankan perintah adb berikut:
adb shell settings delete global debug_view_attributes
Atau, nonaktifkan Enable view attribute inspection dari opsi developer perangkat Anda.
Layout Inspector Mandiri
Untuk performa yang optimal, sebaiknya gunakan Layout Inspector dalam mode sematan default. Jika Anda ingin membatalkan penyematan Layout Inspector, buka File (Android Studio di macOS)> Settings > Tools > Layout Inspector lalu hapus centang pada kotak Enable embedded Layout Inspector.
Dalam mode mandiri, aktifkan update langsung dengan mengklik opsi Live Updates
dari
toolbar Layout Inspector.