Hierarchy Viewer是随AndroidSDK发布的工具,位置在tools文件夹下,名为hierarchyviewer.bat。它是Android自带的非常有用而且使用简单的工具,可以帮助我们更好地检视和设计用户界面(UI),绝对是UI检视的利器,但是好像很少有人提它,难道是因为太简单?

具体来说主要功能有2个:

  1. 从可视化的角度直观地获得UI布局设计结构和各种属性的信息,帮助我们优化布局设计;
  2. 结合debug帮助观察特定的UI对象进行invalidate和requestLayout操作的过程。
  1. 基本使用方法

(1)hierarchyviewer的使用非常简单,启动模拟器或者连接上真机后,启动hierarchyviewer.bat,会看到下面的界面,Devices里列出了可以观察的设备,Windows里列出的是当前选中的设备的可以用来显示View结构的Window:

选中某个想要观察的Window,比如上面列出的com.android.launcher/com.android.launcher.Launcher项,然后点击菜单栏的Load View Hierarchy,就进入Layout View,由于要解析相关Window,所以这个过程要几秒钟,左边列出的是当前窗口的树型布局结构图,右边列出的是当前选中的某个子View的属性信息和在窗口中的位置:

需要注意的是:Layout View列出的View结构是从视图的根节点开始的,比如针对Launcher使用的layout,它的底层基础布局DragLayer实际上是放在一个FrameLayout里的,该FrameLayout又是被PhoneWindow的DecorView管理的。

(2)点击界面左下角类似九宫格的按钮,就进入了Android称之为Pixel Perfect View的界面,这个界面里主要是从细节上观察UI效果:

左边是浏览视图,中间是全局的视图,右边是当前关注的地方的细节放大,是像素级别的,对于观察细节非常有用。

Refresh Rate用来控制View多久从模拟器或者真机上更新一次视图数据。

Zoom就是放大局部细节用的,细节显示在最右边的视图上。

Overlay比较有意思,主要用来测试在当前视图上加载新的图片后的效果,点击Load…选择图片后,可以控制在当前界面上显示的透明读,滑动0%~100%的控件即可。如果选择了Show in Loupe,右侧的放大视图也会将加载的图片的细节结合着透明度显示出来。不过目前这个Overlay做的比较简单,合成的图只能从界面的左下角为原点画出来,不能移动。

(3)在Layout View中,选中一个view的图示,点击工具栏的Display View,就可以看到这个view的实际显示效果,可以点选Show Extras,这个功能也比较实用,可以显示出该View中不同元素显示的边界,帮助我们检查是否正确。

2.       Hierarchyviewer的invalidate和requestLayout功能

对于Android的UI来说,invalidate和requestLayout是最重要的过程,Hierarchyviewer提供了帮助我们Debug特定的UI执行invalidate和requestLayout过程的途径,方法很简单,只要选择希望执行这两种操作的View点击按钮就可以。当然,我们需要在例如onMeasure()这样的方法中打上断点。这个功能对于UI组件是自定义的非常有用,可以帮助单独观察相关界面显示逻辑是否正确。

Android工具 Hierarchy Viewer 分析的更多相关文章

  1. Android 实用工具Hierarchy Viewer实战

    在Android的SDK工具包中,有很多十分有用的工具,可以帮助程序员开发和测试Android应用程序,大大提高其工作效率.其中的一款叫Hierachy Viewer的可视化调试工具,可以很方便地在开 ...

  2. Android 卡顿优化 3 布局优化 工具 Hierarchy Viewer

    欲善其事, 先利其器. 分析布局, 就不得不用到Hierarchy Viewer了. 本文工具使用皆以GithubApp的详情界面RepoDetailActivity为例说明. 为了不影响阅读体验, ...

  3. Android 性能优化(2)性能工具之「Hierarchy Viewer 」Optimizing Your UI:分析哪个view有性能问题,查看屏幕上某像素点的坐标,颜色等

    Optimizing Your UI In this document Using Hierarchy Viewer Running Hierarchy Viewer and choosing a w ...

  4. Android优化——UI检视利器:Hierarchy Viewer

    在Android的SDK工具包中,有很多十分有用的工具,可以帮助程序员开发和测试Android应用程序,大大提高其工作效率.其中的一款叫 Hierachy Viewer的可视化调试工具,可以很方便地在 ...

  5. Android 性能优化(22)*性能工具之「Hierarchy Viewer」 Hierarchy Viewer Walkthrough

    Hierarchy Viewer Walkthrough 1.In this document Prerequisites Setting the ANDROID_HVPROTO variable W ...

  6. 【转】【Android工具】被忽略的UI检视利器:Hierarchy Viewer

    原文:http://blog.csdn.net/ddna/article/details/5527072 Hierarchy Viewer是随AndroidSDK发布的工具,位置在tools文件夹下, ...

  7. Android工具:Hierarchy Viewer

    Hierarchy Viewer 用途: 即可以用来优化自己的布局,也可以用来参考别人优秀的布局 打开方式: 运行工程,然后在\android-sdk-windows\tools目录下双击hierar ...

  8. Android 常用的性能分析工具详解:GPU呈现模式, TraceView, Systrace, HirearchyViewer(转)

    此篇将重点介绍几种常用的Android性能分析工具: 一.Logcat 日志 选取Tag=ActivityManager,可以粗略地知道界面Displaying的时间消耗.当我们打开一个Activit ...

  9. 在Android Studio下使用Hierarchy Viewer

    前言 最近看到这篇文章<Android UI性能优化详解>,里面使用了Hierarchy Viewer来对布局进行优化.开发android这么久了,一直都有听过这个工具,但是重来都没真正去 ...

随机推荐

  1. sql 2008 中不能创建数据库关系图

    执行以下命令: ALTER AUTHORIZATION ON DATABASE::[databasename] TO sa [databasename] 为数据库名: 此方法借鉴于<老高> ...

  2. Vue2.0 官方文档学习笔记

    VUE2.0官方文档 基础部分: 1.VUE简介 Vue是一个基于MVVM的框架,其中M代表数据处理层,V代表视图层即我们在Vue组件中的html部分,VM即M和V的结合层,处理M层相应的逻辑数据,在 ...

  3. MySQL表的碎片整理和空间回收小结

    MySQL表碎片化(Table Fragmentation)的原因 关于MySQL中表碎片化(Table Fragmentation)产生的原因,简单总结一下,MySQL Engine不同,碎片化的原 ...

  4. 洛谷 P1074 靶形数独

    题目描述 小城和小华都是热爱数学的好学生,最近,他们不约而同地迷上了数独游戏,好胜的他 们想用数独来一比高低.但普通的数独对他们来说都过于简单了,于是他们向 Z 博士请教, Z 博士拿出了他最近发明的 ...

  5. UVA 10382 Watering Grass (区间覆盖,贪心)

    问题可以转化为草坪的边界被完全覆盖.这样一个圆形就换成一条线段. 贪心,从中选尽量少的线段把区间覆盖,按照把线段按左端点排序,记录一个当前已经覆盖区间的位置cur, 从左端点小于等于cur选一个右端点 ...

  6. 【转】学习apicloud和IOS之间的模块化使用

    最近公司有使用APICloud发开的需求,需要我这边提供一些模块包得封装.因为没有也是刚接触APICloud,所以也就在看官方文档 .下面讲一讲我再使用过程中得一点点东西. 首先,下载官方SDK,下载 ...

  7. tpcc-mysql的安装和使用

    tpcc-mysql介绍 TPC(Tracsaction Processing Performance Council) 事务处理性能协会是一个评价大型数据库系统软硬件性能的非盈利的组织,TPC-C是 ...

  8. JavaScript深入浅出第2课:函数是一等公民是什么意思呢?

    摘要: 听起来很炫酷的一等公民是啥? <JavaScript深入浅出>系列: JavaScript深入浅出第1课:箭头函数中的this究竟是什么鬼? JavaScript深入浅出第2课:函 ...

  9. Vue中npm run build报“Error in parsing SVG: Unquoted attribute value”

    自己做的一个Vue项目,在打包时老是报这个错误 # Error in parsing SVG: Unquoted attribute value 查了查网上说的,都说报错原因是压缩和抽离CSS的插件中 ...

  10. c#自定义类型之间的转换(强制类型转换)

    public class ResultModel { public string PlateNumber { get; set; } public int PlateColor { get; set; ...