图像元素匹配

什么是元素

元素指的我们软件中的各种元素，例如按钮、文本、下拉框、列表等等几乎所看到一切都属于元素，RPA的核心之一就是找到合适的元素后进行操作。例如聊天软件自动快速回复，一般我们需要找到聊天列表(获取消息)、消息输入框(输入消息)、以及发送按钮来完成此功能(发送消息)。

元素分类

什么是winpath

winxpath主要是提供类似xpath /Window[1]/Custom[2]/Group[1]/Group[6]/Button[1] 格式的元素遍历方式,这个可以直接通过使用元素捕获工具获得,上述字符串代表直接遍历获取一个计算器的按键1

使用元素捕获

元素捕获存放在 examples/元素捕获/界面捕获.bat 运行后可以直接使用元素捕获功能

使用提供的工具直接得到winPath

接着我们可以直接使用

//查找任务栏是否打开计算器
const app = ssf.ElementExt.find_task_bar("计算器", 5000);
//获取计算器窗口句柄(窗口id)
const hwnd = app.native_window_handle()
//解析winPath 获得按钮
const button1=ssf.ElementExt.parse(hwnd,'/Window[1]/Custom[2]/Group[1]/Group[6]/Button[1]',5000)
button1.click()
button1.click()

执行完毕此时界面上会直接自动点击按钮1两次

浏览器元素

注意需要安装浏览器插件才能驱动浏览器，相关可参阅浏览器控制入门
浏览器元素查找可使用基于自身html元素得查找方式，此查找方式需要使用xpath,xpath是一种可以针对html元素进行查找的语法,xpath可以直接使用浏览器获取
同样也可以使用winxpath获取浏览器元素,winxpath是更为通用的手段,但是winxpath在浏览器的元素捕获准确度上不如浏览器自身xpath

图像元素

在日常开发中，会遇到有些元素无论怎么捕获都捕获不到，这是因为这些元素属于自绘控件,可以理解为是高度自定义的控件，比如做单机游戏测试里面的按钮，很多都是无法捕获的,那么我们如何定位这些按钮呢

基于模板匹配查找

我们以单机游戏土豆兄弟为例，我们要让他自动开局选角色，首先要判断游戏按键，而这些游戏按键是不能用元素捕获捕获得到的,这时候我们可以借助模板匹配去匹配这些按钮，而模板的意思是将这些按钮截取成一小张，如图
截取后我们获得
接着我们编写代码

//寻找土豆兄弟窗口
const app = ssf.ElementExt.find_task_bar("Brotato", 5000);
const hwnd = app.native_window_handle()
const scale = 0.3; // 缩放比例,等比缩放能加快模板匹配的速度

console.log(hwnd)
ssf.Windows.switch_to_this_window(hwnd)
//等待窗口切换
ssf.Sys.sleep(200)
ssf.Frame.init()
//实时捕获一张图片,.可以使用while不停刷新屏幕获取图片
const img=ssf.Frame.to_image(20,1000)
const info=img.info()
img.resize(info.width*scale,info.height*scale)
// img.save("d:\\test.png")
//target为你的目标图像
const find_img=ssf.Image.load("./target.png");
// find_img.save("d:\\test1.png")
const find_info=find_img.info()
find_img.resize(find_info.width*scale,find_info.height*scale)
//0.99代表阈值,这边的取值越大越精准,最大不超过1
const result=img.find(find_img,0.99,4) 

if(result.length>0){
    const originalX = result[0].x / scale;
    const originalY = result[0].y / scale;
    console.log(originalX,originalY)
}

基于OCR查找

ocr不仅仅是用于从图片识别文字,还可以返回文字所在坐标所以我们也可以利用ocr获取图像按钮位置,同时ocr将使用显卡进行推理,实际速度在4k分辨率底下使用amd 7900xtx能达到毫秒级返回,显卡推理支持nvida和amd

//加载ocr模型
ssf.ai.OCR.init_model("./models/ppocrv4server/")
ssf.Frame.init()
//寻找土豆兄弟窗口
const app = ssf.ElementExt.find_task_bar("Brotato", 5000);
const hwnd = app.native_window_handle()
ssf.Windows.switch_to_this_window(hwnd)
ssf.Sys.sleep(500)
const screen_img=ssf.Frame.to_image(20,1000)
const window_rect=app.bounding_rectangle()
console.log(window_rect)
const crop_img=screen_img.crop_imm(window_rect.x,window_rect.y,window_rect.w,window_rect.h)

let r=ssf.ai.OCR.parse(crop_img)
r.forEach(element => {
    console.log(element.x,element.y,element.text)
});

上面代码将返回文字对应坐标如图

基于颜色查找

颜色查找就是基于截图rgb得到颜色,可用qq或者wx截图获取颜色,比如按钮是灰色的,利用这个特征我们查找灰色的位置一般能找到按钮所在位置,但是这种当多个按钮颜色相同获取就不如其他方法精准

ssf.Frame.init()
const app = ssf.ElementExt.find_task_bar("Brotato", 5000);
const hwnd = app.native_window_handle()
ssf.Windows.switch_to_this_window(hwnd)
ssf.Sys.sleep(500)
const screen_img=ssf.Frame.to_image(20,1000)
const window_rect=app.bounding_rectangle()
const crop_img=screen_img.crop_imm(window_rect.x,window_rect.y,window_rect.w,window_rect.h)
//根据颜色查找灰色得开始按钮,80代表查找颜色得宽度 10代表高度,这样能更进一步缩减范围
console.log(JSON.stringify(crop_img.find_color(201, 201, 202,0,0,80,10)))

基于目标检测

这是一种使用AI的检测手段，几乎是最为万能和智能的手段,模板匹配和颜色查找的手段经常识别不了动态的物体，比如移动的目标,这种时候几乎只能使用目标检测来识别,ssfrpa支持yolov8各种尺寸模型,可以选择默认的模型自己训练后使用. 我们除了官网的yolov8模型,不提供任何其他经过再次训练的模型。支持显卡高速推理

const img = ssf.Image.load("要识别的图片路径,也可以使用屏幕截图")


const keys = [
    "person", "bicycle", "car", "motorcycle", "airplane", "bus", "train", "truck", "boat", "traffic light",
    "fire hydrant", "stop sign", "parking meter", "bench", "bird", "cat", "dog", "horse", "sheep", "cow", "elephant",
    "bear", "zebra", "giraffe", "backpack", "umbrella", "handbag", "tie", "suitcase", "frisbee", "skis", "snowboard",
    "sports ball", "kite", "baseball bat", "baseball glove", "skateboard", "surfboard", "tennis racket", "bottle",
    "wine glass", "cup", "fork", "knife", "spoon", "bowl", "banana", "apple", "sandwich", "orange", "broccoli",
    "carrot", "hot dog", "pizza", "donut", "cake", "chair", "couch", "potted plant", "bed", "dining table", "toilet",
    "tv", "laptop", "mouse", "remote", "keyboard", "cell phone", "microwave", "oven", "toaster", "sink", "refrigerator",
    "book", "clock", "vase", "scissors", "teddy bear", "hair drier", "toothbrush"
];
//加载yolov8模型,这里我们使用yolov8官网模型,官网模型的类别如上所示
ssf.ai.Detection.init_model("./models/yolov8/", keys)

//输出识别结果

let r = ssf.ai.Detection.parse(img)
r.forEach(element => {
    console.log(element.x, element.y, element.label)
});