一、概述

Hierarchy Viewer是我們平時開發中常用的工具，通過它我們可以得到某個介面中的佈局層次，今天我們來介紹一下如何使用這個工具來優化佈局。

Hierarchy工具位於SDK/tools目錄下，直接執行之後我們會得到下面這個介面：

它提供了下面兩個功能：

因為主要是討論如何用它來分析效能問題，所以我們主要介紹第一個功能。

二、`Hierarchy`分析

在Hierarchy Viewer的根介面，它列出了當前手機或者模擬器中可見的Window，假如我們要分析某個Activity，那麼點選它，再點選Load View Hierarchy後，就會得到下面這個介面：

這個介面一共分為四個部分，它們分別是：

Tree View 這裡面將Activity的所有View呈現成為一個樹形結構，它提供了以下幾種操作方式：
- 通過拖動條來放大或縮小可視範圍。
- 通過輸入類名或者View的id來迅速定位到需要分析的View
- 通過上方的Save as PNG或者Capture Layers儲存當前的樹形結構。
Tree Overview 這相當於是Tree View的縮小版，可以通過它快速檢視或者定位。
Properties View 當我們選取了一個View的時候，它會列出對應View的屬性。
Layout View 當我們選取了一個View之後，會在這個區域內，顯示出不同顏色的矩形框，其中紅色就是我們選取的View的範圍，而淡紅色則是該View對應的父容器的範圍，其它的白色矩形框既不是該View的父容器，也不是該View的子控制元件。

需要注意，當Window的佈局變化時，是不會主動重新整理的，如果我們想要檢視最新的佈局情況，那麼就要點選上方的Load View Hierarchy來重新整理，而如果我們想要去檢視別的Window佈局，那麼就需要點選下方操作欄最左邊的按鈕，重新進入選擇Window的視窗。

對於Tree View中的每個節點，我們可以獲得以下資訊：

View的類名
View所儲存的地址
View的id屬性值
View繪製的相對耗時分析，它會根據measure/layout/draw這三個階段，分為三個小點展示，而小點的顏色就代表了它在這個階段相對於View樹中的其他View在同一階段的耗時對比結果：
綠色：在前50%
黃色：在後50%
紅色：耗時最長
View處於它的父容器的index。

如果我們選擇了一個View，那麼會有更加詳細的資訊：

上面我們看到Hierarchy View可以得到繪製階段的耗時，這些耗時是在上一次繪製的時候計算出的，我們也可以通過這個工具主動地觸發重繪，以得到最新的結果，操作步驟為：

Hierarchy View對於我們平時開發中的作用主要是以下幾點：

檢視整個佈局的深度，是否可以去掉一些不必要的層級，以儘量使View樹保持扁平。
檢視measure、layout、draw當中那些紅色或者黃色的節點，但是由於這些節點的顏色是包含了它和它的子View的時間，因此我們分析的時候，需要根據具體情況看究竟是由於ViewGroup的子View過多，還是View過於複雜引起的這一問題。

今天主要介紹了Hierarchy Viewer和分析效能有關的用法，如果對於Inspect Screenshot有興趣的同學可以檢視下面官方文件的其它部分：

http://android.xsoftlab.net/tools/debugging/debugging-ui.html