[发明专利]生成页面搭建区块的方法及电子设备

说明书

本申请实施例公开了生成页面搭建区块的方法及电子设备。所述方法包括：接收待处理的输入图片；从所述输入图片中识别出至少一个图形元素，并确定所述图形元素分别对应的组件类型信息；所述组件类型信息与关联的素材库中定义的搭建组件类型相关；将所识别出的至少一个图形元素分别映射为具有对应类型属性的搭建组件；所述搭建组件是关联的素材库中已定义的搭建组件；通过将映射出的至少一个搭建组件进行组合，生成搭建区块，所述搭建区块用于搭建页面。通过本申请实施例，能够进一步提升页面开发效率，降低开发成本。

技术领域

本申请涉及低代码开发技术领域，特别是涉及生成页面搭建区块的方法及电子设备。

背景技术

低代码开发平台是通过可视化进行网页或移动端应用界面等各种页面开发的平台。通过这种平台，无需编码(0代码)或通过少量代码就可以快速生成目标页面。也就是说，允许终端用户使用易于理解的可视化工具来创建自己的页面，而不是传统的编写代码方式。这样，具有不同经验水平的开发人员都可以通过图形化的用户界面，对于大型企业来讲，由于不仅是具有专业编程能力的程序员，非技术背景的人员同样可以构建页面，因此，低代码开发平台还可以降低人员培训、技术部署等方面的成本。

现有技术中，用户在使用这种低代码开发平台进行页面开发时，主要是使用拖拽组件和模型驱动的逻辑来创建页面。例如，平台的编辑界面中可以提供组件列表区，其中展示有多种可选的搭建组件(如果一个模块需要重复使用，那么就可以定义为平台中的一个组件)。其中可以包括文本框、下拉框等基础组件，还可以包括富文本、列表容器、折叠面板、条件容器等高级组件，另外还可以包括布局相关的组件，如卡片、分栏、分组等等。用户可以从这些搭建组件中选择所需的组件，拖拽到编辑区进行页面搭建。完成搭建之后进行交付时，平台可以根据具体的组件以及组件之间的布局关系等，生成对应的页面代码。

上述页面开发方式能够数倍提升开发效率，并大幅降低开发成本。但仍然存在进一步提升的空间。

发明内容

本申请提供了生成页面搭建区块的方法及电子设备，能够进一步提升页面开发效率，降低开发成本。

本申请提供了如下方案：

一种生成页面搭建区块的方法，包括：

接收待处理的输入图片；

从所述输入图片中识别出至少一个图形元素，并确定所述图形元素分别对应的组件类型信息；所述组件类型信息与关联的素材库中定义的搭建组件类型相关；

将所识别出的至少一个图形元素分别映射为具有对应类型属性的搭建组件；所述搭建组件是关联的素材库中已定义的搭建组件；

通过将映射出的至少一个搭建组件进行组合，生成搭建区块，所述搭建区块用于搭建页面。

其中，所述输入图片是通过对已发布页面中包括的目标功能区块中的内容进行截图的方式获得的。

其中，还包括：

确定所述搭建区块关联的搭建组件的布局属性，所述布局属性用于描述对应的搭建组件在所述搭建区块中的布局方式信息，以便在所述搭建区块被选择后，将所述多个搭建组件按照所述布局属性、以组合的形式展示到搭建界面的编辑区域。

其中，所述搭建区块关联的搭建组件的布局属性是根据对应的图形元素在所述输入图片中的布局信息进行确定的。

其中，所述从所述输入图片中识别出至少一个图形元素，并确定所述图形元素对应的组件类型信息，包括：

将所述输入图片输入到预先训练完成的算法模型中，以便通过所述算法模型对所述输入图片中包括的图形元素对应的组件类型进行识别；