[发明专利]一种布局关系的代码生成方法及装置

说明书

本发明实施例提供了一种布局关系的代码生成方法及装置，涉及应用程序技术领域，其中，上述方法包括：确定用户界面的设计文件反映的用户界面中各个图层的位置与尺寸；根据各个图层的位置，确定各个图层的依赖信息；根据每一图层的依赖信息和每一图层的位置，获得每一图层的位置与该图层的依赖信息所表示的位置间相对位置的描述信息；根据每一图层的描述信息和尺寸，生成各个图层的布局关系；参照预设的代码规则，生成用于描述布局关系的代码。应用本发明实施例提供的方案生成布局关系的代码，提高了生成布局关系的代码的效率。

技术领域

本发明涉及应用程序技术领域，特别是涉及一种布局关系的代码生成方法及装置。

背景技术

在UI(User Interface，用户界面)开发场景中，通常由设计人员对UI界面进行设计，得到设计文件，再由开发人员根据设计文件进行UI开发。

设计人员所设计的UI界面通常包含多个图层，各个图层可能会分布在UI的不同位置，形成图层之间的布局关系。开发人员在开发UI过程中需要通过代码实现上述布局关系。

现有技术中，一般需要开发人员分析设计文件，得到上述布局关系，再依据布局关系编写代码。这样导致生成布局关系的代码过程中需要花费较大的人力资源，导致生成布局关系的代码的效率较低。

发明内容

本发明实施例的目的在于提供一种布局关系的代码生成方法，以提高生成布局关系的代码的效率。具体技术方案如下：

在本发明实施的第一方面，首先提供了一种布局关系的代码生成方法，所述方法包括：

确定用户界面的设计文件反映的所述用户界面中各个图层的位置与尺寸；

根据各个图层的位置，确定各个图层的依赖信息，每一图层的依赖信息表征生成所述用户界面时确定该图层位置要参考的位置；

根据每一图层的依赖信息和每一图层的位置，获得每一图层的位置与该图层的依赖信息所表示的位置间相对位置的描述信息；

根据每一图层的描述信息和尺寸，生成各个图层的布局关系；

参照预设的代码规则，生成用于描述所述布局关系的代码。

本发明的一个实施例中，所述根据各个图层的位置，确定各个图层的依赖信息，包括：

确定各个图层中的基准图层，并根据所述基准图层的位置获得所述基准图层的备选依赖信息；

根据各个图层的位置，确定所述用户界面中外层的图层单元，其中，所述图层单元为：图层行或图层列，所述图层行中各图层沿横向扩展后与至少一个其他图层存在相交区域，所述图层列中各图层沿纵向扩展后与至少一个其他图层存在相交区域；

按照预设的遍历顺序确定方式，确定各个外层的图层单元的遍历顺序，其中，所述遍历顺序确定方式为：根据图层单元与用户界面的边缘之间的距离，以及图层单元之间的距离，确定图层单元的遍历顺序；

针对每一外层的图层单元，以该图层单元为待操作单元，按照所述遍历顺序确定方式，获得所述待操作单元中按照行列交错方式确定的图层单元的遍历顺序，将所述待操作单元更新为所确定的图层单元中包含多个图层的图层单元，并返回所述按照所述遍历顺序确定方式，获得所述待操作单元中按照行列交错方式确定的图层单元的遍历顺序的步骤，直至所确定的图层单元中不存在包含多个图层的图层单元，其中，所述行列交错方式为：所述待操作单元为图层行时，所确定的图层单元为图层列，所述待操作图层单元为图层列时，所确定的图层单元为图层行；

针对除所述基准图层外的每一图层，将第一图层、第二图层以及所述基准图层作为该图层的备选依赖信息，其中，所述第一图层为：遍历顺序位于目标图层单元之前的外层的图层单元所包含的图层，所述第二图层为：在所述目标图层单元中遍历顺序位于该图层之前的图层，所述目标图层单元为：该图层所在的外层的图层单元；