Layout Inspector in Android Studio ti consente di eseguire il debug del layout della tua app mostrando una gerarchia di visualizzazione in cui puoi esaminare le proprietà di ogni visualizzazione. Con Layout Inspector, puoi confrontare il layout dell'app con i mockup di progettazione, visualizzare una vista ingrandita o 3D dell'app ed esaminare i dettagli del layout in runtime. Ciò è particolarmente utile quando il layout viene creato in fase di runtime anziché interamente in XML e il layout si comporta in modo imprevisto.
Inizia
Per avviare lo strumento di controllo del layout, esegui l'app, vai alla finestra
Dispositivi in esecuzione e fai clic su Attiva/disattiva lo strumento di controllo del layout
.
Se passi da un dispositivo o progetto all'altro, Layout Inspector
si connette automaticamente ai processi di cui è possibile eseguire il debug in esecuzione in primo piano
del dispositivo connesso.
Ecco come eseguire alcune attività comuni:
- Per visualizzare la gerarchia e controllare le proprietà di ogni visualizzazione, utilizza le finestre degli strumenti Albero dei componenti e Attributi. Layout Inspector potrebbe richiedere il riavvio di un'attività per accedere agli attributi. Per saperne di più, consulta Visualizzare l'ispezione degli attributi.
- Per selezionare le visualizzazioni con un solo clic direttamente sulle visualizzazioni o per passare al codice facendo doppio clic sulle visualizzazioni, attiva Attiva/disattiva ispezione approfondita
. - Per interagire con l'app, disattiva Attiva/disattiva analisi approfondita
. - Per esaminare i dispositivi fisici, attiva il mirroring del dispositivo.
- Per attivare gli aggiornamenti in tempo reale durante l'aggiornamento della UI dell'app, verifica che Modifica in tempo reale sia attivata.
- Per utilizzare la modalità 3D, acquisisci uno snapshot di Layout Inspector
e poi
fai clic su Modalità 3D
.
Selezionare o isolare una visualizzazione
Una visualizzazione di solito disegna qualcosa che l'utente può vedere e con cui può interagire. L'albero dei componenti mostra la gerarchia della tua app in tempo reale con ogni componente di visualizzazione, il che ti aiuta a eseguire il debug del layout dell'app perché puoi visualizzare gli elementi all'interno dell'app e i valori associati.
Per selezionare una visualizzazione, fai clic su di essa nell'albero dei componenti o nella visualizzazione layout. Tutti gli attributi di layout per la visualizzazione selezionata vengono visualizzati nel riquadro Attributi.
Se il layout include viste sovrapposte, puoi visualizzare tutte le viste in una regione
quando fai clic con il tasto destro del mouse in modalità Ispezione approfondita
. Per selezionare
una visualizzazione che non è in primo piano, fai clic su di essa nell'albero dei componenti o
ruota il layout.
Per lavorare con layout complessi, puoi isolare le singole visualizzazioni in modo che solo un sottoinsieme del layout venga mostrato nell'albero dei componenti e visualizzato nel display del layout. Per isolare una visualizzazione, scatta un'istantanea
, fai clic con il tasto destro del mouse
sulla visualizzazione nell'albero dei componenti e seleziona Mostra solo sottoalbero o
Mostra solo genitori. Per tornare alla visualizzazione completa, fai clic con il tasto destro del mouse sulla visualizzazione e
seleziona Mostra tutto. Devi creare uno snapshot prima di isolare una visualizzazione.
Nascondere i bordi del layout e visualizzare le etichette
Per nascondere il riquadro di selezione o visualizzare le etichette di un elemento del layout, fai clic su Opzioni
visualizzazione
nella parte superiore di Visualizzazione layout e attiva/disattiva Mostra bordi o Mostra etichetta
visualizzazione.
Acquisire snapshot della gerarchia del layout
Layout Inspector ti consente di salvare snapshot della gerarchia del layout dell'app in esecuzione, in modo da poterli condividere con altri o consultarli in un secondo momento.
Gli snapshot acquisiscono i dati che in genere vengono visualizzati quando si utilizza Layout
Inspector, inclusa una rappresentazione 3D dettagliata del layout, l'albero dei componenti
del layout View, Compose o ibrido e gli attributi dettagliati per ogni
componente della UI. Per salvare uno snapshot, fai clic su Esportazione/importazione snapshot
e poi su
Esporta snapshot.
Carica uno snapshot di Layout Inspector salvato in precedenza facendo clic su Importa snapshot.
Modalità 3D
La funzionalità Layout Display offre una visualizzazione 3D avanzata della gerarchia delle visualizzazioni della tua app in fase di runtime. Per utilizzare questa funzionalità, scatta un'istantanea
, fai clic
sul pulsante Modalità 3D
nella
finestra dell'inspector dell'istantanea e ruotala trascinando il mouse.
Confrontare il layout dell'app con l'overlay di un'immagine di riferimento
Per confrontare il layout dell'app con un'immagine di riferimento, ad esempio un mockup dell'interfaccia utente, puoi caricare un overlay di immagini bitmap in Layout Inspector.
- Per caricare un overlay, seleziona l'opzione Carica overlay
dalla barra degli strumenti Layout Inspector. L'overlay viene scalato per adattarsi
al layout. - Per regolare la trasparenza della sovrapposizione, usa il cursore Alpha sovrapposizione.
- Per rimuovere l'overlay, fai clic su Cancella overlay

Ispeziona Scrivi
Layout Inspector ti consente di esaminare un layout di Compose all'interno di un'app in esecuzione in un emulatore o un dispositivo fisico. Puoi utilizzare Layout Inspector per verificare la frequenza con cui un elemento componibile viene ricomposto o ignorato, il che può aiutarti a identificare i problemi della tua app. Ad esempio, alcuni errori di codifica potrebbero forzare la ricomposizione eccessiva della tua UI, causando un rendimento scarso. Alcuni errori di codifica possono impedire la ricomposizione della UI e, di conseguenza, la visualizzazione delle modifiche sullo schermo.
Scopri di più su Layout Inspector per Compose
Visualizza controllo attributi
Layout Inspector richiede la seguente impostazione globale per funzionare correttamente:
adb shell settings put global debug_view_attributes 1
Questa opzione genera informazioni aggiuntive per l'ispezione di tutti i processi sul dispositivo.
Layout Inspector attiva automaticamente l'impostazione all'avvio. In questo modo l'attività in primo piano corrente viene riavviata. Non vedrai un altro riavvio dell'attività a meno che il flag non venga disattivato manualmente sul dispositivo.
Per disattivare il flag, esegui il seguente comando adb:
adb shell settings delete global debug_view_attributes
In alternativa, disattiva l'opzione Attiva controllo attributi visualizzazione dalle opzioni sviluppatore del dispositivo.
Layout Inspector autonomo
Per prestazioni ottimali, ti consigliamo di utilizzare lo strumento di ispezione del layout nella modalità incorporata predefinita. Se vuoi annullare l'incorporamento di Layout Inspector, vai a File (Android Studio su macOS)> Impostazioni > Strumenti > Layout Inspector e deseleziona la casella di controllo Attiva Layout Inspector incorporato.
In modalità autonoma, attiva gli aggiornamenti in tempo reale facendo clic sull'opzione Aggiornamenti in tempo reale
dalla barra degli strumenti
Ispettore layout.