Mit dem Layout Inspector in Android Studio können Sie Fehler im Layout Ihrer App beheben, indem Sie eine Ansichtshierarchie einblenden, in der Sie die Eigenschaften der einzelnen Ansichten überprüfen können. Mit dem Layout Inspector können Sie das Layout Ihrer App mit Designmodellen vergleichen, eine vergrößerte Ansicht oder eine 3D-Ansicht Ihrer App aufrufen und Details des Layouts zur Laufzeit untersuchen. Dies ist besonders nützlich, wenn das Layout zur Laufzeit und nicht vollständig in XML erstellt wird und sich das Layout unerwartet verhält.
Einführung in den Layout-Editor
Erste Schritte
Um den Layout Inspector zu starten, führen Sie die App aus, rufen das Fenster Aktive Geräte auf und klicken auf Layout Inspector ein-/ausblenden 
.
Wenn Sie zwischen mehreren Geräten oder Projekten wechseln, stellt der Layout Inspector automatisch eine Verbindung zu den debugfähigen Prozessen her, die im Vordergrund des verbundenen Geräts ausgeführt werden.
So führen Sie einige häufige Aufgaben aus:
- In den Toolfenstern Komponentenstruktur und Attribute können Sie sich die Hierarchie ansehen und die Eigenschaften der einzelnen Ansichten überprüfen. Für den Layout Inspector muss möglicherweise ein Aktivitätsneustart durchgeführt werden, um auf die Attribute zugreifen zu können. Weitere Informationen finden Sie unter Neustarts von Aktivitäten vermeiden.
- Aktivieren Sie Deep Inspect ein-/ausblenden
, um Ansichten durch einmaliges Klicken direkt auf die Ansichten auszuwählen oder durch Doppelklicken auf Code Code zu öffnen. - Deaktivieren Sie Deep Inspect ein-/ausschalten , um mit der App zu interagieren.
- Aktivieren Sie die Gerätespiegelung, um physische Geräte zu prüfen.
- Damit Live-Updates beim Aktualisieren der App-UI aktiviert werden, muss Live Edit (Live-Bearbeitung) aktiviert sein.
- Wenn Sie den 3D-Modus verwenden möchten, erstellen Sie einen Layout Inspector-Snapshot
und klicken dann auf 3D-Modus 
.
Ansicht auswählen oder isolieren
Eine Ansicht zeichnet in der Regel etwas, das die Nutzenden sehen und mit dem sie interagieren können. Die Komponentenstruktur zeigt die Hierarchie Ihrer App mit jeder Komponente der Ansicht in Echtzeit an. So können Sie Fehler im App-Layout beheben, da Sie die Elemente in Ihrer App und die zugehörigen Werte visualisieren können.
Sie können eine Ansicht auswählen, indem Sie in der Komponentenstruktur oder der Layoutanzeige darauf klicken. Alle Layoutattribute für die ausgewählte Ansicht werden im Bereich Attribute angezeigt.
Wenn Ihr Layout überlappende Ansichten enthält, können Sie alle Ansichten in einer Region sehen, indem Sie im Deep Inspect-Modus mit der rechten Maustaste klicken. Wenn Sie eine Ansicht auswählen möchten, die nicht im Vordergrund liegt, klicken Sie in der Komponentenstruktur darauf oder drehen Sie das Layout.
Für die Arbeit mit komplexen Layouts können Sie einzelne Ansichten isolieren, sodass nur ein Teil des Layouts in der Komponentenstruktur angezeigt und auf der Layoutanzeige gerendert wird. Erstellen Sie zum Isolieren einer Ansicht einen Snapshot , klicken Sie mit der rechten Maustaste auf die Ansicht in der Komponentenstruktur und wählen Sie Nur Unterstruktur anzeigen oder Nur übergeordnete Elemente anzeigen aus. Wenn Sie zur Vollansicht zurückkehren möchten, klicken Sie mit der rechten Maustaste auf die Ansicht und wählen Sie Show All (Alle anzeigen) aus. Sie müssen einen Snapshot erstellen, bevor Sie eine Ansicht isolieren.
Layoutrahmen ausblenden und Labels anzeigen
Um den Begrenzungsrahmen oder die Ansichtslabels für ein Layoutelement auszublenden, klicken Sie oben in der Layoutanzeige auf Ansichtsoptionen 
und aktivieren bzw. deaktivieren Sie Rahmenlinien anzeigen oder Ansichtslabel anzeigen.
Schnappschüsse der Layouthierarchie aufnehmen
Mit dem Layout Inspector können Sie Snapshots der Layouthierarchie Ihrer laufenden App speichern, um sie für andere freizugeben oder später auf sie zurückzugreifen.
Snapshots erfassen die Daten, die normalerweise bei Verwendung des Layout Inspectors zu sehen sind, darunter ein detailliertes 3D-Rendering Ihres Layouts, die Komponentenstruktur Ihres Ansichts-, Schreib- oder Hybridlayouts und detaillierte Attribute für jede Komponente Ihrer UI. Klicken Sie zum Speichern eines Snapshots auf Snapshot-Export/-Import
und dann auf Snapshot exportieren.
Klicken Sie auf Snapshot importieren, um einen zuvor gespeicherten Snapshot des Layout Inspectors zu laden.
3D-Modus
Die Layoutanzeige bietet eine erweiterte 3D-Visualisierung der Ansichtshierarchie Ihrer App zur Laufzeit. Erstellen Sie zum Verwenden dieser Funktion einen Snapshot , klicken Sie im Snapshot Inspector-Fenster auf die Schaltfläche 3D-Modus und drehen Sie ihn durch Ziehen der Maus.
App-Layout mit einem Referenzbild-Overlay vergleichen
Wenn Sie Ihr App-Layout mit einem Referenzbild vergleichen möchten, z. B. einem UI-Mockup, können Sie im Layout Inspector ein Bitmapbild-Overlay laden.
- Wählen Sie zum Laden eines Overlays in der Symbolleiste Layout Inspector die Option Overlay laden
aus. Das Overlay wird so skaliert, dass es zum Layout passt. - Die Transparenz des Overlays können Sie mit dem Schieberegler Overlay Alpha anpassen.
- Wenn Sie das Overlay entfernen möchten, klicken Sie auf Overlay löschen.
„Compose“ prüfen
Mit dem Layout Inspector können Sie ein Compose-Layout innerhalb einer laufenden App in einem Emulator oder auf einem physischen Gerät prüfen. Mit dem Layout Inspector können Sie prüfen, wie oft eine zusammensetzbare Funktion neu zusammengesetzt oder übersprungen wird. Dadurch lassen sich Probleme mit Ihrer App ermitteln. Einige Codefehler können beispielsweise eine übermäßige Neuzusammensetzung Ihrer UI zwingen, was zu einer schlechten Leistung führen kann. Einige Codierungsfehler können dazu führen, dass die UI nicht neu zusammengesetzt und somit auch nicht auf dem Bildschirm angezeigt wird.
Weitere Informationen zum Layout Inspector für Compose
Aktivitätsneustarts vermeiden
Für den Layout Inspector ist eine der folgenden globalen Einstellungen erforderlich, um richtig zu funktionieren. Wenn Sie keine globale Einstellung angeben, legt der Layout Inspector automatisch eine fest.
adb shell settings put global debug_view_attributes_application_package <processname>Diese Option generiert zusätzliche Informationen zur Prüfung des angegebenen Prozesses.
adb shell settings put global debug_view_attributes 1Diese Option generiert zusätzliche Informationen zur Prüfung aller Prozesse auf dem Gerät.
Das Ändern einer globalen Einstellung kann dazu führen, dass die Aktivität neu gestartet wird. Wenn du einen Neustart deiner Aktivitäten vermeiden möchtest, kannst du entweder die Einstellungen in Android Studio oder die Entwickleroptionen in den Geräteeinstellungen ändern.
Um die automatische Aktualisierung in Android Studio zu aktivieren, öffnen Sie Run/Debug Configurations, indem Sie im Menü Run > Edit Configurations auswählen. Rufen Sie dann den Tab Verschiedenes auf und klicken Sie unter Optionen des Layout Inspectors das Kästchen Mit Layout Inspector verbinden, ohne Aktivität neu zu starten an.
Alternativ können Sie auch die Entwickleroptionen Ihres Geräts aktivieren und dann in den Entwicklereinstellungen des Geräts die Option Attributprüfung der Ansicht aktivieren aktivieren.
Eigenständiger Layout Inspector
Für eine optimale Leistung empfehlen wir, den Layout Inspector im standardmäßigen eingebetteten Modus zu verwenden. Wenn Sie die Einbettung des Layout Inspectors aufheben möchten, gehen Sie zu File (Datei) (Android Studio unter macOS)> Settings (Einstellungen) > Tools > Layout Inspector (Eingebetteten Layout Inspector).
Im eigenständigen Modus können Sie Live-Updates aktivieren, indem Sie in der Symbolleiste Layout Inspector auf die Option Live-Updates
klicken.