Android可視化調試工具Hierarchy Viewer的使用

Android的SDK工具包中，有很多十分有用的工具，可以幫助程序員開發和測試Android應用程序，大大提高其工作效率。其中的一款叫Hierachy Viewer的可視化調試工具，可以很方便地幫助開發者分析，設計，調試和調整UI界面，提高開發效率。本文將以一個實際例子講解如何使用該款工具運用在Android的開發過程中。

1 設計界面

在我們的這個例子中，有三個不同的界面，以方便我們演示使用Hierarchy Viewer。每一個界面都使用了LinearLayout和FrameLayout布局，以及文本框TextView及圖片框ImageView控件。如下圖，三個界面中的圖案分別用了一只小貓，一個魚缸，一條金魚，它們各自的位置布局見下圖：

1）在上面的三個圖中，最左面的一個圖，使用了一個垂直布局的LinearLayout，並且劃分為兩行，第一行是一個TextView文本框，裡面的文字是“Safe”，第2行是一個FrameLayout幀布局，分別包含了一條魚和一個魚缸子。

2）中間的圖中，使用了一個垂直布局的LinearLayout，並且劃分為兩行，第一行是寫有“Unsafe”文本的文本框，第二行也有一個LinearLayout的水平布局，分別又包含了兩個ImageView控件：一個魚缸及魚，還有一只小貓。

3）最右邊的圖中，使用了一個垂直布局的LinearLayout，並且劃分為兩行，第一行是寫有“Yum” 文本的文本框，第2行是一個FrameLayout幀布局，分別包含了一條小貓和一條魚。跟第一張圖有點相象。

2 啟動應用程序

在設計界面後，我們直接用模擬器啟動我們的應用程序，要注意的是，在debug狀態下，是不能啟動Hierachy Viewer的。

3 啟動Hierachy Viewer

目前，在eclipse的ADT Android插件中，還不能啟動Hierachy Viewer，但可以從Android SDK工具包中，通過命令行的方式可以啟動，具體方法為，到Android SDK下的tools目錄下，在命令行方式下運行hierachyviewer即可:

在啟動後，可以看到如下的界面，會顯示當前正在運行中的模擬器的信息，這裡我們可以鼠標點擊我們已經啟動了的Activity:

同時可以看到，有兩個按鈕，分別代表兩個功能：

1) Load View Hierarchy : 可以查看界面的控件層次

2) Inspect Screenshot : 進入界面精確查看模式

4 Inspecting Screenshots(界面精確查看模式)

先點Inspecting Screenshots按鈕，進入界面精確查看模式。在這個模式下，開發者可以隨意點界面的任意一部分，進行放大或縮小觀察以查看界面中各控件的具體位置和情況，如下圖所示：

同時，還可以將截取的界面另外保存為PNG格式的圖片文件。

5 Load View Hierarchy (界面控件層次查看）

接下來，我們重點學習如何在Load View Hierachy中，查看界面中各個控件的層次結構關系。

首先當點Load View Hierarchy按鈕後，會進入如下圖所示界面：

注意，在屏幕的左下方，有三個按鈕，分別是模擬器的列表界面(主菜單)、Load View Hierachy主界面、Inspecting Screenshots主界面。

接下來，我們看上圖，Load View Hierachy界面被劃分為四個部分：

1）左側(面積最大一塊)，該部分顯示界面控件的層次結構，我們稱之為主窗口，

2）右上方，是以縮略圖的方式顯示整個應用中的各控件的層次關系，可通過鼠標在這個顯示區域進行移動，以便在主窗體顯示相關的控件信息。

3）右邊區域的中間部分，顯示的每個控件的具體屬性，是控件的屬性面版。

4）右下角部分的區域，顯示出用戶所點的控件，在界面中的具體位置，會用紅色部分標出，方便用戶辨識。