一种界面组件识别方法、装置、计算机设备以及存储介质制造方法及图纸

技术编号:34105388 阅读:21 留言:0更新日期:2022-07-12 00:20
本公开提供了一种界面组件识别方法、装置、计算机设备以及存储介质,其中,该方法包括:获取UI界面设计稿中的至少一个界面组件的组件属性信息;基于所述组件属性信息确定每个所述界面组件的组件类型,得到至少一个组件类型,并确定每个所述组件类型所对应的组件识别模式;基于所述组件识别模式在相对应的界面组件中识别目标界面组件;其中,所述目标界面组件为所属于对应组件类型的界面组件中渲染结果未展示在所述UI界面设计稿上的界面组件。果未展示在所述UI界面设计稿上的界面组件。果未展示在所述UI界面设计稿上的界面组件。

【技术实现步骤摘要】
一种界面组件识别方法、装置、计算机设备以及存储介质


[0001]本公开涉及计算机
,具体而言,涉及一种界面组件识别方法、装置、计算机设备以及存储介质。

技术介绍

[0002]由于设计人员在针对UI界面进行设计的过程中,通常不会考虑UI界面的渲染效果,因此,得到的UI界面设计稿往往过于杂乱,充斥着若干无用的界面组件,导致通过D2C(design to code,设计稿转代码)的方法针对该UI界面设计稿生成的UI界面的代码较为复杂,增加了UI界面后期的维护成本,同时导致加载该UI界面时占用终端设备的内存较大。

技术实现思路

[0003]本公开实施例至少提供一种界面组件识别方法、装置、计算机设备以及存储介质。
[0004]第一方面,本公开实施例提供了一种界面组件识别方法,包括:
[0005]获取UI界面设计稿中的至少一个界面组件的组件属性信息;
[0006]基于所述组件属性信息确定每个所述界面组件的组件类型,得到至少一个组件类型,并确定每个所述组件类型所对应的组件识别模式;
[0007]基于所述组件识别模式在相对应的界面组件中识别目标界面组件;其中,所述目标界面组件为所属于对应组件类型的界面组件中渲染结果未展示在所述UI界面设计稿上的界面组件。
[0008]一种可选的实施方式中,所述基于所述组件识别模式在相对应的界面组件中识别目标界面组件,包括:
[0009]在所述界面组件的组件类型为第一类型组件的情况下,基于所述组件属性信息获取该界面组件的预设层级关系;其中,所述第一类型组件用于指示该界面组件包含对应组件结构信息;
[0010]基于所述预设层级关系确定该界面组件所对应的渲染范围中是否包含上层界面组件;
[0011]在确定该界面组件所对应的渲染范围中不包含所述上层界面组件的情况下,将所述界面组件确定为目标界面组件。
[0012]一种可选的实施方式中,所述方法还包括:
[0013]在所述界面组件所对应的渲染范围中不包含上层界面组件的情况下,基于所述组件属性信息确定所述界面组件的组件类型是否为第一预设子类型;
[0014]在所述界面组件的组件类型不是第一预设子类型的情况下,将所述界面组件确定为目标界面组件。
[0015]一种可选的实施方式中,所述基于所述组件识别模式在相对应的界面组件中识别目标界面组件,包括:
[0016]在所述界面组件的组件类型为第一类型组件的情况下,基于所述组件属性信息确
定所述界面组件是否为第二预设子类型;其中,所述第一类型组件用于指示该界面组件包含对应组件结构信息;
[0017]在所述界面组件为第二预设子类型的情况下,基于所述组件属性信息确定所述界面组件的组件尺寸信息和预设层级关系;
[0018]在所述界面组件的组件尺寸信息不满足预设尺寸要求,且基于所述预设层级关系确定所述界面组件不包含下层界面组件的情况下,将所述界面组件确定为目标界面组件。
[0019]一种可选的实施方式中,基于所述组件识别模式在相对应的界面组件中识别目标界面组件,包括:
[0020]在所述界面组件的组件类型为第二类型组件的情况下,获取基于所述组件属性信息确定的所述界面组件的可视设置信息;所述可视设置信息包括以下至少之一:组件尺寸信息、透明度信息、隐藏信息;其中,所述第二类型组件用于指示该界面组件包含对应组件渲染信息;
[0021]确定所述可视设置信息是否满足设置要求;
[0022]在确定所述可视设置信息不满足设置要求的情况下,将所述界面组件确定为目标界面组件。
[0023]一种可选的实施方式中,所述基于所述组件识别模式在相对应的界面组件中识别目标界面组件,包括:
[0024]在所述界面组件的组件类型为第二类型组件的情况下,基于所述组件属性信息确定所述界面组件的组件子类型,并确定所述组件子类型所对应的组件子识别模式;其中,所述第二类型组件用于指示该界面组件包含对应组件渲染信息;
[0025]在确定所述界面组件不满足所述组件子识别模式所对应的识别条件的情况下,将所述界面组件确定为目标界面组件。
[0026]一种可选的实施方式中,所述基于所述组件识别模式在相对应的界面组件中识别目标界面组件,包括:
[0027]在所述界面组件的组件类型为第二类型组件的情况下,确定所述界面组件的相邻界面组件;其中,所述第二类型组件用于指示该界面组件包含对应组件渲染信息;
[0028]确定所述界面组件和所述相邻界面组件之间的相交类型;所述相交类型包括第一相交类型和第二相交类型;
[0029]在所述相交类型为第一相交类型的情况下,获取所述界面组件的预设层级关系,并基于所述层级关系确定所述界面组件和所述相邻界面组件之间的覆盖关系;
[0030]基于所述覆盖关系确定所述界面组件和所述相邻界面组件之间的被遮盖界面组件,并将所述被遮盖界面组件确定为目标界面组件。
[0031]一种可选的实施方式中,所述方法还包括:
[0032]在所述相交类型为第二相交类型的情况下,确定所述界面组件和所述相邻界面组件之间的相交面积数据;
[0033]确定所述相交面积数据是否满足相交面积要求;
[0034]在确定所述相交面积数据不满足相交面积要求的情况下,获取所述界面组件的预设层级关系,并基于所述层级关系确定所述界面组件和所述相邻界面组件之间的覆盖关系;
[0035]基于所述覆盖关系确定所述界面组价和所述相邻界面组件之中的被遮盖界面组件,并将所述被遮盖界面组件确定为目标界面组件。
[0036]第二方面,本公开实施例还提供一种界面组件识别装置,包括:
[0037]获取单元,用于获取UI界面设计稿中的至少一个界面组件的组件属性信息;
[0038]确定单元,用于基于所述组件属性信息确定每个所述界面组件的组件类型,得到至少一个组件类型,并确定每个所述组件类型所对应的组件识别模式;
[0039]识别单元,用于基于所述组件识别模式在相对应的界面组件中识别目标界面组件;其中,所述目标界面组件为所属于对应组件类型的界面组件中渲染结果未展示在所述UI界面设计稿上的界面组件。
[0040]第三方面,本公开实施例还提供一种计算机设备,包括:处理器、存储器和总线,所述存储器存储有所述处理器可执行的机器可读指令,当计算机设备运行时,所述处理器与所述存储器之间通过总线通信,所述机器可读指令被所述处理器执行时执行上述第一方面,或第一方面中任一种可能的实施方式中的步骤。
[0041]第四方面,本公开实施例还提供一种计算机可读存储介质,该计算机可读存储介质上存储有计算机程序,该计算机程序被处理器运行时执行上述第一方面,或第一方面中任一种可能的实施方式中的步骤。
[0042]在本公开实施例中,在获取到UI界面设计稿中的至少一个界面组件的组件属性信息后,就可以确定每个界面组件的组件类型,并确定每个组件类型所对应的组件识别模式本文档来自技高网
...

【技术保护点】

【技术特征摘要】
1.一种界面组件识别方法,其特征在于,包括:获取UI界面设计稿中的至少一个界面组件的组件属性信息;基于所述组件属性信息确定每个所述界面组件的组件类型,得到至少一个组件类型,并确定每个所述组件类型所对应的组件识别模式;基于所述组件识别模式在相对应的界面组件中识别目标界面组件;其中,所述目标界面组件为所属于对应组件类型的界面组件中渲染结果未展示在所述UI界面设计稿上的界面组件。2.根据权利要求1所述的方法,其特征在于,所述基于所述组件识别模式在相对应的界面组件中识别目标界面组件,包括:在所述界面组件的组件类型为第一类型组件的情况下,基于所述组件属性信息获取该界面组件的预设层级关系;其中,所述第一类型组件用于指示该界面组件包含对应组件结构信息;基于所述预设层级关系确定该界面组件所对应的渲染范围中是否包含上层界面组件;在确定该界面组件所对应的渲染范围中不包含所述上层界面组件的情况下,将所述界面组件确定为目标界面组件。3.根据权利要求2所述的方法,其特征在于,所述方法还包括:在所述界面组件所对应的渲染范围中不包含上层界面组件的情况下,基于所述组件属性信息确定所述界面组件的组件类型是否为第一预设子类型;在所述界面组件的组件类型不是第一预设子类型的情况下,将所述界面组件确定为目标界面组件。4.根据权利要求1所述的方法,其特征在于,所述基于所述组件识别模式在相对应的界面组件中识别目标界面组件,包括:在所述界面组件的组件类型为第一类型组件的情况下,基于所述组件属性信息确定所述界面组件是否为第二预设子类型;其中,所述第一类型组件用于指示该界面组件包含对应组件结构信息;在所述界面组件为第二预设子类型的情况下,基于所述组件属性信息确定所述界面组件的组件尺寸信息和预设层级关系;在所述界面组件的组件尺寸信息不满足预设尺寸要求,且基于所述预设层级关系确定所述界面组件不包含下层界面组件的情况下,将所述界面组件确定为目标界面组件。5.根据权利要求1所述的方法,其特征在于,基于所述组件识别模式在相对应的界面组件中识别目标界面组件,包括:在所述界面组件的组件类型为第二类型组件的情况下,获取基于所述组件属性信息确定的所述界面组件的可视设置信息;所述可视设置信息包括以下至少之一:组件尺寸信息、透明度信息、隐藏信息;其中,所述第二类型组件用于指示该界面组件包含对应组件渲染信息;确定所述可视设置信息是否满足设置要求;在确定所述可视设置信息不满足设置要求的情况下,将所述界面组件确定为目标界面组件。6.根据权利要求1所述的方法,其特征在于,所述基于所述组件识别模式在相对应的界
面组件中识别目标界面组件,包括:在所...

【专利技术属性】
技术研发人员:杨健
申请(专利权)人:北京字节跳动网络技术有限公司
类型:发明
国别省市:

网友询问留言 已有0条评论
  • 还没有人留言评论。发表了对其他浏览者有用的留言会获得科技券。

1