Android Hierarchy Viewer
Android Hierarchy viewer is added in 0.9 SDK. The Hierarchy Viewer tool allows you to optimize your user interface. It provides a visual representation of your layout’s hierarchy of Views and a pixel view of the current display.
To start the hierarchy View first start an emulator instance and then run hierarchyviewer.exe from android SDK tools/ directory.
The Hierarchy View will be started as shown:
The devices list on the left shows the currently running devices (or emulators). And on the right the list of currently active windows is displayed of the selected device.
To see the window’s View hierarchy select that window and click on the Load view hierarchy.
The view hierarchy view shows the windows view and viewgroups as a hierarchy, depending on parent child relationship. The window’s wire frame view is also shown on the right side.
On selecting any view the property window shows the properties of that view. The property values are not editable. Clicking on the display view shows the selected element.
The Invalidate and Request Layout buttons executes the invalidate() and requestLayout() methods of the selected view. If you are running the application in debug mode, you can debug the view functionality with the help of these buttons.
To refresh the view hierarchy to reflect the changes as per the device current stage, ‘Load View Hierarchy’ can be used.
The hierarchy viewer tool also provides a Pixel Perfect view for the window. You can switch to the Pixel Perfect view by clicking on the second button at the bottom left corner.
Pixel Perfect View:
The pixel perfect view shows following 3 views:
Explorer View: It shows the view hierarchy as a list (left hand side view)
Normal View: View of the device window (middle view)
Loupe View: A magnified, pixel-grid view of the device window, on the right.
The normal and Loupe view refreshes after sometime to show the current device window.
A very useful feature is that you can overlay an image on top of the normal and Loupe Views. Support you have an already designed screen layout as an image. You can overlay that image on the device window by clicking on the Load button and selecting the file from file system. You can adjust the opacity of the image and match your screen components with the image to check whether they match.
So the hierarchy viewer is really useful to design the application screens (views) and debug the application.