CN112631566A - 代码生成方法、装置、存储介质和电子设备 - Google Patents

Abstract

本公开涉及一种代码生成方法、装置、存储介质和电子设备，该方法通过从多个预先封装的组件中获取至少一个目标组件；在代码生成页面对应的预设展示区域内显示按照预设顺序排列的目标组件，以得到由至少一个目标组件组合形成的可视化组件集合；通过封装在目标组件内的预设属性设置接口获取目标组件对应的设置属性；根据设置属性调整可视化组件集合，以得到目标页面；将目标页面中的每个目标组件以及目标组件对应的设置属性发送至代码解析器，以使代码解析器生成目标页面对应的目标代码。通过对预先封装的组件进行调用，实现可视化的页面设置，有利于减少开发人员编写代码的工作量，能够有效提升代码编写效率。

Description

代码生成方法、装置、存储介质和电子设备

技术领域

本公开涉及计算机应用技术领域，具体地，涉及一种代码生成方法、装置、存储介质和电子设备。

背景技术

通常在前端页面的开发过程中，很多页面都是由一些输入框、表格、图表等控件组成的。进行前端页面开发时，需要把这些控件逐个写到页面中进行配置，中间存在了大量的重复代码编写工作。并且在代码编写过程需要对每个控件的属性进行设置，由于目前的代码编写通常面对的都是一些晦涩的代码程序，对于一些对控件不熟悉的开发人员，可能不知道什么属性对应什么功能，需要查找手册或者帮助文档，比较费时费力，非常影响代码编写效率。

发明内容

本公开的目的是提供一种代码生成方法、装置、存储介质和电子设备。

为了实现上述目的，本公开的第一方面提供一种代码生成方法，所述方法包括：

从多个预先封装的组件中获取至少一个目标组件；

在代码生成页面对应的预设展示区域内显示按照预设顺序排列的所述目标组件，以得到由至少一个所述目标组件组合形成的可视化组件集合；

通过封装在所述目标组件内的预设属性设置接口获取所述目标组件对应的设置属性；

根据所述设置属性调整所述可视化组件集合，以得到目标页面；

将所述目标页面中的每个所述目标组件以及该目标组件对应的所述设置属性发送至代码解析器，以使所述代码解析器生成所述目标页面对应的目标代码。

可选地，将所述目标页面中的每个所述目标组件以及该目标组件对应的所述设置属性发送至代码解析器，以使所述代码解析器生成所述目标页面对应的目标代码，包括：

按照所述预设顺序将所述目标页面中的每个所述目标组件以及该目标组件对应的所述设置属性发送至所述代码解析器；

所述代码解析器按照所述预设顺序对每个目标组件进行源代码生成，以得到所述目标页面对应的目标代码。

可选地，所述代码解析器按照所述预设顺序对每个目标组件进行源代码生成，以得到所述目标页面对应的目标代码包括：

按照接收到所述目标组件以及该目标组件对应的所述设置属性的顺序将每个目标组件对应的所述设置属性带入该目标组件对应的代码位置，以生成该目标组件对应的源代码，从而得到按照所述顺序排列的至少一个目标组件对应的所述目标代码。

可选地，在从多个预先封装的组件中获取至少一个目标组件之前，所述方法还包括：

获取至少一个目标控件以及每个所述目标控件对应的属性信息，所述属性信息包括固化属性和非固化属性；

为所述非固化属性绑定预设属性设置接口，所述预设属性设置接口用于设置所述非固化属性；

将所述至少一个目标控件和每个所述目标控件对应的固化属性以及所述非固化属性对应的所述预设接口封装为组件。

可选地，在将所述至少一个目标控件和每个所述目标控件对应的固化属性以及所述非固化属性对应的所述预设接口封装为组件之后，所述方法还包括：

生成每个组件对应的页面按钮；

将所述页面按钮设置在所述预设展示区域的周围，以生成包括所述页面按钮和所述预设展示区域的所述代码生成页面。

在本公开的第二方面提供一种代码生成装置，所述装置包括：

第一获取模块，用于从多个预先封装的组件中获取至少一个目标组件；

显示模块，用于在代码生成页面对应的预设展示区域内显示按照预设顺序排列的所述目标组件，以得到由至少一个所述目标组件组合形成的可视化组件集合；

第二获取模块，用于通过封装在所述目标组件内的预设属性设置接口获取所述目标组件对应的设置属性；

调整模块，用于根据所述设置属性调整所述可视化组件集合，以得到目标页面；

代码生成模块，用于将所述目标页面中的每个所述目标组件以及该目标组件对应的所述设置属性发送至代码解析器，以使所述代码解析器生成所述目标页面对应的目标代码。

可选地，所述代码生成模块，用于：

按照所述预设顺序将所述目标页面中的每个所述目标组件以及该目标组件对应的所述设置属性发送至所述代码解析器；

所述代码解析器按照所述预设顺序对每个目标组件进行源代码生成，以得到所述目标页面对应的目标代码。

可选地，所述代码生成模块，用于：

按照接收到所述目标组件以及该目标组件对应的所述设置属性的顺序将每个目标组件对应的所述设置属性带入该目标组件对应的代码位置，以生成该目标组件对应的源代码，从而得到按照所述顺序排列的至少一个目标组件对应的所述目标代码。

可选地，所述装置还包括：

第三获取模块，用于获取至少一个目标控件以及每个所述目标控件对应的属性信息，所述属性信息包括固化属性和非固化属性；

绑定模块，用于为所述非固化属性绑定预设属性设置接口，所述预设属性设置接口用于设置所述非固化属性；

封装模块，用于将所述至少一个目标控件和每个所述目标控件对应的固化属性以及所述非固化属性对应的所述预设接口封装为组件。

可选地，所述装置还包括：

按钮生成模块，用于生成每个组件对应的页面按钮；

页面生成模块，用于将所述页面按钮设置在所述预设展示区域的周围，以生成包括所述页面按钮和所述预设展示区域的所述代码生成页面。

在本公开的第三方面提供一种计算机可读存储介质，其上存储有计算机程序，该程序被处理器执行时实现以上第一方面所述方法的步骤。

在本公开的第四方面提供一种电子设备，包括：

存储器，其上存储有计算机程序；

处理器，用于执行所述存储器中的所述计算机程序，以实现以上第一方面所述方法的步骤。

通过上述技术方案，从多个预先封装的组件中获取至少一个目标组件；在代码生成页面对应的预设展示区域内显示按照预设顺序排列的所述目标组件，以得到由至少一个所述目标组件组合形成的可视化组件集合；通过封装在所述目标组件内的预设属性设置接口获取所述目标组件对应的设置属性；根据所述设置属性调整所述可视化组件集合，以得到目标页面；将所述目标页面中的每个所述目标组件以及该目标组件对应的所述设置属性发送至代码解析器，以使所述代码解析器生成所述目标页面对应的目标代码。这样，通过对预先封装的组件进行调用，实现可视化的页面设置，能够直观的看到目标组件的应用效果，有利于减少开发人员编写代码的工作量，并且能够有效降低对开发人员对控件属性掌握熟练程度的要求，提升代码编写效率。

本公开的其他特征和优点将在随后的具体实施方式部分予以详细说明。

附图说明

附图是用来提供对本公开的进一步理解，并且构成说明书的一部分，与下面的具体实施方式一起用于解释本公开，但并不构成对本公开的限制。在附图中：

图1是本公开一示例性实施例示出的一种代码生成方法的流程图；

图2是本公开另一示例性实施例示出的代码生成方法的流程图；

图3是本公开一示例性实施例示出的一种代码生成页面示意图；

图4是本公开又一示例性实施例示出的一种代码生成装置的框图；

图5是根据本公开图4所示实施例示出的一种代码生成装置的框图；

图6是根据一示例性实施例示出的一种电子设备的框图。

具体实施方式

以下结合附图对本公开的具体实施方式进行详细说明。应当理解的是，此处所描述的具体实施方式仅用于说明和解释本公开，并不用于限制本公开。

在详细介绍本公开的实施方式之前，首先对本公开的应用场景进行以下说明，本公开可以应用于对前端页面的开发过程中，在前端页面的开发过程中，很多页面都是由一些输入框、表格、图表等控件组成的。进行前端页面开发时，需要把这些控件逐个写到页面中进行配置，中间存在了大量的重复代码编写工作。并且在代码编写过程需要对每个控件的属性进行设置，由于目前的代码编写通常面对的都是一些晦涩的代码程序，对于一些对控件不熟悉的开发人员，可能不知道什么属性对应什么功能，需要查找手册或者帮助文档，比较费时费力，非常影响代码编写效率。

为了解决上述技术问题，本公开提供一种代码生成方法、装置、存储介质和电子设备，该方法通过从多个预先封装的组件中获取至少一个目标组件；在代码生成页面对应的预设展示区域内显示按照预设顺序排列的该目标组件，以得到由至少一个该目标组件组合形成的可视化组件集合；通过封装在该目标组件内的预设属性设置接口获取该目标组件对应的设置属性；根据该设置属性调整该可视化组件集合，以得到目标页面；将该目标页面中的每个该目标组件以及该目标组件对应的该设置属性发送至代码解析器，以使该代码解析器生成该目标页面对应的目标代码。这样，通过对预先封装的组件进行调用，实现可视化的页面设置，能够直观的看到目标组件的应用效果，有利于减少开发人员编写代码的工作量，并且能够有效降低对开发人员对控件属性掌握熟练程度的要求，提升代码编写效率。

下面结合具体实施例对本公开进行说明。

图1是本公开一示例性实施例示出的一种代码生成方法的流程图；参见图1，该方法可以包括：

步骤101，从多个预先封装的组件中获取至少一个目标组件。

在本步骤之前，该方法还可以包括：获取至少一个目标控件以及每个该目标控件对应的属性信息，该属性信息包括固化属性和非固化属性；为该非固化属性绑定预设属性设置接口，该预设属性设置接口用于设置该非固化属性；将该至少一个目标控件和每个该目标控件对应的固化属性以及该非固化属性对应的该预设接口封装为组件，并生成每个组件对应的页面按钮，将该页面按钮设置在该预设展示区域的周围，以生成包括该页面按钮和该预设展示区域的该代码生成页面。

本步骤中，可以通过点击或者拖动预先封装的组件对应的页面按钮实现对该目标组件的选择与获取。

步骤102，在代码生成页面对应的预设展示区域内显示按照预设顺序排列的该目标组件，以得到由至少一个该目标组件组合形成的可视化组件集合。

其中，该预设顺序可以是该预设展示区域内由上之下或者由左至右对应的位置的目标组件的排列顺序。

步骤103，通过封装在该目标组件内的预设属性设置接口获取该目标组件对应的设置属性。

其中，该预设属性设置接口可以是提供修改自定义参数的getter和setter方法。该getter和setter方法为本领域内常用的接口程序，本公开在此不再赘述。

另外，在将该目标组件拖动至该预设展示区域内之后，该目标组件可以调用组件内封装的getter方法，加载封装在该目标组件内的固化属性对应的属性值进行展示。如果该目标组件的某些非固化属性存在默认数据，则在编辑区会默认加载该目标组件的非固化属性对应的默认值。

步骤104，根据该设置属性调整该可视化组件集合，以得到目标页面。

本步骤中，每修改一个属性值，会调用该目标组件中的setter方法，将属性值进行设置，在设置完成该属性值之后，预设展示区域内的目标组件会按照新设置的属性值进行动态展示，这样，有利于开发人员看到目标组件最终的展示效果。

步骤105，将该目标页面中的每个该目标组件以及该目标组件对应的该设置属性发送至代码解析器，以使该代码解析器生成该目标页面对应的目标代码。

本步骤中，一种可能的实施方式为：按照该预设顺序将该目标页面中的每个该目标组件以及该目标组件对应的该设置属性发送至该代码解析器；该代码解析器按照该预设顺序对每个目标组件进行源代码生成，以得到该目标页面对应的目标代码。

该代码解析器按照该预设顺序对每个目标组件进行源代码生成，以得到该目标页面对应的目标代码，可以包括：按照接收到该目标组件以及该目标组件对应的该设置属性的顺序将每个目标组件对应的该设置属性带入该目标组件对应的代码位置，以生成该目标组件对应的源代码，从而得到按照该顺序排列的至少一个目标组件对应的该目标代码。

以上技术方案，通过对预先封装的组件进行调用，在预设展示区域内通过封装在该目标组件内的预设属性设置接口设置该目标组件对应的设置属性，并根据该设置属性调整由至少一个该目标组件组成的该可视化组件集合，从而得到该目标页面，并通过该代码解析器生成该目标页面对应的目标代码，实现了可视化的页面设置，能够直观的看到目标组件的应用效果，有利于减少开发人员编写代码的工作量，并且能够有效降低对开发人员对控件属性掌握熟练程度的要求，提升代码编写效率。

图2是本公开另一示例性实施例示出的代码生成方法的流程图；参见图2，该方法可以包括以下步骤：

步骤201，获取至少一个目标控件以及每个该目标控件对应的属性信息。

其中，该属性信息包括固化属性和非固化属性，该固化属性为固定样式的，后期不可调整的属性，该非固化属性为可以调整的属性。

示例地，若一个输入框的属性包括控件的宽度，高度，双击事件，改变事件，数据来源等，其中，该宽度，高度，数据来源为可以后期根据设计需求进行调整的属性，因此可以确定为非固化属性，而若双击事件，改变事件为固定样式的，后期不可调整的属性，则可以确定为固化属性。再比如，组件宽度在80％的场景使用的都是100px，则可以将100px作为控件固化属性的默认值封装到组件里面。

步骤202，为该非固化属性绑定预设属性设置接口。

其中，该预设属性设置接口用于设置该非固化属性，例如，该预设属性设置接口可以是提供修改自定义参数的getter和setter方法。

步骤203，将该至少一个目标控件和每个该目标控件对应的固化属性以及该非固化属性对应的该预设接口封装为组件。

本步骤中，可以选择使用频率高、应用范围广的单个控件作为目标控件进行封装。也可以把应用场景较多的目标控件组合作为一个组件进行封装，例如，左数右表的页面布局作为一个组件进行封装，可以将左侧的数据来源作为非固化属性，为该数据来源绑定setter方法接口，用于定义数据来源，右侧表格列属性可以作为固化属性，将整个左数右表对应的代码以及该setter方法接口和该右侧表格列属性封装为一个组件。

步骤204，生成每个组件对应的页面按钮。

步骤205，将该页面按钮设置在该预设展示区域的周围，以生成包括该页面按钮和该预设展示区域的该代码生成页面。

示例地，如图3所示，图3是本公开一示例性实施例示出的一种代码生成页面示意图，在该图3中，包括了组件A对应的页面按钮A，组件B对应的页面按钮B，组件C对应的页面按钮C，组件D至组件K对应的页面按钮D至页面按钮K，以及该预设展示区域。在前面页面设计过程中，可以在该代码生成页面，通过拖动该页面按钮A至页面按钮D中的任一个至该预设展示区域，即将对应的目标组件拖动至了该预设展示区域，并在该预设展示区域进行位置调整(即进行排版操作)，通过该封装在该目标组件内的预设属性设置接口设置该目标组件对应的设置属性，该预设展示区域能够在获取稿该设置属性之后，实时的调整该目标组件，以得到由至少一个目标组件组合形成的目标页面，从而可以将该目标页面中的每个该目标组件以及该目标组件对应的该设置属性发送至代码解析器，以使该代码解析器生成该目标页面对应的目标代码。

以上步骤201至步骤205实现了对至少一个目标控件的封装，以得到组件，并生成每个组件对应的页面按钮，从而生成由该目标按钮和预设展示区域形成的该代码生成页面。以下步骤206至步骤211可以通过对该代码生成页面的调用进行目标代码的生成。

步骤206，从多个预先封装的组件中获取至少一个目标组件。

本步骤中，可以通过点击或者拖动预先封装的组件对应的页面按钮实现对该目标组件的选择与获取。

步骤207，在代码生成页面对应的预设展示区域内显示按照预设顺序排列的该目标组件，以得到由至少一个该目标组件组合形成的可视化组件集合。

其中，该预设顺序可以是该预设展示区域内由上之下或者由左至右对应的位置的目标组件的排列顺序。

考虑到同一个目标页面中可能会同时存在两个相同的目标组件，为了避免相同的两个目标组件被混淆，本步骤中在显示该目标组件之前，首先对每个目标组件进行编号，即为每个目标组件生成一个随机ID，不同的目标组件对应的随机ID不同。

步骤208，通过封装在该目标组件内的预设属性设置接口获取该目标组件对应的设置属性。

其中，该预设属性设置接口可以是提供修改自定义参数的getter和setter方法。

在将该目标组件拖动至该预设展示区域内之后，该目标组件可以调用组件内封装的getter方法，加载封装在该目标组件内的固化属性对应的属性值进行展示。如果该目标组件的某些非固化属性存在默认数据，则在编辑区会默认加载该目标组件的非固化属性对应的默认值。

步骤209，根据该设置属性调整该可视化组件集合，以得到目标页面。

示例地，依然以上述图3所示实施例为例进行说明，可以拖动该页面按钮A对应的目标组件A，该页面按钮C对应的目标组件C，该页面按钮D对应的目标组件D至该预设展示区域，并在该预设展示区域内对该目标组件A，目标组件C以及目标组件D分别调用setter方法，对该目标组件A，目标组件C以及目标组件D对应的非固化属性的属性值进行设置，在设置完之后，该预设展示区域内的目标组件也会按照新设置的属性值进行动态展示，从而能够方便开发人员看到最终目标组件的展示效果，并在该预设展示区域内对该设置完属性值的目标组件A，目标组件C以及目标组件D的位置进行调整，以达到目标排版效果的目标页面。

步骤210，按照该预设顺序将该目标页面中的每个该目标组件以及该目标组件对应的该设置属性发送至该代码解析器。

其中，该预设顺序可以是该预设展示区域内由上之下或者由左至右对应的位置的目标组件的排列顺序，该代码解析器可以是现有技术中常用的代码解析，代码生成工具，本公开对此不作限定。

步骤211，该代码解析器按照该预设顺序对每个目标组件进行源代码生成，以得到该目标页面对应的目标代码。

本步骤中，一种可能的实施方式为：按照接收到该目标组件以及该目标组件对应的该设置属性的顺序将每个目标组件对应的该设置属性带入该目标组件对应的代码位置，以生成该目标组件对应的源代码，从而得到按照该顺序排列的至少一个目标组件对应的该目标代码。

需要说明的是，在生成目标代码的过程中，针对该目标组件定义的业务事件，可以按照组件定义的格式生成JS(JavaScript，Java描述语言)操作函数，生成到页面脚本对应的地方。在生成该目标代码之后，在该预设展示区域内可以点击预览目标组件对应的代码，也可以将生成的目标代码保存到指定目录对应的存储单元内，作为项目的源文件呈现。

以上技术方案，通过对预先封装的组件进行调用，在预设展示区域内通过封装在该目标组件内的预设属性设置接口设置该目标组件对应的设置属性，并根据该设置属性调整由至少一个该目标组件组成的该可视化组件集合，从而得到该目标页面，并通过该代码解析器生成该目标页面对应的目标代码，实现了可视化的页面设置，能够直观的看到目标组件的应用效果，有利于减少开发人员编写代码的工作量，并且能够有效降低对开发人员对控件属性掌握熟练程度的要求，提升代码编写效率。

图4是本公开又一示例性实施例示出的一种代码生成装置的框图；参见图4，该装置可以包括：

第一获取模块401，用于从多个预先封装的组件中获取至少一个目标组件；

显示模块402，用于在代码生成页面对应的预设展示区域内显示按照预设顺序排列的该目标组件，以得到由至少一个该目标组件组合形成的可视化组件集合；

第二获取模块403，用于通过封装在该目标组件内的预设属性设置接口获取该目标组件对应的设置属性；

调整模块404，用于根据该设置属性调整该可视化组件集合，以得到目标页面；

代码生成模块405，用于将该目标页面中的每个该目标组件以及该目标组件对应的该设置属性发送至代码解析器，以使该代码解析器生成该目标页面对应的目标代码。

以上技术方案，通过对预先封装的组件进行调用，在预设展示区域内通过封装在该目标组件内的预设属性设置接口设置该目标组件对应的设置属性，并根据该设置属性调整由至少一个该目标组件组成的该可视化组件集合，从而得到该目标页面，并通过该代码解析器生成该目标页面对应的目标代码，实现了可视化的页面设置，能够直观的看到目标组件的应用效果，有利于减少开发人员编写代码的工作量，并且能够有效降低对开发人员对控件属性掌握熟练程度的要求，提升代码编写效率。

可选地，该代码生成模块405，用于：

按照该预设顺序将该目标页面中的每个该目标组件以及该目标组件对应的该设置属性发送至该代码解析器；

该代码解析器按照该预设顺序对每个目标组件进行源代码生成，以得到该目标页面对应的目标代码。

可选地，该代码生成模块405，用于：

按照接收到该目标组件以及该目标组件对应的该设置属性的顺序将每个目标组件对应的该设置属性带入该目标组件对应的代码位置，以生成该目标组件对应的源代码，从而得到按照该顺序排列的至少一个目标组件对应的该目标代码。

图5是根据本公开图4所示实施例示出的一种代码生成装置的框图；参见图5，该装置还可以包括：

第三获取模块406，用于获取至少一个目标控件以及每个该目标控件对应的属性信息，该属性信息包括固化属性和非固化属性；

绑定模块407，用于为该非固化属性绑定预设属性设置接口，该预设属性设置接口用于设置该非固化属性；

封装模块408，用于将该至少一个目标控件和每个该目标控件对应的固化属性以及该非固化属性对应的该预设接口封装为组件。

可选地，该装置还包括：

按钮生成模块409，用于生成每个组件对应的页面按钮；

页面生成模块410，用于将该页面按钮设置在该预设展示区域的周围，以生成包括该页面按钮和该预设展示区域的该代码生成页面。

以上技术方案，实现了对至少一个目标控件的封装，以得到组件，并生成每个组件对应的页面按钮，从而生成由该目标按钮和预设展示区域形成的该代码生成页面。在该代码生成页面中，通过对预先封装的组件进行调用，在预设展示区域内通过封装在该目标组件内的预设属性设置接口设置该目标组件对应的设置属性，并根据该设置属性调整由至少一个该目标组件组成的该可视化组件集合，从而得到该目标页面，并通过该代码解析器生成该目标页面对应的目标代码，实现了可视化的页面设置，能够直观的看到目标组件的应用效果，有利于减少开发人员编写代码的工作量，并且能够有效降低对开发人员对控件属性掌握熟练程度的要求，提升代码编写效率。

关于上述实施例中的装置，其中各个模块执行操作的具体方式已经在有关该方法的实施例中进行了详细描述，此处将不做详细阐述说明。

图6是根据一示例性实施例示出的一种电子设备的框图。如图6所示，该电子设备600可以包括：处理器601，存储器602。该电子设备600还可以包括多媒体组件603，输入/输出(I/O)接口604，以及通信组件605中的一者或多者。

其中，处理器601用于控制该电子设备600的整体操作，以完成上述的代码生成方法中的全部或部分步骤。存储器602用于存储各种类型的数据以支持在该电子设备600的操作，这些数据例如可以包括用于在该电子设备600上操作的任何应用程序或方法的指令，以及应用程序相关的数据，例如联系人数据、收发的消息、图片、音频、视频等等。该存储器602可以由任何类型的易失性或非易失性存储设备或者它们的组合实现，例如静态随机存取存储器(Static Random Access Memory，简称SRAM)，电可擦除可编程只读存储器(Electrically Erasable Programmable Read-Only Memory，简称EEPROM)，可擦除可编程只读存储器(Erasable Programmable Read-Only Memory，简称EPROM)，可编程只读存储器(Programmable Read-Only Memory，简称PROM)，只读存储器(Read-Only Memory，简称ROM)，磁存储器，快闪存储器，磁盘或光盘。多媒体组件603可以包括屏幕和音频组件。其中屏幕例如可以是触摸屏，音频组件用于输出和/或输入音频信号。例如，音频组件可以包括一个麦克风，麦克风用于接收外部音频信号。所接收的音频信号可以被进一步存储在存储器602或通过通信组件605发送。音频组件还包括至少一个扬声器，用于输出音频信号。I/O接口604为处理器601和其他接口模块之间提供接口，上述其他接口模块可以是键盘，鼠标，按钮等。这些按钮可以是虚拟按钮或者实体按钮。通信组件605用于该电子设备600与其他设备之间进行有线或无线通信。无线通信，例如Wi-Fi，蓝牙，近场通信(Near FieldCommunication，简称NFC)，2G、3G或4G，或它们中的一种或几种的组合，因此相应的该通信组件605可以包括：Wi-Fi模块，蓝牙模块，NFC模块。

在一示例性实施例中，电子设备600可以被一个或多个应用专用集成电路(Application Specific Integrated Circuit，简称ASIC)、数字信号处理器(DigitalSignal Processor，简称DSP)、数字信号处理设备(Digital Signal Processing Device，简称DSPD)、可编程逻辑器件(Programmable Logic Device，简称PLD)、现场可编程门阵列(Field Programmable Gate Array，简称FPGA)、控制器、微控制器、微处理器或其他电子元件实现，用于执行上述的代码生成方法。

在另一示例性实施例中，还提供了一种包括程序指令的计算机可读存储介质，该程序指令被处理器执行时实现上述的代码生成方法的步骤。例如，该计算机可读存储介质可以为上述包括程序指令的存储器602，上述程序指令可由电子设备600的处理器601执行以完成上述的代码生成方法。

以上结合附图详细描述了本公开的优选实施方式，但是，本公开并不限于上述实施方式中的具体细节，在本公开的技术构思范围内，可以对本公开的技术方案进行多种简单变型，这些简单变型均属于本公开的保护范围。

另外需要说明的是，在上述具体实施方式中所描述的各个具体技术特征，在不矛盾的情况下，可以通过任何合适的方式进行组合，为了避免不必要的重复，本公开对各种可能的组合方式不再另行说明。

此外，本公开的各种不同的实施方式之间也可以进行任意组合，只要其不违背本公开的思想，其同样应当视为本公开所公开的内容。

Claims (10)

1.一种代码生成方法，其特征在于，所述方法包括：

从多个预先封装的组件中获取至少一个目标组件；

在代码生成页面对应的预设展示区域内显示按照预设顺序排列的所述目标组件，以得到由至少一个所述目标组件组合形成的可视化组件集合；

通过封装在所述目标组件内的预设属性设置接口获取所述目标组件对应的设置属性；

根据所述设置属性调整所述可视化组件集合，以得到目标页面；

将所述目标页面中的每个所述目标组件以及该目标组件对应的所述设置属性发送至代码解析器，以使所述代码解析器生成所述目标页面对应的目标代码。

2.根据权利要求1所述的方法，其特征在于，将所述目标页面中的每个所述目标组件以及该目标组件对应的所述设置属性发送至代码解析器，以使所述代码解析器生成所述目标页面对应的目标代码，包括：

按照所述预设顺序将所述目标页面中的每个所述目标组件以及该目标组件对应的所述设置属性发送至所述代码解析器；

所述代码解析器按照所述预设顺序对每个目标组件进行源代码生成，以得到所述目标页面对应的目标代码。

3.根据权利要求2所述的方法，其特征在于，所述代码解析器按照所述预设顺序对每个目标组件进行源代码生成，以得到所述目标页面对应的目标代码包括：

按照接收到所述目标组件以及该目标组件对应的所述设置属性的顺序将每个目标组件对应的所述设置属性带入该目标组件对应的代码位置，以生成该目标组件对应的源代码，从而得到按照所述顺序排列的至少一个目标组件对应的所述目标代码。

4.根据权利要求1所述的方法，其特征在于，在从多个预先封装的组件中获取至少一个目标组件之前，所述方法还包括：

获取至少一个目标控件以及每个所述目标控件对应的属性信息，所述属性信息包括固化属性和非固化属性；

为所述非固化属性绑定预设属性设置接口，所述预设属性设置接口用于设置所述非固化属性；

将所述至少一个目标控件和每个所述目标控件对应的固化属性以及所述非固化属性对应的所述预设接口封装为组件。

5.根据权利要求4所述的方法，其特征在于，在将所述至少一个目标控件和每个所述目标控件对应的固化属性以及所述非固化属性对应的所述预设接口封装为组件之后，所述方法还包括：

生成每个组件对应的页面按钮；

将所述页面按钮设置在所述预设展示区域的周围，以生成包括所述页面按钮和所述预设展示区域的所述代码生成页面。

6.一种代码生成装置，其特征在于，所述装置包括：

第一获取模块，用于从多个预先封装的组件中获取至少一个目标组件；

显示模块，用于在代码生成页面对应的预设展示区域内显示按照预设顺序排列的所述目标组件，以得到由至少一个所述目标组件组合形成的可视化组件集合；

第二获取模块，用于通过封装在所述目标组件内的预设属性设置接口获取所述目标组件对应的设置属性；

调整模块，用于根据所述设置属性调整所述可视化组件集合，以得到目标页面；

代码生成模块，用于将所述目标页面中的每个所述目标组件以及该目标组件对应的所述设置属性发送至代码解析器，以使所述代码解析器生成所述目标页面对应的目标代码。

7.根据权利要求6所述的装置，其特征在于，所述代码生成模块，用于：

按照所述预设顺序将所述目标页面中的每个所述目标组件以及该目标组件对应的所述设置属性发送至所述代码解析器；

所述代码解析器按照所述预设顺序对每个目标组件进行源代码生成，以得到所述目标页面对应的目标代码。

8.根据权利要求5所述的装置，其特征在于，所述装置还包括：

第三获取模块，用于获取至少一个目标控件以及每个所述目标控件对应的属性信息，所述属性信息包括固化属性和非固化属性；

绑定模块，用于为所述非固化属性绑定预设属性设置接口，所述预设属性设置接口用于设置所述非固化属性；

封装模块，用于将所述至少一个目标控件和每个所述目标控件对应的固化属性以及所述非固化属性对应的所述预设接口封装为组件。

9.一种计算机可读存储介质，其上存储有计算机程序，其特征在于，该程序被处理器执行时实现权利要求1-5中任一项所述方法的步骤。

10.一种电子设备，其特征在于，包括：

存储器，其上存储有计算机程序；

处理器，用于执行所述存储器中的所述计算机程序，以实现权利要求1-5中任一项所述方法的步骤。

Images