使用Hierarchy Viewer分析优化布局性能

打开Hierachy Viewer

• 配置环境变量为在真机上使用Hierarchy Viewer分析性能做准备
  将手机调整到开发者模式在这里就不罗嗦了，添加环境变量：
  ANDROID_HVPROTO
  ddm
  配置完成后，重启计算机
• 打开Hierarchy Viewer进行分析
  在手机上打开想要调试的APP（正式打包的不行）
  到D:\android\sdk\tools路径下，双击monitor.bat文件，你可能会有疑惑不是hierarchyviewer.bat吗？没关系，仅仅是双击hierarchyviewer.bat depressed,如果提示在xx路径下面找不到jre之类的信息，把你jdk按照目录下的jre文件夹直接copy一份到指定的位置，再次启动即可。
  ![这里写图片描述]
  
  选中要分析的APP，点击右上角的按钮。
  
  如果没有出现红黄绿色的按钮和相关的测试数据，在主要显示区中选中某一个节点，点击右上角的一个三色的按钮，就ok了。

红黄绿含义和对布局性能分析的指导

当APP性能低下的时候，仅仅表明红色dot可能存在问题。由于这里的颜色值是一个相对值，总是会有一个最慢的节点，确保它应该是最慢的。

• 如果red dot在一个叶子节点或者一个只有几个子节点的ViewGroup上，可能会存在一些问题。APP整体表现可能不坏，但是你要意识到那个节点为什么是红色的!可以使用Systrace或者 TraceView做进一步的分析。
• 如果ViewGroup的Measure 是红色的，要分析一下它的子节点。
• 如果View存在黄色甚至红色dot,可能在手机上的运行效率并不慢，可能是由于view的数目过多造成的。可以使用Systrace或者 TraceView做进一步的分析。
• 如果一个层级结构的根节点measure dot是红色的，layout dot是红色的，draw dot是黄色的，这是一种非常典型的情况，因为它是所有节点的根节点。
• 如果一个有20+ view的层级结构中，一个叶子节点draw dot是红色的，那肯定是问题，检查一下它的onDraw方法。

使用Hierarchy Viewer的简单例子

slow.xml文件如下：

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"    xmlns:tools="http://schemas.android.com/tools"    android:layout_width="match_parent"    android:layout_height="100dp"    android:orientation="horizontal" >    <ImageView        android:id="@+id/iv"        android:layout_width="0dp"        android:layout_height="match_parent"        android:layout_weight="1"        android:contentDescription="@null"        android:src="@drawable/ic_launcher" />    <LinearLayout        android:id="@+id/ll_right"        android:layout_width="0dp"        android:layout_height="match_parent"        android:layout_weight="4"        android:orientation="vertical" >        <TextView            android:id="@+id/tv_title"            android:layout_width="match_parent"            android:layout_height="0dp"            android:layout_weight="1"            android:background="#ff0000"            android:text="This is Title!" />        <TextView            android:id="@+id/tv_content"            android:layout_width="match_parent"            android:layout_height="0dp"            android:layout_weight="4"            android:background="#00ff00"            android:text="This is Content!" />    </LinearLayout></LinearLayout>

MainActivity代码如下：

public class MainActivity extends Activity {    @Override    protected void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        setContentView(R.layout.slow);    }    }

使用Hierarchy Viewer分析如下：

这里在强调一下这里都是相对值，单纯的看Measure/Layout/Draw没有意义。由于手机或者PC CPU负载的变化每一次获取的图片都可能不一样，可以通过点击上图的三色按钮进行刷新。这里发现id/ll_right的Measure是红色的，这里符合提到的第一条和第二条，分析一下id/ll_right的子节点， 应该很快发现，Android中不提倡使用weight,咱们这里使用了weight的嵌套，更是大忌。官方文档是这么说的

It is a common misconception that using the basic layout structures leads to the most efficient layouts. However, each widget and layout you add to your application requires initialization, layout, and drawing. Furthermore, ***nesting several instances of LinearLayout that use the layout_weight parameter can be especially expensive as each child needs to be measured twice.*** This is particularly important when the layout is inflated repeatedly, such as when used in a ListView or GridView.

使用layout_weight参数的多级嵌套LinearLayout，每一个孩子节点需要测量两次。
优化一下，修改一下布局参数：

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"    xmlns:tools="http://schemas.android.com/tools"    android:layout_width="match_parent"    android:layout_height="100dp"    android:orientation="horizontal" >    <ImageView        android:id="@+id/iv"        android:layout_width="wrap_content"        android:layout_height="match_parent"        android:contentDescription="@null"        android:src="@drawable/ic_launcher" />    <TextView        android:id="@+id/tv_title"        android:layout_width="match_parent"        android:layout_height="wrap_content"        android:layout_toRightOf="@id/iv"        android:background="#ff0000"        android:text="This is Title!" />    <TextView        android:id="@+id/tv_content"        android:layout_width="match_parent"        android:layout_height="match_parent"        android:layout_below="@id/tv_title"        android:layout_toRightOf="@id/iv"        android:background="#00ff00"        android:text="This is Content!" /></RelativeLayout>

MainActivity代码如下：

package com.example.hierarchyviewdemo;import android.app.Activity;import android.content.Context;import android.os.Bundle;import android.util.DisplayMetrics;import android.widget.ImageView;import android.widget.RelativeLayout;import android.widget.TextView;public class MainActivity extends Activity {    @Override    protected void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        setContentView(R.layout.improved);        final ImageView iv = (ImageView) findViewById(R.id.iv);        RelativeLayout.LayoutParams ivParams = (RelativeLayout.LayoutParams) iv                .getLayoutParams();        ivParams.width = getScreenWidth(this) / 5;        ivParams.height = RelativeLayout.LayoutParams.MATCH_PARENT;        final TextView titleView = (TextView) findViewById(R.id.tv_title);        RelativeLayout.LayoutParams titleParams = (RelativeLayout.LayoutParams) titleView                .getLayoutParams();        titleParams.width = RelativeLayout.LayoutParams.MATCH_PARENT;        titleParams.height = dip2px(this, 100) / 5;    }    public static int getScreenHeight(Activity packageContext) {        DisplayMetrics metrics = new DisplayMetrics();        packageContext.getWindowManager().getDefaultDisplay()                .getMetrics(metrics);        return metrics.heightPixels;    }    public static int getScreenWidth(Activity packageContext) {        DisplayMetrics metrics = new DisplayMetrics();        packageContext.getWindowManager().getDefaultDisplay()                .getMetrics(metrics);        return metrics.widthPixels;    }    public static int dip2px(Context context, float dipValue) {        final float scale = context.getResources().getDisplayMetrics().density;        return (int) (dipValue * scale + 0.5f);    }}

看一下效果：

这里分析很粗错，仅仅起到一个抛砖引玉的作用，希望能给大家有点引导作用。

翻译地址

https://developer.android.com/tools/performance/hierarchy-viewer/profiling.html#InterpretingResults
http://developer.android.com/training/improving-layouts/optimizing-layout.html#Inspect