一种页面组件的样式信息的确定方法和装置制造方法及图纸

本发明专利技术公开了一种页面组件的样式信息的确定方法和装置，涉及超级深度学习技术领域。该方法的具体实施方式包括：接收页面组件的样式生成请求；其中，样式生成请求指示了页面组件的样式图片；将样式图片输入预训练的组件样式模型；其中，组件样式模型是根据历史样式图片的像素点的颜色值和位置值训练得到的；响应于样式生成请求，根据组件样式模型的输出，得到页面组件的样式信息。该实施方式通过按钮组件的样式信息一键生成的方式，重复生成页面UI，大大提高了组件生成效率，生成的页面UI样式准确、精度较高，满足用户的精度、观感和交互需求，降低了前端工程师的人力、时间成本，提高其的开发效率。其的开发效率。其的开发效率。

【技术实现步骤摘要】
一种页面组件的样式信息的确定方法和装置


[0001]本专利技术涉及超级深度学习
，尤其涉及一种页面组件的样式信息的确定方法和装置。

技术介绍

[0002]UI(User Interface，用户界面)是指对软件的人机交互、操作逻辑、界面美观的整体设计。UI包含了人机交互与图形用户接口，可以通过组件的形式进行展示。
[0003]现有的页面UI生成过程中，由于一些突发情况(比如，促销)下需要生成的页面UI数据量较大且重复性较高，为了降低人工生成的成本，DTC(design to code，设计稿生成组件信息)或者拖拽式组件信息生成等方法应用广泛。
[0004]然而，DTC或者拖曳式生成的方式应用的场景通常是页面UI生成需求激增的情况，故而组件信息准确度低，对应得到的CSS(Cascading Style Sheets，层叠样式表)样式较为粗糙，无法适用于精度要求较高、交互频繁的C端(consumer，消费者、个人用户端)页面，用户使用体验、观感等极为不适。

技术实现思路

[0005]有鉴于此，本专利技术实施例提本文档来自技高网...

【技术保护点】

【技术特征摘要】
1.一种页面组件的样式信息的确定方法，其特征在于，包括：接收页面组件的样式生成请求；其中，所述样式生成请求指示了所述页面组件的样式图片；将所述样式图片输入预训练的组件样式模型；其中，所述组件样式模型是根据历史样式图片的像素点的颜色值和位置值训练得到的；响应于所述样式生成请求，根据所述组件样式模型的输出，得到所述页面组件的样式信息。2.根据权利要求1所述的方法，其特征在于，还包括：对所述样式图片进行预处理，确定所述页面组件的像素点信息；将所述页面组件的多个像素点的颜色值和位置值进行对比，确定所述页面组件的背景样式信息、边框样式信息和字体样式信息；根据所述背景样式信息、边框样式信息和字体样式信息，生成所述页面组件的样式信息，得到所述组件样式模型。3.根据权利要求2所述的方法，其特征在于，所述对所述样式图片进行预处理，确定所述页面组件的像素点信息，包括：根据预设裁剪尺寸，确定所述样式图片的裁剪候选框；其中，所述预设裁剪尺寸大于所述页面组件的最大边框尺寸；利用所述裁剪候选框对所述样式图片进行裁剪，确定包含所述页面组件的目标组件区域；提取所述目标组件区域的像素点信息作为所述页面组件的像素点信息；其中，所述像素点信息为二维数组格式。4.根据权利要求2所述的方法，其特征在于，所述将所述页面组件的多个像素点的颜色值和位置值进行对比，确定所述页面组件的背景样式信息、边框样式信息和字体样式信息，包括：根据所述目标组件区域中的各个像素点的最大颜色值，确定所述页面组件的背景样式信息；确定所述目标组件区域的多个定位像素点，根据多个所述定位像素点的颜色值和位置值确定所述页面组件的边框样式信息；根据预训练的文字识别模型、所述背景样式信息和所述边框样式信息，确定所述页面组件的字体样式信息。5.根据权利要求4所述的方法，其特征在于，所述根据所述目标组件区域中的各个像素点的最大颜色值，确定所述页面组件的背景样式信息，包括：遍历所述目标组件区域的像素点；确定当前遍历点的颜色值是否是首次出现，如果是，将所述当前遍历点的颜色值添加至预置的背景颜色数据组；如果否，递增所述背景颜色数据组中与所述当前遍历点的颜色值对应的像素点的数量；在所述目标组件区域的像素点遍历完毕的情况下，确定所述背景颜色数据组中的最大颜色值为所述组件的背景颜色，得到所述背景样式信息。6.根据权利要求4所述的方法，其特征在于，所述确定所述目标组件区域的多个定位像
素点，根据多个所述定位像素点的颜色值和位置值确定所述页面组件的边框样式，包括：根据所述目标组件区域的边界像素点的颜色值，确定第一定位像素点，根据所述第一定位像素点的颜色值确定所述页面组件的边框颜色信息；将所述第一定位像素点的颜色值与不同位置值的像素点的颜色值进行对比，确定所述页面组件的边框宽度信息；确定其余的定位像素点，根据全部所述定位像素点的位置值，计算所述页面组件的边框圆角信息。7.根据权利要求6所述的方法，其特征在于，所述根据所述目标组件区域的边界像素点的颜色值，确定第一定位像素点，根据所述第一定位像素点的颜色值确定所述页面组件的边框颜色信息包括：确定所述目标组件区域的边界像素点；将所述边界像素点的颜色值顺次与相邻的像素点的颜色值进行对比，确定第一个与所述...

【专利技术属性】
技术研发人员：王元，
申请(专利权)人：北京京东世纪贸易有限公司，
类型：发明
国别省市：