autojs可视化控件位置

牙叔教程简单易学

使用场景

当我们找控件的时候, 代码查找的结果, 可能不符合我们的预期,

这个时候, 最好就把找到的控件的位置, 显示在屏幕上面,

方便我们排查问题

显示位置的方式

可以是一个点, 也可以是一个矩形

效果展示

autojs版本

原理

autojs有悬浮窗功能, 我们在悬浮窗上加一个画板, 画一个矩形,

假设我们的函数叫做showPosition

他应该有两个参数

第一个参数: 显示的位置信息, 可以是矩形, 也可以是一个点

第二个参数: 时间, 悬浮窗显示多久, 我们设置一个默认值2s

代码讲解

1. 函数签名

/*** @description:显示找到的位置* @param position {object | array} 位置数据* @param t {number | null} 悬浮窗显示时长* @return {boolean | error}*/
function showPosition(position, t) {...}
// position一共三种格式
// 第一种:
// {//   x:100,
//   y:100
// }
// 第二种:
// [100,200,300,400]
// 第三种:
// [100,200]

2. 设置悬浮窗显示时间的默认值

t = t || 2000;

3. 判断参数position类型

// 对象
if (Object.prototype.toString.call(position) === "[object Object]")
// 数组
if (Object.prototype.toString.call(position) === "[object Array]")
// 数组长度
if (position.length === 4) {...}
if (position.length === 2) {...}

4. 提取位置数据

let left = position[0];
let top = position[1];
let right = position[2];
let bottom = position[3];
---或者---
let x = position.x;
let y = position.y;
---或者---
let x = position[0];
let y = position[1];

5. 位置可视化

shwPoint(x, y, t);
showRect(left, top, right, bottom, t);

具体函数

1. 显示矩形

function showRect(left, top, right, bottom, t) {let obj = getFloatingWindow();obj.paint.setStrokeWidth(30);obj.canvas.drawRect(left, top, right, bottom, obj.paint);releaseResources(obj, t);
}

2. 显示点

function shwPoint(x, y, t) {let obj = getFloatingWindow();obj.paint.setStrokeWidth(30);obj.canvas.drawPoint(x, y, obj.paint);releaseResources(obj, t);
}

3. 释放资源

function releaseResources(obj, t) {setTimeout(function () {obj.window && obj.window.close();obj.bitmap && obj.bitmap.recycle();engines.myEngine().forceStop();}, t);
}

4. 随机颜色

function getRndColor() {let color = new java.util.Random();return (randomColor = colors.rgb(color.nextInt(256), color.nextInt(256), color.nextInt(256)));
}

声明

部分内容来自网络

微信公众号 AutoJsPro教程

QQ群

747748653

完整源码

autojs可视化控件位置相关推荐

【storybook】你需要一款能在独立环境下开发组件并生成可视化控件文档的框架吗？（一）
storybook 介绍入门说说用法 prop-types .stories.jsx 下一篇: https://blog.csdn.net/tuzi007a/article/details/129 ...
动态顺序图可视化控件
目录介绍为什么要使用它? 分布式系统的端到端跟踪调试器背景使用代码示例如何使用控件怎么运行的 Tick()方法元素渲染 API引用顺序参加者消息激活方框 SequenceD ...
体验Dundas Dashboard数据可视化控件
概述:Dundas公司开发的Dundas Dashboard是集所有需求于一体的商业智能仪表盘,这款仪表盘控件提供大量完全可定制的交互式图表.仪表.地图和记分卡等等,开启即可使用,这意味着您总能快捷方 ...
WPF实现可视化控件打印及打印预览
打印预览XAML代码: <controls:WindowEx x:Class="SunCreate.Vipf.Client.UI.MapPrintPreview"xmlns= ...
【storybook】你需要一款能在独立环境下开发组件并生成可视化控件文档的框架吗？（三）
storybook 插件addons 核心插件插件API argTypes 写文档组件注释法 MDX 生成在线可视化UI文档上一篇: https://blog.csdn.net/tuzi007a ...
【storybook】你需要一款能在独立环境下开发组件并生成可视化控件文档的框架吗？（二）
storybook 回顾继续说说用法配置文件介绍回顾上篇博客地址: https://blog.csdn.net/tuzi007a/article/details/129192502 说了部分用 ...
WPF数据可视化控件（一） LED风格数字控件
原帖地址:https://blog.csdn.net/zhuo_wp/article/details/81561190 资源源码:https://download.csdn.net/download/ ...
unity UGUI系统梳理 - 常用可视化控件
作为一名合格的UI仔>.<,我发现很多UI很久没有使用了,所以我决定做一个UGUI系列博客重新梳理一下 1.Image 在没有放入图片下,image控件长这样注意我一般没交互需求的情况 ...
Android开源项目个性化控件(View)
Android开源项目--个性化控件(View) Android开源项目 --个性化控件(View),这次主要给大家介绍一些Android开发中用到的不错的个性化View,包括ListView.Act ...