Chapter 工欲善其事 its prerequisite-android SDK tools (5)

1.5 UI Layout analysis tool-View tool (Hierarchy Viewer)

In the Android SDK Toolkit, there are many useful tools that can help programmers develop and test Android applications, greatly improving their productivity. One of them is called Hierachy Viewer Visual debugging tool, can be easily in the developer design, debugging and adjustment interface, improve user development efficiency, achieve a multiplier effect. It mainly has the following two functions:

1) Intuitively get the information of UI layout design structure and various properties from the visual angle , help us to optimize the layout design;

2) The process of combining debug to help observe specific UI objects for invalidate and requestlayout operations.

Below, let's look at a simple example of how the hierarchy Viewer is used (it is important to note that the Hierachy Viewer cannot be started in the debug state).

Hierarchyviewer is very simple to use, start the emulator or connect to the real machine, double-click the Android sdk/tools directory under the Hierarchyviewer.bat, you will see the 1-28 interface.

Figure 1-28 Hierarchy Viewer main interface

Windows list is the currently selected device can be used to display the view structure of the window, select a window, such as the com.char1/ Com.char1.Char1Activity, double-click to enter the Layoutview, because to parse the relevant window, so this process will be a few seconds, the left list is the current window of the tree layout structure, the right is listed in the current selected sub-view of the property information and the position in the window, 1-29 is shown.

Figure 1-29 Layout View

Note that the view structure listed in Layout view starts from the root node of the view, such as the layout used for launcher, and its underlying base layout draglayer is actually placed in a framelayout. The framelayout was also managed by Phonewindow's Decorview.

Click on the lower left corner of the interface similar to the nine Gongge button, entered the Android called Pixel Perfect view of the interface, the interface is mainly from the details of the UI to observe the effect, 1-30 shows.

Figure 1-30 Pixel Perfect View

On the left is the browse view, the middle is the global view, the right side is the current focus on the details of the zoom, is pixel level, is very useful for observing the details. Refresh rate controls How long view data is updated from the emulator or the real machine. Zoom is used to zoom in on local details, and the details are displayed on the rightmost view. Overlay more interesting, mainly used to test the current view after loading a new picture effect, click on the top left corner of the fourth button to select a picture, you can control the current interface display transparent read, sliding 0% to 100% of the control can be. If Showin Loupe is selected, the zoomed-in view on the right also displays the details of the loaded picture in a transparent display. But at present this overlay does relatively simple, the synthesis diagram can only draw from the bottom left corner of the interface as the origin point, cannot move.

In Layout view, select a view of the diagram, double-click to see the actual display of the view, you can click on show Extras, this function is also more useful, you can display the view of the different elements of the boundary displayed, help us check whether the correct, 1-31 is shown.

Figure 1-31 actual display effect

For Android UI, invalidate and Requestlayout are the most important processes, Hierarchyviewer provides a way to help us debug a specific UI to perform invalidate and requestlayout processes , the method is simple, just select the view you want to perform both actions, click the button on the right of show extras. Of course, we need to make a breakpoint in a method such as Onmeasure (). This feature is useful for UI components that are customizable, and can help to see if the relevant interface display logic is correct separately.

Chapter 工欲善其事 its prerequisite-android SDK tools (5)