什么是Stetho
Stetho是Facebook出的一款Android调试工具
我们可以用它在Chrome DevTools下查看应用的布局、网络请求、Sqlite、SharedPreference并能通过js来调试代码(使用js进行调试的时候FB只做了初步封装,使用起来会比较麻烦,需要自己进一步封装)
来点截图(取自官网)
Chrome DevTools
查看网络请求
数据库(可读写)
查看布局(双向查看)
- 用鼠标放在Element面板中的xml节点上,会在应用中高亮对应的布局
- 点击Element左边的放大镜,然后点击应用中的布局,会自动跳转到Element面板中的xml节点
Javascript Console
在代码中配置stetho
build.gradle
|
|
YourApplication.java
|
|
BaseActivity.java
|
|
DebugUtils.java
因为不想把stetho添加到release中,所以需要通过gradle的buildType特性,对debug版和release版做不同处理
debug的配置
在src目录下添加debug/java目录,并在java目录中添加相应的package(比如,DebugUtils将添加到com.yourname.tools.util中,那么就在debug/java目录中新建com.yourname.tools.util包,并在util包下新建DebugUtils.java文件)
release的配置
在src目录下添加release/java目录,并在java目录中添加相应的package(文件名同上,但是里面的函数都是空实现)
其他buildType的配置(参照debug或release)
PS:网络配置
公司现在用的是HttpUrlConnection,Stetho配置这个的时候侵入性比较强,暂时也用不到,所以不做配置
如果需要HttpUrlConnection的配置,可以参看官网Demo的配置
如果用的是okhttp,可以参看官网的这个配置
编译运行应用
启动dev控制台
在Chrome的地址栏中输入:
启动以后,在页面上应该会出现对应的包名、应用名称,选择需要调试的应用,点击 inspect ,开始调试
PS:一直加载刷新不出来
如果启动后一直是加载状态,需要使用VPN翻墙,成功加载一次以后就不需要了
调试
Elements面板
- 可以查看当前Activity的布局;
- Elements显示的xml中,YourApplication是根节点,直属子节点是对应的Activity,如果跳转到新的Activity,新的Activity会堆叠到旧Activity之上,就像栈一样;
- 在Elements的xml节点上移动鼠标,会在手机屏幕上高亮显示对应的区域;
- 点击Elements旁边的放大镜(变成蓝色),然后点击屏幕,随后xml会自动定位到你点击的节点;
- 在Styles面板中可以看到布局元素的属性值.
- bug?
查看不了Dialog的布局信息
Resource面板
- Web SQL:中可以查看Sqlite的信息
- 点击数据库名称,可以输入sql语句直接操作数据库
- 点击表名,可以查看该表的所有数据
- Local Storage:中可以查看SharedPreferences的信息
Console面板
- context相当于Application对象
- 如果加入了之前的封装(DebugUtils等)
- 通过context.mAct获得当前windows中的Activity
- 通过context.mAct.公有属性名,可以获取mAct中public属性变量的值
- 通过context.mAct.getField(fieldName)可以获取到这个Activity中的私有变量值(当然也可以获取public的)
- 如果获取的是一个对象,eg:context.mAct.mTvMessage(mTvMessage是个TextView),可能不能直接操作该对象的方法,需要使用importPackage(android.widget),引入该对象所在的包(将包内的所有java对象引入到jsRuntime中);或者使用importClass(android.widget.TextView),只引入TextView对象,此时才能使用context.mAct.mTvMessage.getText()方法
PS:其他
- 代码
- Android Studio
如果觉得Android Studio卡,可以尝试修改Studio的配置,增加其使用的内存大小
window下:
studio安装目录\bin\sudio64.exe.vmoptions: