一种页面构建方法、装置及设备制造方法及图纸

本说明书涉及前端开发技术领域，具体公开了一种页面构建方法、装置及设备，所述方法包括接收用户对页面配置界面中的页面控件的操作信息；页面配置界面至少包括一个页面控件，页面控件用于可视化的表征页面展示元素的信息；将所述操作信息所对应的页面控件作为当前页面控件，提取所述当前页面控件基于所述操作信息所确定的控件信息；所述控件信息包括页面控件在指定方向上的长度以及页面控件的指定点相对页面配置界面的位置信息；利用所述当前页面控件的控件信息对所述页面配置界面的已有页面控件布局信息进行更新，以根据更新后的页面控件布局信息生成用于页面展示的页面展示数据。利用本说明书各个实施例，可提高页面构建的便捷性及灵活性。

【技术实现步骤摘要】
一种页面构建方法、装置及设备
本说明书涉及前端开发
，特别地，涉及一种页面构建方法、装置及设备。
技术介绍
金融机构的业务系统数量众多，各业务系统均涉及大量的前端设计及开发工作，而各页面系统的前端页面展现存在较多相似组件及布局，可以通过可视化布局的方式构建前端页面，以降低前端页面的开发工作量，提高开发效率。为了保证页面构建的简便性以及页面代码生成的准确性，通常的可视化布局工具主要采用两种实现方式，第一种是预先对页面进行栅栏式布局，然后，再在该栅栏式布局的基础上进行控件的添加；第二种是先构建页面模板，用户再在页面模板的基础上根据需要对控件进行调整。但上述页面布局方式在一定程度上限定了控件的位置，不够灵活。因此，目前亟需一种在保证页面构建的简便性以及页面代码生成的准确性的基础上，更加灵活的页面构建方式。
技术实现思路
本说明书实施例的目的在于提供一种页面构建方法、装置及设备，可以进一步提高页面构建的便捷性及灵活性。本说明书提供一种页面构建方法、装置及设备是包括如下方式实现的：一种页面构建方法，所述方本文档来自技高网...

【技术保护点】
1.一种页面构建方法，其特征在于，所述方法包括：/n接收用户对页面配置界面中的页面控件的操作信息；所述页面配置界面至少包括一个页面控件，所述页面控件用于可视化的表征页面展示元素的信息；/n将所述操作信息所对应的页面控件作为当前页面控件，提取所述当前页面控件基于所述操作信息所确定的控件信息；其中，所述控件信息包括页面控件在指定方向上的长度以及页面控件的指定点相对页面配置界面的位置信息；/n利用所述当前页面控件的控件信息对所述页面配置界面的已有页面控件布局信息进行更新，以根据更新后的页面控件布局信息生成用于页面展示的页面展示数据。/n

【技术特征摘要】
1.一种页面构建方法，其特征在于，所述方法包括：
接收用户对页面配置界面中的页面控件的操作信息；所述页面配置界面至少包括一个页面控件，所述页面控件用于可视化的表征页面展示元素的信息；
将所述操作信息所对应的页面控件作为当前页面控件，提取所述当前页面控件基于所述操作信息所确定的控件信息；其中，所述控件信息包括页面控件在指定方向上的长度以及页面控件的指定点相对页面配置界面的位置信息；
利用所述当前页面控件的控件信息对所述页面配置界面的已有页面控件布局信息进行更新，以根据更新后的页面控件布局信息生成用于页面展示的页面展示数据。


2.根据权利要求1所述的方法，其特征在于，所述已有页面控件布局信息包括已布设的各页面控件的控件信息；更新所述已有页面控件布局信息，包括：
在基于当前页面控件的控件信息与已布设的各页面控件的控件信息的比对结果确定当前页面控件与已布设的各页面控件存在重叠的情况下，提取当前页面控件相对所述页面配置界面的相对布设信息；
利用所述当前页面控件相对所述页面配置界面的相对布设信息更新所述已有页面控件布局信息。


3.根据权利要求1所述的方法，其特征在于，所述更新所述已有页面控件布局信息，包括：
在基于当前页面控件的控件信息与已布设的各页面控件的控件信息的比对结果确定当前页面控件与已布设的各页面控件不存在重叠的情况下，若当前页面控件为页面配置界面的第一个布设的页面控件，则基于页面配置界面内预先设定的基准线，配置当前页面控件的行信息；其中，所述行信息包括行标识和行高度；所述行高度为包含当前页面控件的行与基准线之间的距离。


4.根据权利要求3所述的方法，其特征在于，若当前页面控件不是页面配置界面的第一个布设的页面控件，则提取在所述指定方向上与当前页面控件的位置信息存在重合的已布设的页面控件，作为相交页面控件；
利用所述当前页面控件与所述相交页面控件所在的行的位置关系，更新所述已有页面控件布局信息。


5.根据权利要求4所述的方法，其特征在于，假设沿所述指定方向为向下，逆所述指定方向为向上；在上述假设下，以页面配置界面的下边界作为基准线。


6.根据权利要求5所述的方法，其特征在于，在提取到相交页面控件、且相交页面控件的上边界位于当前页面控件的上边界的上方的情况下，所述更新所述已有页面控件布局信息，包括：
设置所述当前页面控件的行标识为相交页面控件的行标识；
设置所述行标识所对应的指定行的上边界与所述当前页面控件的上边界之间的距离为所述当前页面控件的相对布局属性值。


7.根据权利要求5所述的方法，其特征在于，在提取到相交页面控件、且相交页面控件的上边界位于当前页面控件的上边界的下方的情况下，所述更新所述已有页面控件布局信息，包括：
设置所述当前页面控件的行标识为相交页面控件的行标识；
计算指定行的上边界与所述当前页面控件的上边界之间的距离，作为指定距离；更新所述指定行的行高度为所述指定行的更新前的行高度与所述指定距离的加和；
设置所述更新后的指定行内各页面控件的上边界与更新后的指定行的上边界之间的距离，为所述更新后的指定行内各页面控件的相对布局属性值。


8.根据权利要求7所述的方法，其特征在于，所述更新所述已有页面控件布局信息，包括：
获取页面控件的上边界位于当前页面控件的上边界的上方的页面控件，作为第一目标页面控件；
计算各第一目标页面...

【专利技术属性】
技术研发人员：李楚阳，贾正旭，宋夏昕，李尔涵，
申请(专利权)人：中国工商银行股份有限公司，
类型：发明
国别省市：北京;11