-UI调试工具 SAK 布局 MD

Markdown版本笔记 我的GitHub首页 我的博客 我的微信 我的邮箱
MyAndroidBlogs baiqiantao baiqiantao bqt20094 [email protected]

目录

SwissArmyKnife

SwissArmyKnife
autopilot 分支
效果视频

SwissArmyKnife 是一款方便调试android UI的工具。可以直接在android设备屏幕上显示控件的相关信息

接入方式

compile 'com.wanjian:sak:2.0.2'

no opt 包

compile 'com.wanjian:sak-nop:0.0.3'
//开启
SAK.init(Application application, Config config)

//关闭
SAK.unInstall();

启动app后会在屏幕右侧看到一个 蓝色靶心双击即可进入功能界面。

Tips:
当开启新窗口时(包括新的Activity、弹出dialog、pop),需要手动点击一次屏幕右侧的 靶心 按钮,以此激活当前窗口,不然当前窗口不会启用 SwissArmyKnife!

自动初始化版本

自动初始化版本

Autopilot 版基于com.wanjian:sak:xx.xx.xx,实现了自动初始化,只需要在gradle中引入依赖即可,不需要编写额外的初始化代码

接入方式

compile 'com.wanjian:sak-autopilot:2.0.1'

no opt 包

compile 'com.wanjian:sak-nop:0.0.3'

开启及关闭
在控制台执行 adb shell am broadcast -a com.sak命令即可开启及关闭

支持的功能

Tips:
编辑控件、相对距离、移动控件,这几个功能相互冲突,请勿同时开启

常用的功能

  • Activity、Fragment名称:可以看到当前Activity的类名,每一个Fragment的类名。
  • 相对距离:依次长按两个控件即可显示两个控件间的水平和竖直距离
  • 拾取控件:拖动圆环到要拾取的控件位置,可以获取控件id、类型、位置、背景色、宽高、边距、字体大小颜色等信息
  • 取色器:会在屏幕显示绿色圆环,可以任意拖动,屏幕下方会显示圆环中心的颜色值(圆环的颜色也会改变)
  • 水平直尺、竖直直尺:会在屏幕显示水平直尺和竖直直尺,可以任意拖动进行测量,直尺上有px和dp两个值
  • 边框:显示所有View的边界(类似开发者选项中的"显示布局边界"功能)

其他支持的功能

  • 编辑控件长按需要编辑的控件即可弹出编辑窗口,可以修改内外边距大小、宽高、背景色、字体颜色大小等
  • 移动控件长按控件即可拖动
  • Scalpel:解剖刀,会立体显示view,可以直观的查看view的层级关系,拖动屏幕左侧的按钮可以切换角度
  • 网格:显示网格
  • 字体大小:显示所有TextView的大小
  • 字体颜色:显示所有TextView的颜色
  • 外边距:显示所有View的外边距(Margin)的大小(会填充一个背景色)
  • 内边距:显示所有View的内边距(Padding)的大小(会填充一个背景色)
  • 宽高:显示所有View的宽高
  • 图片宽高:显示所有ImageView的宽高
  • 背景色:显示所有设置background的控件的背景色的值
  • 自定义信息
  • View类型:显示所有View的类型
  • 布局树:显示布局树
  • 性能:可以看到当前窗口view的绘制耗时、事件分发耗时、measure耗时、layout耗时、handler耗时等信息
    • 开启后会自动禁用硬件加速,实际绘制时间可能要少一些
    • ListView会在事件分发时调用getView,所以ListView事件分发时间稍微长一些
    • RecyclerView会在view绘制时bindView,所以RecyclerView绘制时间会稍长一些

可配置项

可配置项

  • 层级区间:Fragment名称、外边距、内边距、宽高、字体大小、字体颜色、背景色等功能下,可以通过设置层级区间过滤掉部分view,避免数值相互覆盖
  • 单位:距离默认单位是dp,可以切换为dp、sp、px单位
  • 裁剪绘制范围:若内外边距、宽高、字体颜色等信息不显示,可以关闭 裁剪绘制。开启该功能可以避免可以滚动的控件滚动后导致的信息覆盖问题。

原理

实现过程:

  • 监听window的创建,从而拿到每一个window的根view。
  • 拿到根view(必须是FrameLayout或RelativeLayout)后给根view添加RootContainerViewRootContainerView内部包含了蓝色的靶心view。每个window都有一个专用的RootContainerView
  • 创建各window共用的DashBoardViewDashBoardView是其他各功能view的容器,比如开启取色功能后会把TakeColorView加到DashBoardView中。
  • 双击当前窗口的靶心按钮会在当前窗口激活 SwissArmyKnife,其实是把共用的DashBoardView添加到了当前窗口的RootContainerView中。
  • 每一个功能都是AbsLayer的子类,AbsLayer继承自FrameLayout。当当前窗口的任何一个view需要绘制时都会调用AbsLayeronUiUpdate方法,可以在该方法里绘制相关信息,比如边框,字体颜色等。

自定义功能

可以通过 Config 对 SAK 进行配置或自定义功能。

public class App extends Application {
    @Override
    public void onCreate() {
        super.onCreate();
        Config config = new Config.Build(this)
            .viewFilter(getViewFilter())
            .addLayerView(getLayerView())
            .addSizeConverter(getSizeConverter())
            .build();
        SAK.init(this, config);
    }
    
    private ISizeConverter getSizeConverter() {
        return new ISizeConverter() {
            // 可以添加自定义的SizeConverter,默认提供了Origin*、Px2Dp*,Px2Sp*
            @Override
            public String desc() {
                return "my converter";
            }
            
            @Override
            public Size convert(Context context, float length) {
                return Size.obtain().setLength(length / 2).setUnit("myU");
            }
            
            @Override
            public int recovery(Context context, float length) {
                return 0;
            }
        };
    }
    
    private AbsLayer getLayerView() {
        // 可以添加自定义的view,自定义的view要继承自AbsLayer或其子类,AbsLayer是FrameLayout的子类
        // 当激活SwissArmyKnife时会调用 onAttached(View rootView)方法,rootView是当前window的根view,比如Activity的根view DecorView。
        //当停用是会调用`onDetached`
        return new AbsLayer(this) {
            @Override
            public String description() {
                return null;
            }
            
            @Override
            public Drawable icon() {
                return null;
            }
        };
    }
    
    private ViewFilter getViewFilter() {
        return new ViewFilter() {
            @Override
            public boolean apply(View view) {
                // 这里可以决定要显示哪种view,比如只显示ImageView子类和LinearLayout子类
                // 若想要显示所有可见的view,直接返回 view.getVisibility()==View.VISIBLE 即可
                return view instanceof ImageView || view instanceof LinearLayout;
            }
        };
    }
}

2019-6-30

猜你喜欢

转载自www.cnblogs.com/baiqiantao/p/11108512.html
md