[发明专利]页面布局方法、装置、设备及存储介质

说明书

本申请涉及一种页面布局方法、装置、设备及存储介质。应用于计算机技术领域，其中，页面布局方法包括：获取页面配置数据，页面配置数据包括页面中元素间的层级关系和元素信息，元素信息包括元素尺寸和元素内容，层级关系为元素间的父子关系；获取每个元素的尺寸调整范围；根据每个元素的尺寸调整范围和元素内容，按照从子到父顺序，分别得到各层级每个元素的元素目标尺寸；根据元素目标尺寸和元素内容，对每个元素进行页面布局。用以解决相关技术中在页面中任意类型的元素发生变化时，开发人员需要重新开发代码，导致开发成本较高的问题。

技术领域

本申请涉及计算机领域，尤其涉及一种页面布局方法、装置、设备及存储介质。

背景技术

前端的页面(view)布局中，view中往往存在多种类型的元素，如文本元素、图片元素和按钮元素等。

开发人员在进行开发时，根据上述文本元素、图片元素和按钮元素等的属性信息(如文字的字体、颜色、大小、位置，图片的大小、位置，按钮的大小、位置等)，编写相应的开发代码。

但是，上述方式不仅费时费力，而且，在页面中任意类型的元素发生变化时，开发人员需要重新开发代码，导致开发成本较高。

发明内容

本申请提供了一种页面布局方法、装置、设备及存储介质，用以解决相关技术中在页面中任意类型的元素发生变化时，开发人员需要重新开发代码，导致开发成本较高的问题。

第一方面，本申请提供了一种页面布局方法，包括：

获取页面配置数据，所述页面配置数据包括页面中元素间的层级关系和元素信息，所述元素信息包括元素尺寸和元素内容，所述层级关系为元素间的父子关系；

获取每个元素的尺寸调整范围；

根据每个所述元素的所述尺寸调整范围和所述元素内容，按照从子到父顺序，分别得到各层级每个所述元素的元素目标尺寸；

根据所述元素目标尺寸和所述元素内容，对每个所述元素进行页面布局。

可选的，所述根据每个所述元素的所述尺寸调整范围和所述元素内容，按照从子到父顺序，分别得到各层级每个所述元素的元素目标尺寸，包括：

根据所述元素间的父子关系，确定所述元素中的父元素和所述父元素的子元素；

根据所述子元素的所述元素内容，确定所述子元素的元素目标尺寸，所述元素目标尺寸在所述尺寸调整范围内；

基于所述子元素的元素目标尺寸确定所述父元素的元素目标尺寸。

可选的，所述子元素为文本元素时，所述根据所述子元素的所述元素内容，确定所述子元素的元素目标尺寸，所述元素目标尺寸在所述尺寸调整范围内，包括：

获取所述元素内容中的字体大小和/或文本长度；

根据所述字体大小和/或所述文本长度，将所述子元素的元素尺寸在所述尺寸调整范围内进行调整，得到所述元素目标尺寸。

可选的，所述父元素的元素信息还包括布局方向；

所述基于所述子元素的元素目标尺寸确定所述父元素的元素目标尺寸，包括：

获取所述布局方向；

基于所述子元素的元素目标尺寸中，与布局方向一致的子目标尺寸的和，确定所述父元素的第一元素尺寸；

基于所述子元素的元素目标尺寸中，与布局方向垂直的子目标尺寸，以及所述父元素的元素尺寸中，与布局方向垂直的子尺寸，确定所述父元素的第二元素尺寸；

将所述第一元素尺寸和所述第二元素尺寸，作为所述父元素的元素目标尺寸。