本申请公开了一种UI控件关联走查方法、装置、设备及存储介质,通过捕获前端页面包含的所有控件对应的元素信息,并按照预设标签对控件进行分类,形成控件集合,进一步地基于控件集合中各控件的面积进行控件集合的去重,最后根据坐标和预设优先级将控件进行两两关联,按照预设控件比对规则确定关联控件集合中存在的问题控件,实现了多控件的元素间的条件比对,提供了更为精准的间距走查,降低人工走查成本,提高走查效率。
【技术实现步骤摘要】
本申请涉及数据处理,尤其涉及一种ui控件关联走查方法、装置、设备及存储介质。
技术介绍
1、在当今数字化时代,前端开发已成为软件开发中不可或缺的一环。随着用户对网页和应用程序界面(ui)的美观性和功能性要求不断提高,前端开发的质量控制变得尤为重要。其中,页面元素之间的间距走查是确保用户界面整洁、协调和易于使用的关键因素之一。
2、开发页面的控件走查形式多样,直观的走查条件,只需要对单个控件比对即可。对于间距这种需要多控件关联的走查条件,目前缺乏具体的解决方案。
技术实现思路
1、本申请提供了一种ui控件关联走查方法、装置、设备及存储介质,实现了多控件的元素间的条件比对,提供了更为精准的间距走查,降低人工走查成本,提高走查效率。
2、有鉴于此,本申请第一方面提供了一种ui控件关联走查方法,所述方法包括:
3、步骤s1、捕获目标页面的所有控件对应的元素信息;
4、步骤s2、对所述元素信息按照预设标签进行分类,形成与所述预设标签对应的若干个控件集合;
5、步骤s3、基于所述控件集合中各控件的面积,分别对各个控件集合进行去重处理;
6、步骤s4、将去重后的所述控件集合中包含的控件按照预设优先级以及坐标进行两两关联,形成与所述预设标签对应的若干个关联控件集合;
7、步骤s5、基于预设控件比对规则,按照所述预设标签对所述关联控件集合进行比对,确定问题控件。
8、可选地,所述步骤s3具体为:
<
p>9、步骤s31、计算若干个所述控件集合中各控件的面积;10、步骤s32、按照面积降序分别对所述控件集合中的控件进行排序;
11、步骤s33、构建所述控件集合的关系存储数组,所述关系存储数组中包含前置控件以及后置控件组;
12、步骤s34、按照排序遍历,将第i个控件赋值给所述前置控件;
13、步骤s35、依次计算第i个控件的面积与所述第i个控件之后的其余控件的面积之间的iou交并比值;
14、步骤s36、当iou交并比值大于预设阈值时,将对应的所述第i个控件之后的控件赋值给所述所述后置控件组;
15、步骤s37、根据后置控件组中包含控件的数量,取出去重后的代表控件,得到去重后的所述控件集合包含若干个所述代表控件。
16、可选地,所述步骤s37具体为:
17、当所述后置控件组中包含两个以上数量的控件时,将所述后置控件组中第二位对应的控件作为代表控件取出,否则将所述后置控件组中首位对应的控件作为代表控件取出。
18、可选地,所述步骤s4具体为:
19、步骤s41、将所述控件集合包含的若干个所述代表控件按纵坐标进行降序排序;
20、步骤s42、创建关联控件集合;
21、步骤s43、按序依次遍历所述控件集合包含的所述代表控件,根据横坐标以及预设优先级差异,将两两关联的所述代表控件组合添加至所述关联控件集合。
22、可选地,所述步骤s43具体为:
23、步骤s431、按序依次遍历所述控件集合包含的所述代表控件,将第i个所述代表控件添加至所述关联控件集合中;
24、步骤s432、遍历第i个代表控件之后的其余代表控件,依次比较第i个代表控件与所述第i个代表控件之后的其余代表控件目标位置的横坐标差值以及在前端页面的预设优先级差值;
25、步骤s433、若存在一个其余代表控件与第i个代表控件的所述横坐标差值与所述预设优先级差值均低于对应的预设阈值,则将对应的其余代表控件作为所述第i个代表控件的关联控件,添加至所述关联控件集合中,否则将i=i+1后,返回执行所述步骤s431。
26、可选地,所述步骤s431还包括:
27、若第i个所述代表组件已存在于所述关联控件集合中,则将i=i+1后,重新执行所述步骤s431。
28、可选地,所述步骤s5之后还包括:
29、步骤s6、将若干个所述问题控件的信息进行打包后,发送给目标用户进行告警。
30、本申请第二方面提供一种ui控件关联走查装置,所述装置包括:
31、捕获单元,用于捕获目标页面的所有控件对应的元素信息;
32、分类单元,用于对所述元素信息按照预设标签进行分类,形成与所述预设标签对应的若干个控件集合;
33、去重单元,用于基于所述控件集合中各控件的面积,分别对各个控件集合进行去重处理;
34、关联单元,用于将去重后的所述控件集合中包含的控件按照预设优先级以及坐标进行两两关联,形成与所述预设标签对应的若干个关联控件集合;
35、比对单元,用于基于预设控件比对规则,按照所述预设标签对所述关联控件集合进行比对,确定问题控件。
36、可选地,所述去重单元,具体用于:
37、计算若干个所述控件集合中各控件的面积;
38、按照面积降序分别对所述控件集合中的控件进行排序;
39、构建所述控件集合的关系存储数组,所述关系存储数组中包含前置控件以及后置控件组;
40、按照排序遍历,将第i个控件赋值给所述前置控件;
41、依次计算第i个控件的面积与所述第i个控件之后的其余控件的面积之间的iou交并比值;
42、当iou交并比值大于预设阈值时,将对应的所述第i个控件之后的控件赋值给所述所述后置控件组;
43、根据后置控件组中包含控件的数量,取出去重后的代表控件,得到去重后的所述控件集合包含若干个所述代表控件。
44、可选地,所述根据后置控件组中包含控件的数量,取出去重后的代表控件,得到去重后的所述控件集合包含若干个所述代表控件具体为:
45、当所述后置控件组中包含两个以上数量的控件时,将所述后置控件组中第二位对应的控件作为代表控件取出,否则将所述后置控件组中首位对应的控件作为代表控件取出。
46、可选地,所述关联单元,具体用于:
47、将所述控件集合包含的若干个所述代表控件按纵坐标进行降序排序;
48、创建关联控件集合;
49、按序依次遍历所述控件集合包含的所述代表控件,根据横坐标以及预设优先级差异,将两两关联的所述代表控件组合添加至所述关联控件集合。
50、可选地,所述按序依次遍历所述控件集合包含的所述代表控件,根据横坐标以及预设优先级差异,将两两关联的所述代表控件组合添加至所述关联控件集合具体为:
51、按序依次遍历所述控件集合包含的所述代表控件,将第i个所述代表控件添加至所述关联控件集合中;
52、遍历第i个代表控件之后的其余代表控件,依次比较第i个代表控件与所述第i个代表控件之后的其余代表控件目标位置的横坐标差值以及在前端页面的预设优先级差值;
53、若存在一个其余代表控件与第i个代表控件的所述本文档来自技高网
...
【技术保护点】
1.一种UI控件关联走查方法,其特征在于,包括:
2.根据权利要求1所述的UI控件关联走查方法,其特征在于,所述步骤S3具体为:
3.根据权利要求2所述的UI控件关联走查方法,其特征在于,所述步骤S37具体为:
4.根据权利要求2所述的UI控件关联走查方法,其特征在于,所述步骤S4具体为:
5.根据权利要求4所述的UI控件关联走查方法,其特征在于,所述步骤S43具体为:
6.根据权利要求5所述的UI控件关联走查方法,其特征在于,所述步骤S431还包括:
7.根据权利要求1所述的UI控件关联走查方法,其特征在于,所述步骤S5之后还包括:
8.一种UI控件关联走查装置,其特征在于,包括:
9.一种UI控件关联走查设备,其特征在于,所述设备包括处理器以及存储器:
10.一种计算机可读存储介质,其特征在于,所述计算机可读存储介质用于存储程序代码,所述程序代码用于执行权利要求1-7任一项所述的UI控件关联走查方法。
【技术特征摘要】
1.一种ui控件关联走查方法,其特征在于,包括:
2.根据权利要求1所述的ui控件关联走查方法,其特征在于,所述步骤s3具体为:
3.根据权利要求2所述的ui控件关联走查方法,其特征在于,所述步骤s37具体为:
4.根据权利要求2所述的ui控件关联走查方法,其特征在于,所述步骤s4具体为:
5.根据权利要求4所述的ui控件关联走查方法,其特征在于,所述步骤s43具体为:
6.根据权利要求5所述的ui...
【专利技术属性】
技术研发人员:邹越,苏沁宁,
申请(专利权)人:平安银行股份有限公司,
类型:发明
国别省市:
还没有人留言评论。发表了对其他浏览者有用的留言会获得科技券。