Android SDKにはViewの階層を確認できるHierarchy Viewerというツールが入っています。
Activityの中にViewPagerが入っててFragmentがあって中にListViewがあってアイテムのレイアウトがあって中にはpartialレイアウトがあって、実際今見ている画面のレイアウトどうなってんの?みたいな時も一目で階層構造がわかります。
Viewの中でどこがどのくらいの時間でレンダリングされたかも確認できるので、ボトルネックを探す時にも役立ちます。そんなHierarchy Viewerの使い方メモです。
#ViewerServerの導入
Hierarchy Viewerは、ルート化された端末 or エミュレータじゃないと動きません。最新のAndroid SDKのツールだと動くらしいんですが、自分のGalaxy Note3だと動きませんでした。
そういう時は、ViewServerを入れると動きます。導入の仕方はこちらの記事がわかりやすかったです。 ⇒ 非rootなAndroid端末でHierarchy Viewerを使う方法
#起動
公式ドキュメントにはAndroidSdk/tools/hierarchyviewer
で起動すると書いてあるんですが、実際に打ってみるとそれは古いからAndroid Device Monitorを使えと言われます。
% ~/AndroidSdk/tools/monitor
Android Studioを使っている場合は、ツールバーのアイコンをクリックします。
起動直後はHierarchyViewが表示されていないので、右上の方のアイコンから起動します。
#端末に表示されているView階層を見る
端末をUSBでつないで、接続が確認できると、右側にアプリが表示されます。
最初は何も表示されていないので、手動でリロードしてやる必要があります。
表示はできてもこんな感じでMeasureやLayoutにかかった時間が表示されないことがあります。
そういう時は、このアイコンをクリックして少し待つと表示されるようになります。
ビューの簡単な説明
Tree Overview
オーバービューには全体の階層が表示されています。□でかこまれた領域がTreeViewに表示されます。
Layout View
現在のレイアウトが表示されています。ここを見たい、というレイアウトを選択すると、その位置にTreeViewが移動します。
Tree View
各レイアウトの要素の詳しい情報が表示されます。Measure、Layout、Drawにかかった時間や、どこが遅いか等が視覚的にわかります。
Googleの提唱するパフォーマンスTipsでは、Viewの構成は浅く広く作るのがよいとされています。
Hierarchy Viewで言えば、Tree Overviewを見た時に横に長くなるレイアウトよりも縦に長くなるレイアウトの方が望ましいということです。
結構動きが重くて若干使いづらいツールですが、Viewの最適化の第一歩として現状のレイアウトの状態を知るのにはとてもよいと思うので、参考にどうぞ!