Debugging Hidden UI Layers with Android Studio Layout Inspector
Find hidden views and Z-order bugs using Android Studio Layout Inspector's live hierarchy and 3D view.
09 Nov 2025, 22:48 UTC

A button that exists but cannot be clicked
You tap a button in your running app and nothing happens. The preview in Android Studio shows the button in the right place, yet on the device it is unreachable. The likely cause is not missing code but an invisible overlap: another view sits on top of it in the Z-axis, or a parent container clips its children. Guessing from XML or Composable source is slow because the source does not show what the device actually renders.
The useful takeaway is to inspect the live UI hierarchy directly from the running process. Android Studio Layout Inspector shows the real component tree, attributes, and layout bounds while the app is running, so you can see which view is covering the button and why.
Open the inspector on a debug build
Layout Inspector requires a debuggable application. It does not work with release-signed builds because the IDE needs a process connection to the running app.
- Build and run the
debugvariant on an emulator or physical device. - On a physical device, open Settings, enable Developer Options, and turn on USB debugging.
- In Android Studio, choose Tools > Layout Inspector while the app is running.
- Select the target process from the connection dialog if multiple devices are attached.
Expected check: the Layout Inspector window opens and displays a component tree on the left, a rendering preview in the center, and an attributes panel on the right. If the window is empty, confirm the app is not a release build and that the device is authorized for USB debugging.
Worked example: find the view blocking a button
Suppose a Button inside a ConstraintLayout does not respond to taps. Use the inspector to confirm the overlap instead of editing layout files blindly.
- With the app running, open Layout Inspector.
- Click the button's node in the component tree. The preview highlights its bounds.
- Enable Live Updates so the tree refreshes as you interact with the app.
- Tap around the missing button area. If another node highlights instead, that view is receiving the touch events.
- Click the 3D view toggle and rotate the layout. Views stacked above the button become visible as raised layers along the Z-axis.
- Inspect the overlapping node's attributes to find its ID, elevation, and parent layout.
Configuration note: there is no terminal command for this workflow. The tool is launched from the Android Studio menu and attaches to the already-running debug process over ADB. The risk is minimal because Layout Inspector is read-only; it cannot modify your layouts or restart the app.
Jetpack Compose and the composable tree
For Compose UI, the inspector displays the composable hierarchy rather than traditional View nodes. You can click a composable node to see parameters and state values passed into that function. This helps when a conditional block removes a UI element or when a state change causes unexpected recomposition.
Limitations and how to verify the result
- Debug builds only: Layout Inspector will not connect to release builds. Verify by checking the build variant in the bottom-right of Android Studio.
- Performance lag: Live Updates may stutter on low-end physical devices or deeply nested hierarchies. Disable Live Updates and use snapshots if the inspector becomes unresponsive.
- Inspection only: You cannot drag views or edit constraints inside the inspector. Changes still require code edits and a rebuild.
Practical verification: after rotating the 3D view, confirm that the overlapping view's rectangle visually covers the button's bounds. Then disable Live Updates, modify the layout XML or Composable to remove or reorder the overlapping view, rebuild, and confirm the button responds to taps.
Closing
Layout Inspector turns invisible layout bugs into visible geometry. Start with the debug build connection, use Live Updates for transient states, and rotate to 3D when a view disappears behind another. The tool does not fix the layout for you, but it shows exactly what needs to change.
0 replies
A thoughtful contribution can make all the difference. Be the first to share one.