CN103941963B - 一种自动调整页面布局的方法及其装置 - Google Patents

Abstract

本发明提供了一种自动调整页面布局的方法，包括步骤：捕捉用户对框格的操作，确定待调框格；判断待调框格与其他框格或网格的位置关系，并根据预设自动调整方案调整待调框格的大小或位置。其中，用户对框格的操作包括对框格的选定操作或改变框格形状或位置的操作；改变框格形状或位置的操作包括拖拽操作或输入框格的宽度、高度或特征坐标以改变框格形状或位置的操作。本发明还提供了一种自动调整页面布局的装置。采取以上技术方案之后的有益效果是，在调整页面布局特别是微调的过程中自动调节了人工手动操作可能造成的偏差，充分提高了布局调整的效率和整齐程度。

Description

一种自动调整页面布局的方法及其装置

技术领域

本发明涉及计算机软件领域，特别涉及一种在管理平台上自动调整页面布局的方法及其装置。

背景技术

现有的计算机管理软件在平台多区域布局调整时，通常通过拖拽移动、拖拽拉伸或收缩、手动输入区域宽度或高度或特征坐标数据等方式进行对某个窗口或操作区域的形状或位置的布局调整。然而，在区域较多或调整幅度较小较细致的时候，存在以下问题：

1，拉伸或缩放时，对单个像素的调整不好把握，容易出现存在微小间隙或存在小范围覆盖的情况；

2，如果调整某个区域的位置时覆盖或影响到了其他区域，有可能需要同时调整其他区域，使得调整所需操作变得更加复杂。

发明内容

本发明的发明目的为提供可实现自动高效调整页面布局的方法及其装置；为实现上述目的，本发明采用的技术方案为：

一种自动调整页面布局的方法，包括步骤：

捕捉用户对框格的操作，确定待调框格；

判断待调框格与其他框格或网格的位置关系，并根据预设自动调整方案调整待调框格的大小或位置。

进一步地，所述的自动调整页面布局的方法中，所述用户对框格的操作包括对框格的选定操作或改变框格形状或位置的操作；改变框格形状或位置的操作包括拖拽操作或输入框格的宽度、高度或特征坐标以改变框格形状或位置的操作；

当捕捉到所述用户对框格的操作时，确定被操作框格为待调框格；

判断待调框格与其他框格或网格的位置关系之前，还包括步骤：判断自动调整功能是否启动；如启动则判断待调框格与其他框格或网格的位置关系，并根据预设自动调整方案调整待调框格的大小或位置，否则不进行判断待调框格与其他框格或网格的位置关系以及根据预设自动调整方案调整待调框格的大小或位置的步骤。

进一步地，所述的自动调整页面布局的方法中，判断自动调整功能是否启动具体包括：显示提示信息并询问用户是否开启自动调整功能，并根据用户的选择启动或不启动自动调整功能。

进一步地，所述的自动调整页面布局的方法中，判断待调框格与其他框格或网格的位置关系，并根据预设自动调整方案调整待调框格的大小或位置具体包括：确定待调框格后，判断待调框格在上、下、左、右方向上是否存在相邻框格，并在存在相邻框格时计算待调框格与相邻框格之间的距离并判断该距离是否小于一预设阈值；

当判定待调框格与相邻框格之间的距离小于一预设阈值时，调整待调框格的宽度、高度或位置使待调框格与相邻框格贴合。

进一步地，所述的自动调整页面布局的方法中，判断待调框格与其他框格或网格的位置关系，并根据预设自动调整方案调整待调框格的大小或位置具体包括：确定待调框格后，判断待调框格在上、下、左、右方向上是否覆盖相邻框格，并在覆盖相邻框格时计算待调框格与相邻框格的覆盖区域面积并判断所述覆盖区域面积是否小于一预设阈值；

当判定待调框格与相邻框格的覆盖区域面积小于一预设阈值时，调整待调框格的宽度、高度或位置使待调框格与相邻框格贴合。

进一步地，所述的自动调整页面布局的方法中，判断待调框格与其他框格或网格的位置关系，并根据预设自动调整方案调整待调框格的大小或位置具体包括：确定待调框格后，判断是否存在网格，若存在网格则计算并确定距离待调框格最近或与待调框格重叠面积最大的网格，调整待调框格的宽度、高度及位置，使其填充入距离待调框格最近或与待调框格重叠面积最大的网格。

进一步地，所述的自动调整页面布局的方法中，判断待调框格与其他框格或网格的位置关系，并根据预设自动调整方案调整待调框格的大小或位置具体包括：确定待调框格后，判断待调框格在上、下、左、右方向上是否覆盖相邻框格，并在覆盖相邻框格时计算待调框格与相邻框格的覆盖区域面积并判断所述覆盖区域面积是否大于一预设阈值；

当所述覆盖区域面积大于一预设阈值时，交换待调框格和相邻框格的形状及位置。

进一步地，所述的自动调整页面布局的方法中，当待调框格覆盖了两个或两个以上相邻框格且覆盖区域面积均大于一预设阈值时，比较所述两个或两个以上覆盖区域面积的大小，并交换待调框格和覆盖区域面积最大的相邻框格的形状及位置。

一种自动调整页面布局的装置，包括待调框格捕捉单元、位置判断单元和调整单元；

待调框格捕捉单元用于捕捉用户对框格的操作并确定待调框格；

位置判断单元用于判断待调框格与其他框格或网格的位置关系；

调整单元用于根据预设自动调整方案调整待调框格的大小或位置。

进一步地，所述的自动调整页面布局的装置还包括自动调整功能启动判断单元，用于在位置判断单元判断待调框格与其他框格或网格的位置关系之前，判断自动调整功能是否启动，如启动则判断待调框格与其他框格或网格的位置关系，并根据预设自动调整方案调整待调框格的大小或位置，否则不进行判断待调框格与其他框格或网格的位置关系以及根据预设自动调整方案调整待调框格的大小或位置的步骤；

所述用户对框格的操作包括对框格的选定操作或改变框格形状或位置的操作；改变框格形状或位置的操作包括拖拽操作或输入框格的宽度、高度或特征坐标以改变框格形状或位置的操作；

当待调框格捕捉单元捕捉到所述用户对框格的操作时，确定被操作框格为待调框格。

进一步地，所述的自动调整页面布局的装置中，自动调整功能启动判断单元判断自动调整功能是否启动具体包括：显示提示信息并询问用户是否开启自动调整功能，并根据用户的选择启动或不启动自动调整功能。

进一步地，所述的自动调整页面布局的装置中，待调框格捕捉单元确定待调框格后，位置判断单元判断判断拉伸、收缩或移动操作后待调框格在上、下、左、右方向上是否存在相邻框格，并在存在相邻框格时计算待调框格与相邻框格之间的距离并判断该距离是否小于一预设阈值；或位置判断单元判断拉伸、收缩或移动操作后待调框格在上、下、左、右方向上是否覆盖相邻框格，并在覆盖相邻框格时计算待调框格与相邻框格的覆盖区域面积并判断所述覆盖区域面积是否小于一预设阈值；

当位置判断单元判断所述距离小于一预设阈值或所述覆盖区域面积小于一预设阈值时，调整单元调整待调框格的宽度、高度或位置使待调框格与相邻框格贴合。

进一步地，所述的自动调整页面布局的装置中，待调框格捕捉单元确定待调框格后，位置判断单元判断是否存在网格，并在判定存在网格时计算并确定距离待调框格最近或与待调框格重叠面积最大的网格；

调整单元调整待调框格的宽度、高度及位置，使其填充入距离待调框格最近或与待调框格重叠面积最大的网格。

进一步地，所述的自动调整页面布局的装置中，调框格捕捉单元确定待调框格后，位置判断单元判断拉伸、收缩或移动操作后待调框格在上、下、左、右方向上是否覆盖相邻框格，并在覆盖相邻框格时计算待调框格与相邻框格的覆盖区域面积并判断所述覆盖区域面积是否大于一预设阈值；

当位置判断单元判定所述覆盖区域面积大于一预设阈值时，调整单元交换待调框格和相邻框格的形状及位置；

当位置判断单元判定待调框格覆盖了两个或两个以上相邻框格且覆盖区域面积均大于一预设阈值时，位置判断单元比较所述两个或两个以上覆盖区域面积大小；

调整单元交换待调框格和覆盖区域面积最大的相邻框格的形状及位置。

采取以上技术方案之后的有益效果为：在调整页面布局特别是微调的过程中自动调节了人工手动操作可能造成的偏差，充分提高了布局调整的效率和整齐程度。

附图说明

图1为本发明实施方式中一种自动调整页面布局的装置的功能模块示意图；

图2为本发明中一种自动调整页面布局的方法的第一实施方式的流程图；

图3为用于说明本发明中一种自动调整页面布局的方法的第一实施方式的示意图；

图4为本发明中一种自动调整页面布局的方法的第二实施方式的流程图；

图5为用于说明本发明中一种自动调整页面布局的方法的第二实施方式的示意图；

图6为本发明中一种自动调整页面布局的方法的第三实施方式的流程图；

图7a为用于说明本发明中一种自动调整页面布局的方法的第三实施方式的示意图一；

图7b为用于说明本发明中一种自动调整页面布局的方法的第三实施方式的示意图二；

图8为本发明中一种自动调整页面布局的方法的第四实施方式的流程图；

图9为用于说明本发明中一种自动调整页面布局的方法的第四实施方式的示意图。

标号说明：

10-待调框格捕捉单元

11-位置判断单元

12-调整单元

13-自动调整功能启动判断单元

31-待调框格

32-相邻框格

33-光标

50-覆盖区域

51-间隙

70-网格

71-最近网格

具体实施方式

为详细说明本发明的技术内容、构造特征、所实现目的及效果，以下结合实施方式并配合附图详予说明。

请参阅图1，为本发明实施方式中一种自动调整页面布局的装置的功能模块示意图；

所述装置包括待调框格捕捉单元10、位置判断单元11、调整单元12以及自动调整功能启动判断单元13。

待调框格捕捉单元10用于捕捉用户对框格的操作并确定待调框格；位置判断单元11用于判断待调框格与其他框格或网格的位置关系；调整单元12用于根据预设自动调整方案调整待调框格的大小或位置；自动调整功能启动判断单元13用于在位置判断单元11判断待调框格与其他框格或网格的位置关系之前，判断自动调整功能是否启动，如启动则进行后续步骤，否则不进行后续步骤。

进一步地，所述用户对框格的操作包括对框格的选定操作或改变框格形状或位置的操作；改变框格形状或位置的操作包括拖拽操作或输入框格的宽度、高度或特征坐标以改变框格形状或位置的操作；当待调框格捕捉单元10捕捉到所述用户对框格的操作时，确定所述框格为待调框格。

进一步地，自动调整功能启动判断单元13判断自动调整功能是否启动具体包括：显示提示信息并询问用户是否开启自动调整功能，并根据用户的选择启动或不启动自动调整功能。

进一步地，待调框格捕捉单元10确定待调框格后，位置判断单元11判断判断拉伸、收缩或移动操作后待调框格在上、下、左、右方向上是否存在相邻框格，并在存在相邻框格时计算待调框格与相邻框格之间的距离51并判断所述距离是否小于一预设阈值；或位置判断单元11判断拉伸、收缩或移动操作后待调框格在上、下、左、右方向上是否覆盖相邻框格，并在覆盖相邻框格时计算待调框格与相邻框格的覆盖区域面积并判断所述覆盖区域面积是否小于一预设阈值；当位置判断单元11判断所述距离小于一预设阈值或所述覆盖区域面积小于一预设阈值时，调整单元12调整待调框格的宽度、高度或位置使待调框格与相邻框格贴合。

在另一实施方式中，待调框格捕捉单元10确定待调框格后，位置判断单元11判断是否存在网格，并在判定存在网格时计算并确定距离待调框格最近或与待调框格重叠面积最大的网格；调整单元12调整待调框格的宽度、高度及位置，使其填充入所述网格。

在另一实施方式中，待调框格捕捉单元10确定待调框格后，位置判断单元11判断拉伸、收缩或移动操作后待调框格在上、下、左、右方向上是否覆盖相邻框格，并在覆盖相邻框格时计算待调框格与相邻框格的覆盖区域面积并判断所述覆盖区域面积是否大于一预设阈值；当位置判断单元11判定所述覆盖区域面积大于一预设阈值时，调整单元12交换待调框格和相邻框格的形状及位置。当位置判断单元11判定上、下、左、右方向中的两个或两个以上方向上均覆盖相邻框格且所述覆盖区域面积均大于一预设阈值时，位置判断单元11比较所述两个或两个以上方向上待调框格与相邻框格的覆盖区域面积大小；调整单元12交换待调框格和覆盖区域面积最大的相邻框格的形状及位置。

请参阅图2和图3，图2为本发明中一种自动调整页面布局的方法的第一实施方式的流程图；图3为用于说明本发明中一种自动调整页面布局的方法的第一实施方式的示意图。

所述自动调整页面布局的方法包括步骤：

步骤S20、捕捉用户对框格的操作，确定待调框格。

所述用户对框格的操作包括对框格的选定操作或改变框格形状或位置的操作；改变框格形状或位置的操作包括拖拽操作或输入框格的宽度、高度或特征坐标以改变框格形状或位置的操作；当捕捉到所述用户对框格的操作时，确定所述框格为待调框格31。其中，拖拽操作又可以包括拖拽拉伸操作、拖拽压缩操作或拖拽移动操作。

步骤S21、判断自动调整功能是否启动，如启动则进入步骤S22，否则结束本流程。

在本实施例中，自动调整功能处于启动或不启动的状态，所要进行的判断就是自动调整功能是否处于启动状态。在另外一些实施例中，在捕捉到用户对框格有所操作并确定所述框格为待调框格之后，通过在屏幕上显示对话框等提示信息，询问用户是否开启自动调整功能，并根据用户的选择启动自动调整功能或不启动自动调整功能。若启动自动调整功能，则按自动调整功能处于启动状态而进行后续步骤；若不启动自动调整功能，则任由用户自行进行手动调整工作。

步骤S22、判断待调框格31在上、下、左、右方向上是否存在相邻框格32，若存在则进入步骤S23，否则结束本流程。

步骤S23、计算待调框格与相邻框格之间的距离51并判断所述距离是否小于一预设阈值，若小于一预设阈值则进入步骤S24，否则结束本流程。

步骤S24、调整待调框格的宽度、高度或位置使待调框格与相邻框格贴合。

请参阅图3，光标33指示了对待调框格31进行拉伸而改变其形状及大小的操作；通过该操作确定待调框格31后，判断其右方存在相邻框格32。判断待调框格31与相邻框格32之间的距离小于一预设阈值，于是调整待调框格31的位置使其与相邻框格32贴合。

请参阅图4和图5；图4为本发明中一种自动调整页面布局的方法的第二实施方式的流程图；图5为用于说明本发明中一种自动调整页面布局的方法的第二实施方式的示意图。所述自动调整页面布局的方法包括步骤：

步骤S40、捕捉用户对框格的操作，确定待调框格。

步骤S41、判断自动调整功能是否启动，如启动则进入步骤S42，否则结束本流程。

步骤S42、判断待调框格31在上、下、左、右方向上是否覆盖相邻框格32，若存在则进入步骤S43，否则结束本流程。

步骤S43、计算待调框格31与相邻框格32的覆盖区域面积并判断所述覆盖区域面积是否小于一预设阈值，若小于一预设阈值则进入步骤S44，否则结束本流程。

步骤S44、调整待调框格31的宽度、高度或位置使待调框格31与相邻框格32贴合。

请参阅图5，光标33指示了对待调框格31进行移动以改变其位置的操作；通过该操作确定待调框格31后，判断其右方存在相邻框格32。判断待调框格31在右方覆盖了相邻框格32，并且覆盖区域33的面积小于一预设阈值，于是调整待调框格31的位置使其与相邻框格32贴合。

请参阅图6、图7a和图7b；图6为本发明中一种自动调整页面布局的方法的第三实施方式的流程图；图7a、7b为用于说明本发明中一种自动调整页面布局的方法的第三实施方式的示意图。所述方法包括如下步骤：

步骤S60、捕捉用户对框格的操作，确定待调框格。

步骤S61、判断自动调整功能是否启动，如启动则进入步骤S62，否则结束本流程。

步骤S62、判断是否存在网格，若存在则进入步骤S63，否则结束本流程。

步骤S63、计算并确定距离待调框格最近或与待调框格重叠面积最大的网格。

步骤S64、调整待调框格的宽度、高度及位置，使其填充入距离待调框格最近或与待调框格重叠面积最大的网格。

请参阅图7a，在确定了待调框格31后，检测到其周边存在数个网格70，并且待调框格31并未与其中任何网格70存在覆盖，而数个网格70中与待调框格31最近的是最近网格71，于是调整待调框格31形状和位置使其填充入所述最近网格71。

图7b所示实施例中，在确定了待调框格31后，检测到其周边存在数个网格70，并且待调框格31与四个网格存在覆盖，而数个网格70中与待调框格31重叠面积最大的是最近网格71，于是调整待调框格31形状和位置使其填充入所述最近网格71。

请参阅图8和图9；图8为本发明中一种自动调整页面布局的方法的第四实施方式的流程图；图9为用于说明本发明中一种自动调整页面布局的方法的第四实施方式的示意图。

所述方法包括如下步骤：

步骤S80、捕捉用户对框格的操作，确定待调框格。

步骤S81、判断自动调整功能是否启动，如启动则进入步骤S82，否则结束本流程。

步骤S82、判断待调框格31在上、下、左、右方向上是否覆盖相邻框格32，若存在则进入步骤S83，否则结束本流程。

步骤S83、计算待调框格31与相邻框格32的覆盖区域面积并判断所述覆盖区域面积是否大于一预设阈值，若大于一预设阈值则进入步骤S84，否则结束本流程。

步骤S84、交换待调框格31和相邻框格32的形状及位置。

请参阅图9，光标33指示了对待调框格31进行移动以改变其位置的操作；通过该操作确定待调框格31后，判断其右方存在相邻框格32。判断待调框格31在右方覆盖了相邻框格32，并且覆盖区域50的面积大于一预设阈值，于是交换待调框格31和相邻框格32的形状及位置。

在其他实施例中，如果待调框格31覆盖了两个或两个以上相邻框格32且覆盖区域50面积均大于一预设阈值时，比较所述两个或两个以上覆盖区域50面积的大小，并交换待调框格31和覆盖区域50面积最大的相邻框格的形状及位置。

以上所述仅为本发明的实施例，并非因此限制本发明的专利范围，凡是利用本发明说明书及附图内容所作的等效结构或等效流程变换，或直接或间接运用在其他相关的技术领域，均同理包括在本发明的专利保护范围内。

Claims (6)

1.一种自动调整页面布局的方法，其特征在于，包括步骤：

捕捉用户对框格的操作，确定待调框格；

判断待调框格与网格的位置关系，并根据预设自动调整方案调整待调框格的大小；

所述“判断待调框格与网格的位置关系，并根据预设自动调整方案调整待调框格的大小”包括如下步骤：

确定待调框格后，判断是否存在网格，若存在网格则计算并确定距离待调框格最近或与待调框格重叠面积最大的网格，调整待调框格的宽度、高度及位置，使其填充入距离待调框格最近或与待调框格重叠面积最大的网格。

2.如权利要求1所述的自动调整页面布局的方法，其特征在于，所述用户对框格的操作包括对框格的选定操作或改变框格形状或位置的操作；改变框格形状或位置的操作包括拖拽操作或输入框格的宽度、高度或特征坐标以改变框格形状或位置的操作；

当捕捉到所述用户对框格的操作时，确定被操作框格为待调框格；

判断待调框格与网格的位置关系之前，还包括步骤：判断自动调整功能是否启动；如启动则判断待调框格与网格的位置关系，并根据预设自动调整方案调整待调框格的大小，否则不进行判断待调框格与网格的位置关系以及根据预设自动调整方案调整待调框格的大小的步骤。

3.如权利要求2所述的自动调整页面布局的方法，其特征在于，判断自动调整功能是否启动具体包括：显示提示信息并询问用户是否开启自动调整功能，并根据用户的选择启动或不启动自动调整功能。

4.一种自动调整页面布局的装置，其特征在于：包括待调框格捕捉单元、位置判断单元和调整单元；

待调框格捕捉单元用于捕捉用户对框格的操作并确定待调框格；

位置判断单元用于判断待调框格与网格的位置关系；

调整单元用于根据预设自动调整方案调整待调框格的大小；

待调框格捕捉单元确定待调框格后，“位置判断单元用于判断待调框格与网格的位置关系”包括位置判断单元用于判断是否存在网格，并在判定存在网格时计算并确定距离待调框格最近或与待调框格重叠面积最大的网格；

“调整单元用于根据预设自动调整方案调整待调框格的大小”包括调整单元用于调整待调框格的宽度、高度及位置，使其填充入距离待调框格最近或与待调框格重叠面积最大的网格。

5.如权利要求4所述的自动调整页面布局的装置，其特征在于，还包括自动调整功能启动判断单元，用于在位置判断单元判断待调框格与网格的位置关系之前，判断自动调整功能是否启动，如启动则判断待调框格与网格的位置关系，并根据预设自动调整方案调整待调框格的大小，否则不进行判断待调框格与网格的位置关系以及根据预设自动调整方案调整待调框格的大小的步骤；

所述用户对框格的操作包括对框格的选定操作或改变框格形状或位置的操作；

改变框格形状或位置的操作包括拖拽操作或输入框格的宽度、高度或特征坐标以改变框格形状或位置的操作；

当待调框格捕捉单元捕捉到所述用户对框格的操作时，确定被操作框格为待调框格。

6.如权利要求4或5所述的自动调整页面布局的装置，其特征在于，自动调整功能启动判断单元判断自动调整功能是否启动具体包括：显示提示信息并询问用户是否开启自动调整功能，并根据用户的选择启动或不启动自动调整功能。