啄幕鸟控件拾取:点一点高效完成UI走查

啄幕鸟属于阿里巴巴开源项目之一,欢迎大家共建共享,项目地址:https://github.com/alibaba/youku-sdk-tool-woodpecker

啄幕鸟UI走查

啄幕鸟,即手机屏幕上的啄木鸟,通过啄幕鸟开发工具中的控件拾取功能,在屏幕上点一点即可查看UI元素的大小、间距、字体、字号、颜色等,配合测距条、UI对比等功能,视觉还原度随手查,高效完成UI走查。
啄幕鸟UI走查Demo:


UI走查Demo

如何使用控件拾取

  1. 点击啄幕鸟图标,在功能列表中点击UI检查。


    啄幕鸟控件拾取:点一点高效完成UI走查_第1张图片
  2. 点击“控件拾取”即可打开或关闭控件拾取功能。

    啄幕鸟控件拾取:点一点高效完成UI走查_第2张图片

  3. 点击想查看的控件,即可查看布局、颜色、字体等信息。


    啄幕鸟控件拾取:点一点高效完成UI走查_第3张图片

开启控件拾取后,点击想要查看的UI元素,即可直观看到元素的大小、位置、字体字号、颜色等信息,点击两个元素即可查看其间距,对于父子包含的元素,可先点击拾取父元素,再拾取子元素以查看相对布局。

Tips:双击可以拾取下一层控件。三指点击可以切换不同的拾取模式,跳过哪些不响应点击的控件。

对于某些不能通过控件拾取获取的大小间距,如行间距等,可以使用测距条测量。

如何使用测距条

在UI检查中,点击“测距条”即可打开或关闭测距条功能。

测距条功能:

  1. 点击“+”按钮添加一个测距条,可添加任意多个测距条。
  2. 单击一个测距条可将其选中,以改变其位置大小。
  3. 可在输入框按宽高输入测距条大小,宽高中间用空格隔开。
  4. 可通过按钮控制测距条的位置大小,按钮支持长按。
  5. 点击“Dp”按钮可改变控制精度为dp或像素。
  6. 双击一个测距条可以将其删除。
啄幕鸟控件拾取:点一点高效完成UI走查_第4张图片
测距条

接入啄幕鸟

通过pod快速接入啄幕鸟:

pod  'YKWoodpecker'  

一行代码打开啄幕鸟:

 #import "YKWoodpecker.h"

 // 显示啄幕鸟,启动后默认打开UI检查插件
 [[YKWoodpeckerManager shareInstance] show];

更多参见工程README,Github地址:https://github.com/alibaba/youku-sdk-tool-woodpecker

你可能感兴趣的:(啄幕鸟控件拾取:点一点高效完成UI走查)