[发明专利]前端元素对齐的方法和系统

说明书

本说明书提供的前端元素对齐的方法和系统，获取前端元素对应的元素配置信息之后，便可以基于元素配置信息，迭代执行对齐操作，该对齐操作为将对齐元素与被对齐元素进行对齐，然后，输出目标对齐后元素；由于该方案可以通过迭代执行对齐操作的方式，可以实现在动态调整前端元素的位置或方位，使得在对齐过程中可以进行更加灵活的空间位置变换，因此，可以提升前端元素对齐的对齐效率。

技术领域

本说明书涉及前端元素对齐领域，尤其涉及一种前端元素对齐的方法和系统。

背景技术

近年来，随着互联网技术的飞速发展，前端页面交互的方式也越来越多样化。在页面交互设计中，一些涉及到前端元素设计的场景中，往往需要对前端元素进行对齐。现有的前端元素对齐往往是通过固定位置的方式实现。

在对现有技术的研究和实践过程中，本发明的发明人发现通过固定位置的方式实现前端元素对齐的方式，使得前端元素的对齐位置相对固定，在渲染过程无法动态调整方位，导致前端元素对齐的对齐效率较低。

因此，需要提供一种对齐效率更高的前端元素对齐的方法和系统。

发明内容

本说明书提供一种对齐效率更高的前端元素对齐的方法和系统。

第一方面，本说明书提供一种前端元素对齐方法，包括：获取前端元素对应的元素配置信息，所述前端元素包括对齐元素与所述对齐元素对应的被对齐元素；基于所述元素配置信息，迭代执行对齐操作，所述对齐操作为将所述对齐元素与所述被对齐元素进行对齐；以及输出目标对齐后元素。

在一些实施例中，所述对齐元素包括提示框和选择框的下拉弹出框中的至少一种。

在一些实施例中，所述迭代执行对齐操作包括：执行所述对齐操作直至达到预设迭代次数。

在一些实施例中，所述迭代执行对齐操作包括：执行对齐操作直至所述对齐元素达到预设对齐效果。

在一些实施例中，所述基于所述元素配置信息，迭代执行对齐操作，包括：基于所述元素配置信息，确定所述对齐元素对应的对齐尺寸；以及基于所述对齐尺寸和所述元素配置信息，迭代执行对齐操作。

在一些实施例中，所述基于所述元素配置信息，确定所述对齐元素对应的对齐尺寸，包括：基于所述元素配置信息，确定所述对齐元素对应的对齐类型为非固定对齐；以及对所述被对齐元素的尺寸进行测量，得到所述对齐元素对应的对齐尺寸。

在一些实施例中，所述基于所述元素配置信息，确定所述对齐元素对应的对齐尺寸，包括：基于所述元素配置信息，确定所述对齐元素对应的对齐类型为固定对齐；以及基于所述元素配置信息，获取所述对齐元素对应的对齐尺寸。

在一些实施例中，所述对齐操作，包括：基于所述被对齐元素的位置和所述对齐元素的当前尺寸，获取所述对齐元素的当前对齐位置；将所述对齐元素移动至所述当前对齐位置，并对所述对齐元素的样式进行更新，得到候选对齐后元素；将所述候选对齐后元素更新为所述对齐元素；以及将所述候选对齐后元素的尺寸更新为所述对齐元素的当前尺寸。

在一些实施例中，所述对所述对齐元素的样式进行更新，得到候选对齐后元素，包括：确定所述元素配置信息包括更新样式信息；以及基于所述当前对齐位置，在所述对齐元素上添加目标样式，得到候选对齐后元素，所述目标样式为所述更新样式信息对应的元素样式。

在一些实施例中，所述对所述对齐元素的样式进行更新，得到候选对齐后元素，包括：确定所述元素配置信息不包括更新样式信息；以及将所述对齐元素作为所述候选对齐后元素。

在一些实施例中，所述迭代执行对齐操作包括初始化对齐操作，所述初始化对齐操作包括：绘制所述对齐尺寸对应的初始对齐元素；以及将所述初始对齐元素的显示状态设置为透明状态，得到所述对齐元素。