[发明专利]页面生成方法、装置、电子设备及存储介质

说明书

本公开关于一种页面生成方法、装置、电子设备及存储介质，该方法包括：获取与待生成页面的原始图形文件中的每个元素对应的盒模型，以及与每个元素对应的盒模型的外边距；每个元素对应的盒模型用于标识相应的元素的元素参数，每个元素对应的盒模型的外边距用于标识相应的元素与相邻元素之间的距离；在预设布局页面上生成每个元素，得到待生成页面对应的初始页面；根据与每个元素对应的盒模型以及与每个元素对应的盒模型的外边距，调整初始页面上的每个元素的元素参数以及每个元素与相邻元素之间的距离，得到待生成页面对应的目标页面。采用本方法，实现了通过盒模型进行页面开发的目的，有利于减少生成的页面与原始图形文件之间的误差。

技术领域

本公开涉及计算机技术领域，尤其涉及一种页面生成方法、装置、电子设备及存储介质。

背景技术

在前端页面开发相关技术中，是根据设计稿去进行页面开发；但是，由于没有高度还原设计稿，造成开发出来的页面与设计稿之间的误差较大，导致页面生成效果较差。

发明内容

本公开提供一种页面生成方法、装置、电子设备及存储介质，以至少解决相关技术中开发出来的页面与设计稿之间的误差较大的问题。本公开的技术方案如下：

根据本公开实施例的第一方面，提供一种页面生成方法，包括：

获取与待生成页面的原始图形文件中的每个元素对应的盒模型，以及与每个元素对应的盒模型的外边距；每个元素对应的盒模型用于标识相应的元素的元素参数，每个元素对应的盒模型的外边距用于标识相应的元素与相邻元素之间的距离；

在预设布局页面上生成所述每个元素，得到所述待生成页面对应的初始页面；

根据与每个元素对应的盒模型以及与每个元素对应的盒模型的外边距，调整所述初始页面上的所述每个元素的元素参数以及所述每个元素与相邻元素之间的距离，得到所述待生成页面对应的目标页面。

在一示例性实施例中，所述获取与待生成页面的原始图形文件中的每个元素对应的盒模型，以及与每个元素对应的盒模型的外边距，包括：

获取待生成页面的原始图形文件中的每个元素对应的元素参数和所述每个元素与相邻元素之间的距离；

分别根据所述每个元素对应的元素参数，查询元素参数与盒模型的对应关系，得到与所述每个元素对应的盒模型；

根据所述每个元素与相邻元素之间的距离，确定与所述每个元素对应的盒模型的外边距。

在一示例性实施例中，所述根据与每个元素对应的盒模型以及与每个元素对应的盒模型的外边距，调整所述初始页面上的所述每个元素的元素参数以及所述每个元素与相邻元素之间的距离，得到所述待生成页面对应的目标页面，包括：

根据与每个元素对应的盒模型以及与每个元素对应的盒模型的外边距，生成所述待生成页面的页面配置文件；

根据所述页面配置文件，对所述初始页面上的每个元素的元素参数以及所述每个元素与相邻元素之间的距离进行调整，得到所述待生成页面对应的目标页面。

在一示例性实施例中，在根据与每个元素对应的盒模型以及与每个元素对应的盒模型的外边距，调整所述初始页面上的所述每个元素的元素参数以及所述每个元素与相邻元素之间的距离，得到所述待生成页面对应的目标页面之后，还包括：

获取所述原始图形文件的元素修改数据；

根据所述元素修改数据，对所述原始图形文件中的待修改元素的盒模型进行更新，得到所述待修改元素的新的盒模型；

根据所述待修改元素的新的盒模型，对所述目标页面中的所述待修改元素的元素参数进行调整，得到所述目标页面对应的第一更新页面。