基于界面设计图自动生成界面代码的方法、装置、介质及电子设备制造方法及图纸

技术编号:24251143 阅读:69 留言:0更新日期:2020-05-22 23:22
本公开提供了一种基于界面设计图自动生成界面代码的方法、装置、介质及电子设备。本公开涉及智能决策中的检测模型。通过识别所述界面设计图的界面元素的位置,并根据识别的界面元素的位置,查找界面元素位置与代码模板对应关系表,获得与所述界面元素的位置对应的代码模板和对应的通用代码,根据通用代码与提取所述界面元素的参数结合,从而形成对应的界面代码,另外,还可依据请求指令中携带有需要的风格信息进行参数的调整,使得在原有的通用代码上填充调整后的参数,并生成符合用户喜好的界面设计图和对应的界面代码,大大提高界面设计图的工作效率,简化界面设计图生产的工序。

Methods, devices, media and electronic equipment for automatically generating interface codes based on interface design drawings

【技术实现步骤摘要】
基于界面设计图自动生成界面代码的方法、装置、介质及电子设备
本专利技术涉及智能决策中的检测模型,特别涉及一种基于界面设计图自动生成界面代码的方法、装置、介质及电子设备。
技术介绍
在相关技术中,界面设计图的设计需要通过设计师绘图、人工提炼元素和匹配对应的界面参数,并将对应的界面参数交付至开发人员进行界面编程,界面设计图对应的界面生成相当繁琐,工作效率低,并且不利于把握用户喜好。
技术实现思路
本公开旨在提供一种基于界面设计图自动生成界面代码的方法、装置、介质及电子设备,其能够依据用户的喜好信息进行对应的界面代码自动生成,大大提高界面设计图的工作效率,简化界面设计图生产的工序。根据本公开的一方面,提供了一种基于界面设计图自动生成界面代码的方法,包括:获取界面设计图;识别所述界面设计图的界面元素的位置;根据识别的界面元素的位置,查找界面元素位置与代码模板对应关系表,获得与所述界面元素的位置对应的代码模板,所述代码模板中含有所述位置的界面元素的界面的通用代码,其中界面元素的参数在代码模板中未填写;提取所述界面元素的本文档来自技高网...

【技术保护点】
1.一种基于界面设计图自动生成界面代码的方法,其特征在于,包括:/n获取界面设计图;/n识别所述界面设计图的界面元素的位置;/n根据识别的界面元素的位置,查找界面元素位置与代码模板对应关系表,获得与所述界面元素的位置对应的代码模板,所述代码模板中含有所述位置的界面元素的界面的通用代码,其中界面元素的参数在代码模板中未填写;/n提取所述界面元素的参数;/n响应于接收到用于风格转化的请求指令,所述请求指令中携带有需要的风格信息;/n根据所述需要的风格信息,查找风格信息与参数改变量匹配关系表,以确定参数改变量,以便将所述参数改变量施加在所述界面元素的参数上;/n将改变后的界面元素的参数填充到所述代码...

【技术特征摘要】
1.一种基于界面设计图自动生成界面代码的方法,其特征在于,包括:
获取界面设计图;
识别所述界面设计图的界面元素的位置;
根据识别的界面元素的位置,查找界面元素位置与代码模板对应关系表,获得与所述界面元素的位置对应的代码模板,所述代码模板中含有所述位置的界面元素的界面的通用代码,其中界面元素的参数在代码模板中未填写;
提取所述界面元素的参数;
响应于接收到用于风格转化的请求指令,所述请求指令中携带有需要的风格信息;
根据所述需要的风格信息,查找风格信息与参数改变量匹配关系表,以确定参数改变量,以便将所述参数改变量施加在所述界面元素的参数上;
将改变后的界面元素的参数填充到所述代码模板中所述参数的对应位置,生成对应于所述风格信息的界面代码。


2.根据权利要求1所述的方法,其特征在于,所述获取界面设计图,包括:
接收到待处理界面设计图,并将所述待处理界面设计图转换成灰度图像;
对所述灰度图像进行平滑处理,将所述经平滑处理后的灰度图像进行中值滤波处理;
将所述中值滤波处理后的灰度图像进行二值化处理,得到二值图像,作为获取到的界面设计图。


3.根据权利要求2所述的方法,其特征在于,所述识别所述界面设计图的界面元素的位置,包括:
识别所述二值图像中的边缘曲线,其中,如果二值图像中相邻两个像素点的像素值相同,则用线连接所述相邻两个像素点,用线连接二值图像上所有相邻的像素值相同的像素点后形成的每一条连通曲线为一条边缘曲线;
将所述边缘曲线输入至识别界面元素的机器学习模型,由机器学习模型输出所述界面元素;
获取所述连通曲线的每个像素点的位置坐标;
基于所述连通曲线的每个像素点的位置坐标,确定所述连通中心的坐标,作为对应界面元素的位置。


4.根据权利要求3所述的方法,其特征在于,所述机器学习模型通过以下方式预先训练而成:
获取边缘曲线样本集合,所述边缘曲线样本中的每个边缘曲线样本具有贴好的界面元素标签;
将所述边缘曲线样本中的每个边缘曲线样本输入机器学习模型,由所述机器学...

【专利技术属性】
技术研发人员:谭龙智
申请(专利权)人:平安国际智慧城市科技股份有限公司
类型:发明
国别省市:广东;44

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

1