CN111414166B

CN111414166B - 代码的生成方法、装置、设备及存储介质

Info

Publication number: CN111414166B
Application number: CN201910014443.9A
Authority: CN
Inventors: 郭启织; 周婷婷
Original assignee: Alibaba Group Holding Ltd
Current assignee: Alibaba Group Holding Ltd
Priority date: 2019-01-06
Filing date: 2019-01-06
Publication date: 2023-04-07
Anticipated expiration: 2039-01-06
Also published as: CN111414166A; WO2020140940A1

Abstract

本申请实施例提供一种代码的生成方法、装置、设备及存储介质，在本申请一些实施例中，选取可编辑图像中的可编辑的目标节点，配置目标节点的属性的绑定数据；根据可编辑图像、绑定数据以及绑定数据的解析方式，生成目标编程语言对应的代码，从而能够灵活覆盖很多视图页面的开发场景，且无需人工编码即可生成具有数据绑定功能的视图页面的代码，减少开发人工成本与时间，实现视图页面开发的统一性。

Description

代码的生成方法、装置、设备及存储介质

技术领域

本申请涉及计算机技术领域，尤其涉及一种代码的生成方法、装置、设备及存储介质。

背景技术

随着计算机的发展，编程语言的快速演进，以及网络平台的多样化，视图图像的设计软件从传统的Photoshop向sketch逐渐演进。然而设计软件的统一并没有带来静态页面代码的统一。重复的开发相似的模块是UI开发者永恒不变的痛点。

发明内容

本申请的多个方面提供一种代码的生成方法、装置、设备及存储介质，用以灵活、快速且方便地生成视图图像对应的代码，且减少开发的人力成本。

本申请实施例提供一种代码的生成方法，包括：响应于选取操作，选取在可编辑图像中展示的可编辑的目标节点；响应于配置操作，配置所述目标节点的属性的绑定数据；根据所述可编辑图像、所述绑定数据以及所述绑定数据的解析方式，生成目标编程语言对应的代码。

本申请实施例还提供一种代码的生成装置，包括：选择模块，用于响应于选取操作，选取在可编辑图像中展示的可编辑的目标节点；配置模块，用于响应于配置操作，配置所述目标节点的属性的绑定数据；生成模块，用于根据所述可编辑图像、所述绑定数据以及所述绑定数据的解析方式，生成目标编程语言对应的代码。

本申请实施例还提供一种设备，包括存储器以及处理器；所述存储器，用于存储计算机程序；所述处理器，用于执行所述计算机程序，以用于：响应于选取操作，选取在可编辑图像中展示的可编辑的目标节点；响应于配置操作，配置所述目标节点的属性的绑定数据；根据所述可编辑图像、所述绑定数据以及所述绑定数据的解析方式，生成目标编程语言对应的代码。

本申请实施例还提供一种存储有计算机程序的计算机可读存储介质，计算机程序被一个或多个处理器执行时，致使所述一个或多个处理器实现上述代码的生成方法中的步骤。

本申请实施例还提供一种代码的生成方法，包括：响应于获取操作，获取并展示可编辑图像；响应于选取操作，选取在可编辑图像中展示的可编辑的目标节点；响应于选择操作，选择所述目标节点的属性；响应于配置操作，配置所述目标节点的属性的绑定数据；响应于生成操作，根据所述可编辑图像、所述绑定数据以及所述绑定数据的解析方式，生成目标编程语言对应的代码。

本申请实施例还提供一种代码的生成装置，包括：展示模块，用于响应于获取操作，获取并展示可编辑图像；选取模块，用于响应于选取操作，选取在可编辑图像中展示的可编辑的目标节点；选择模块，用于响应于选择操作，选择所述目标节点的属性；配置模块，用于响应于配置操作，配置所述目标节点的属性的绑定数据；生成模块，用于响应于生成操作，根据所述可编辑图像、所述绑定数据以及所述绑定数据的解析方式，生成目标编程语言对应的代码。

本申请实施例还提供一种设备，包括存储器以及处理器；所述存储器，用于存储计算机程序；所述处理器，用于执行所述计算机程序，以用于：响应于获取操作，获取并展示可编辑图像；响应于选取操作，选取在可编辑图像中展示的可编辑的目标节点；响应于选择操作，选择所述目标节点的属性；响应于配置操作，配置所述目标节点的属性的绑定数据；响应于生成操作，根据所述可编辑图像、所述绑定数据以及所述绑定数据的解析方式，生成目标编程语言对应的代码。

本申请实施例还提供一种存储有计算机程序的计算机可读存储介质，其特征在于，计算机程序被一个或多个处理器执行时，致使所述一个或多个处理器实现上述代码的生成方法中的步骤。

本申请实施例还提供一种代码的生成方法，包括：确定待进行处理的可编辑图像；确定所述可编辑图像待编辑的目标节点；确定所述目标节点的属性的绑定数据；根据所述可编辑图像、所述绑定数据以及所述绑定数据的解析方式，生成目标编程语言对应的代码。

本申请实施例还提供一种代码的生成装置，包括：第一确定模块，用于确定待进行处理的可编辑图像；第二确定模块，用于确定所述可编辑图像待编辑的目标节点；第三确定模块，用于确定所述目标节点的属性的绑定数据；生成模块，用于根据所述可编辑图像、所述绑定数据以及所述绑定数据的解析方式，生成目标编程语言对应的代码。

本申请实施例还提供一种设备，包括存储器以及处理器；所述存储器，用于存储计算机程序；所述处理器，用于执行所述计算机程序，以用于：确定待进行处理的可编辑图像；确定所述可编辑图像待编辑的目标节点；确定所述目标节点的属性的绑定数据；根据所述可编辑图像、所述绑定数据以及所述绑定数据的解析方式，生成目标编程语言对应的代码。

本申请实施例还提供一种存储有计算机程序的计算机可读存储介质，其特征在于，计算机程序被一个或多个处理器执行时，致使所述一个或多个处理器实现代码的生成方法中的步骤。

在本申请实施例中，选取可编辑图像中的可编辑的目标节点，配置目标节点的属性的绑定数据；根据可编辑图像、绑定数据以及绑定数据的解析方式，生成目标编程语言对应的代码，从而能够灵活覆盖很多视图页面的开发场景，且无需人工编码即可生成具有数据绑定功能的视图页面的代码，减少开发人工成本与时间，实现视图页面开发的统一性。

附图说明

此处所说明的附图用来提供对本申请的进一步理解，构成本申请的一部分，本申请的示意性实施例及其说明用于解释本申请，并不构成对本申请的不当限定。在附图中：

图1A为本申请一示例性实施例的代码的生成方法的流程示意图；

图1B为本申请又一示例性实施例的代码的生成方法的流程示意图；

图1C为本申请又一示例性实施例的代码的生成方法的流程示意图；

图2为本申请一示例性实施例提供的可编辑图像的示意图；

图3为本申请一示例性实施例提供的选择属性的界面示意图；

图4为本申请一示例性实施例提供的绑定动态数据的界面示意图；

图5为本申请一示例性实施例提供的生成代码的界面示意图；

图6为本申请一示例性实施例提供的绑定数据后的可编辑图像与视图页面示意图；

图7为本申请又一示例性实施例提供的代码的生成装置的示意图；

图8为本申请又一示例性实施例提供的一种终端设备的结构示意图。

具体实施方式

为使本申请的目的、技术方案和优点更加清楚，下面将结合本申请具体实施例及相应的附图对本申请技术方案进行清楚、完整地描述。显然，所描述的实施例仅是本申请一部分实施例，而不是全部的实施例。基于本申请中的实施例，本领域普通技术人员在没有做出创造性劳动前提下所获得的所有其他实施例，都属于本申请保护的范围。

对于前端应用程序而言，具有良好的页面布局使得用户在使用该应用程序时，具有较好的视觉效果，且能够帮助用户快速且方便地找到想要的信息或想要的应用功能，然而页面布局需要通过对视图页面代码的开发来实现，随着视图页面的样式越来越多，开发人员需要对不同样式的视图页面的代码进行开发，从而给开发人员制造了较多重复工作。

由于开发人员需要频繁的开发相同或相似的视图页面的代码，导致开发成本和页面复用成本较差，基于本申请方案，可以帮助开发人员快速地复用已生成的视图页面的代码，来进行不同样式的视图页面的代码开发，减少开发人员的重复工作。

在本申请一些实施例中，选取可编辑图像中的可编辑的目标节点，配置目标节点的属性的绑定数据；根据可编辑图像、绑定数据以及绑定数据的解析方式，生成目标编程语言对应的代码，从而能够灵活覆盖很多视图页面的开发场景，且无需人工编码即可生成具有数据绑定功能的视图页面的代码，减少开发人工成本与时间，实现视图页面开发的统一性。

以下结合附图，详细说明本申请各实施例提供的技术方案。

图1A为本申请一示例性实施例的代码的生成方法的流程示意图。本申请实施例提供的该方法100A由终端设备响应用户的操作(例如，选取操作以及配置操作等)来执行，该方法100A包括以下步骤：

101：响应于选取操作，选取在可编辑图像中展示的可编辑的目标节点。

102：响应于配置操作，配置目标节点的属性的绑定数据。

103：根据可编辑图像、绑定数据以及绑定数据的解析方式，生成目标编程语言对应的代码。

需要说明的是，终端设备可以是任何具有一定计算能力的设备，例如，可以是智能手机、笔记本、PC(personal computer)电脑等。终端设备的基本结构包括：至少一个处理器。处理器的数量取决于终端设备的配置和类型。终端设备也可以包括存储器，该存储器可以为易失性的，例如RAM，也可以为非易失性的，例如只读存储器(Read-Only Memory，ROM)、闪存等，或者也可以同时包括两种类型。存储器内通常存储有操作系统(OperatingSystem，OS)、一个或多个应用程序，也可以存储有程序数据等。除了处理单元和存储器之外，终端设备还包括一些基本配置，例如网卡芯片、IO总线、摄像头以及音视频组件等。可选地，终端设备还可以包括一些外围设备，例如键盘、鼠标、输入笔、打印机等。其它外围设备在本领域中是众所周知的，在此不做赘述。

以下针对上述步骤进行详细地阐述：

需要说明的是，步骤101是终端设备响应于用户的选取操作，选取在可编辑图像中展示的可编辑的目标节点。

其中，可编辑图像(也可以称为静态UI)是指通过编程语言展示的节点未绑定数据的用户可视的图像。

节点是指可编辑图像中的元素，例如，可编辑图像中的标题元素、图片元素以及价格元素等。其中，目标节点就是从至少一个节点中选中的节点。

在一些实例中，响应于选取操作之前，该方法100A还包括：识别获取到的可编辑图像的静态结构，将静态结构转换为指定编程语言的树形结构，并根据树形结构展示可编辑图像；其中，如图1B所示，1001：通过从树形结构中识别出至少一个基础节点以及至少一个高级节点，展示在可编辑图像中，作为可编辑的节点，并将选取到的任一基础节点或任一高级节点作为目标节点；其中，高级节点是通过基础节点转化得到。

其中，静态结构是指从设计应用中获取到的包含该可编辑图像各个元素或节点的指定编程语言的代码结构，如，包含多个节点的JSON编程语言的代码。

树形结构是指一层次的嵌套结构。一个树形结构的外层和内层有相似的结构，所以这种结构多可以递归的表示。经典数据结构中的各种树状图是一种典型的树形结构：一颗树可以简单的表示为根，左子树，右子树。左子树和右子树又有自己的子树。例如，JSON编程语言的树形结构，该树形结构包含该可编辑图像各个元素或节点，但该树形结构相较静态结构而言更加复杂，且，静态结构是包含该可编辑图像各个元素或节点JSON编程语言的代码结构，并非是树形结构。可以根据JSON编程语言的树形结构的算法，将静态结构转换为JSON树形结构。

其中，基础节点是指可直接识别出的节点，可以包括图片节点、文字节点(也可以称为文本节点)以及容器节点。其中，容器节点是指包裹其他节点的节点，如，可以包括文字节点和/或图片节点。

高级节点是指可以由基础节点转换得到的节点。

需要说明的是，高级节点在可编辑图像上的表现和基础节点有近似，但含有其他特有的属性，视图模块会因这些特有属性而变得功能强大。例如，视频节点，视频节点在可编辑图像上表现为一个图片节点，但可以根据其节点名称确定该节点为视频节点，由于视频节点的属性可以包括视频流以及播放信息等，不同于图片节点的属性，如图片链接等，故，该视频节点属于高级节点，应将其在可编辑图像上体现为的图片节点转化为视频节点。

其中，属性是指节点的特征，并可配置参数。如，文字内容、图片样式等等。

例如，用户从终端设备本地安装的图像设计应用程序XX中导出节点未绑定数据的购物可编辑图像的数据，如，包含该购物可编辑图像的节点的XX 应用程序的编程语言，节点可以包括商品图片节点、商品标题节点、商品价格节点、购物车节点以及购买节点等等。图像设计应用程序XX将该XX应用程序的购物可编辑图像的数据的编程语言自动转化为包含该购物可编辑图像的节点的JSON编程语言，并存储在终端设备本地的存储空间内，终端设备将该JSON编程语言导入到终端设备本地安装的代码生成应用程序YY中，该应用程序YY接收到该JSON编程语言后，识别该JSON编程语言中的数据，根据JSON编程语言的树形结构的算法，将该JSON编程语言转换为JSON 树形结构，该JSON树形结构中包括以树的形式排列的节点。当生成JSON 树形结构后，可以根据XML编程语言的转换算法，将JSON树形结构转换为XML编程语言或其他界面布局编程语言，从而展示该购物可编辑图像，以及识别JSON树形结构中各个节点，根据XML编程语言的转换算法，在该可编辑图像中生成可编辑的节点，图2示出了应用程序YY的界面200，在该界面200中展示了该节点未绑定数据的购物可编辑图像，以及该应用程序YY绑定数据栏以及图层栏。在界面200中的购物可编辑图像包括可编辑的商品图片节点以及商品标题节点等。其中，商品图片节点可以为图片节点或视频节点，商品标题节点可以为商品标题节点。应理解，该购物可编辑图像可以包括很多节点，仅仅为了举例说明，此处只举例了两个节点而已。用户在终端设备上看到该购物可编辑图像后，选取该购物可编辑图像中的商品标题节点，终端设备响应于与该选取操作，根据鼠标事件，确定该商品标题节点，并进行选取。并将该商品标题节点作为目标节点。

在一些实例中，从树形结构中识别出至少一个基础节点以及至少一个高级节点，包括：将从树形结构中识别出至少一个节点作为基础节点；根据节点名称，从至少一个基础节点中获取出待转换的节点，并将待转换的节点转换为高级节点。

例如，根据前文所述，当得到该JSON树形结构后，终端设备的应用程序YY可以根据节点标识识别该JSON树形结构中的各个基础节点，图片节点和/或文字节点，在根据节点名称“视频”从基础节点中识别出与该节点名称对应的待转换的节点，将该节点转化为高级节点：视频节点。

需要说明的是，高级节点在实际应用场景中相较基础节点更为复杂，但是为了在可编辑图像中体现出该节点，可以通过基础节点的展现方式进行展示，后续还需要对该基础节点进行进一步的检查或校验，确定出该基础节点是否为高级节点。

在一些实例中，在选取目标节点后，该方法100A还包括：1002：根据选取的目标节点，获取与该目标节点对应的至少一个属性；响应于属性的查看操作，展示获取到的至少一个属性；响应于属性的选择操作，选择该目标节点的属性。

例如，根据前文所述，当用户选取目标节点后，终端设备也展示了在该购物可编辑图像上选取了商品标题节点：商品标题节点后，用户对该商品标题节点进行属性查看，终端设备的应用程序YY响应于该查看操作，可以针对该商品标题节点或该商品标题节点所属文字节点查找或获取对应的属性，如，文字内容属性、展示属性以及隐藏属性等等。并可以将这些属性通过列表的形式展示给用户，用户根据该列表中展示的属性，选择其中一个属性，如文字内容属性，终端设备的应用程序YY响应于该选择操作，选择该文字内容属性作为该商品标题节点的属性。其中，图3示出了属性选择的界面300，在该界面300中，用户选择了商品标题节点作为目标节点，在点击该商品标题节点对应的属性选择框，该界面300展示了属性列表以供用户选择属性，当用户从该属性列表中选择了文字属性后，该属性选择框中就会展示该文字属性。

在一些实例中，该方法100A还包括：根据选取的目标节点，获取并展示与目标节点对应的至少一个属性，其中，至少一个属性根据选择频率由大到小进行排序；响应于属性的选择操作，选择该目标节点的属性。

需要说明的是，节点的属性因使用频率或选择频率不同而存在优先级，比如文字节点的文字内容属性，图片节点的图片地址属性，经过统计占了80％以上的数据绑定场景。在节点选中时将最常用的节点的较高频率的属性置于推荐位置并优先操作。这是为了用户使用的易用性而特意作的，将易用性发挥到极致。

此外，还可以直接将最高频率的属性直接置于属性选择框中，或直接将该最高频率的属性作为该节点的默认属性，展示在属性选择框，无需用户进行选择，直接为用户设定了该节点的属性，为用户提供了较好的使用体验，达到智能匹配属性的效果。若用户不想要为该节点配置该属性，则可以重新按照上述方式自主选择属性。

例如，根据前文所述，在该界面300中，用户选择了商品标题节点作为目标节点，终端设备的YY应用程序根据该目标节点所属的文字节点，直接展示出使用频率或选择频率从高到低(即由大到小)的属性列表，以供用户选择，用户从列表中选择自己想要的属性后，展示在该节点的属性选择框中。或

终端设备的YY应用程序根据该目标节点所属的文字节点，获取使用频率最高或选择频率最高的对应属性，并直接在该节点的属性选择框中展示出使用频率最高或选择频率最高的对应属性。

102：响应于配置操作，配置目标节点的属性的绑定数据。

需要说明的是，步骤102是终端设备响应于用户的配置操作，配置目标节点的属性的绑定数据。

同时，步骤102也可以是终端直接进行自动配置操作，实现配置目标节点的属性的绑定数据。

在一些实例中，响应于配置操作，配置目标节点的属性的绑定数据，包括：1003：响应于静态的绑定数据的选择操作，确定绑定数据为静态值；响应于绑定数据的输入操作，确定目标节点的属性的绑定数据。

其中，绑定数据是指对可编辑图像中的文字，图片等用程序变量或静态数据进行关联的关联数据，并作为目标节点属性的属性值；那么数据绑定就是这个关联的过程。其中绑定数据可以包括静态数据和动态数据。

静态值(也可以称为静态数据)是指：程序语言中不可变的常量，即是静态的属性值，不随其他数据源变化，例如文字，图片链接等。

例如，根据前文所述，在对界面300中的商品标题节点的属性选择完成后，用户对该商品标题节点：商品标题节点的文字内容属性进行配置绑定数据，当用户想要为该节点配置静态值时或静态数据时，在购物可编辑图像中选择静态的绑定数据，终端设备的YY应用程序响应于该选择操作，确定绑定数据为静态值，用户在在该购物可编辑图像中的数据类型进行选择，例如，选择“文字”类型，并在该绑定数据框中手动输入静态数据“卫衣女秋季20XX 新款”，作为绑定数据，终端设备的YY应用程序响应于该输入操作，获取到该输入的绑定数据并展示到该绑定数据框中。从而形成了该节点与静态数据的绑定。

需要说明的是，该数据类型可用于对用户输入的绑定数据进行数据校测，确定该绑定数据是否为该数据类型。

在一些实例中，响应于配置操作，配置目标节点的属性的绑定数据，包括：1004：响应于动态的绑定数据的选择操作，确定绑定数据为动态值；获取并展示出与该目标节点的属性对应的数据源选择列表；响应于对数据源的选择操作，生成该目标节点的属性的绑定数据的获取路径。

其中，动态值(也可以称为动态数据)是指程序语言中的变量。在没有实际数据时只是一个占位符。

数据源选择列表(也可以称为动态数据列表)是指来自于不同数据平台的动态数据所组成的列表。

需要说明的是，在有可参考的数据源依据作为动态数据时，可以用选择的方式来生成动态数据的取值路径(也可以称为获取路径或索引)。

例如，根据前文所述，在对界面300中的商品标题节点的属性选择完成后，用户对该商品标题节点：商品标题节点的文字内容属性进行配置绑定数据，当用户想要为该节点配置动态值时或动态数据时，在购物可编辑图像中选择动态的绑定数据，终端设备的YY应用程序响应于该选择操作，确定绑定数据为动态值，用户在在该购物可编辑图像中的数据类型进行选择，例如，选择“文字”类型，终端设备的YY应用程序根据该属性，获取到与该属性对应的数据源选择列表，该选择列表中可以包括表示商品标题的字符，表示商品数字ID的字符、表示城市的字符以及表示想要人气的字符等等。并获取到的数据源选择列表进行展示，当用户查看到展示的数据源选择列表后，选择该数据源选择列表中的表示商品标题的字符，作为该属性的动态的绑定数据，终端设备的YY应用程序响应于该选择操作，确定绑定数据为表示商品标题的字符，并展示在绑定数据框中，同时可以确定该动态的绑定数据对应的获取路径或索引方式，以获取该绑定数据，从而形成了该节点与动态数据的绑定。其中，图4示出了绑定动态数据的界面400，在该界面400中为商品标题节点的文字内容属性“Inner text”绑定动态数据，确定该动态数据，即绑定数据为文字，并选择该数据为动态数据，终端设备的YY应用程序响应于该选择操作，展示了对应的数据源选择列表，用户选择完该动态的绑定数据后，会在绑定数据框中展示该绑定数据。如图5所示，在界面500中展示了该属性在绑定后的动态的绑定数据。

在一些实例中，还可以将高频操作的属性直接置于属性选择框中，作为该节点的默认属性，便于用户对这个属性直接操作。在垂直领域下，节点因自身具有一定特征，其可绑定的数据是有规则可循的。终端设备可以猜测节点最可能绑定的数据，自动执行数据绑定过程，达到智能匹配属性的效果。若用户不想为该节点配置该属性，则可以重新按照自主选择属性和绑定数据。

例如，根据前文所述，终端设备确定目标节点为商品标题节点后，则终端设备直接确定高频操作属性为文字内容属性，根据该文字内容属性直接确定该文字内容属性的绑定数据为高频操作绑定数据，如“aa”，并将该高频操作绑定数据作为该文字内容属性的绑定数据。或，

根据该文字内容属性直接确定该文字内容属性的绑定数据列表，该绑定数据列表中的绑定数据是根据出现频率或选择频率由大到小进行排序的，用户从该绑定数据列表中选择自己想要的绑定数据，终端设备响应于该选择操作，确定该属性的绑定数据。

在一些实例中，该方法100A还包括：1005：在响应于动态的绑定数据的选择操作后，未展示出与该目标节点的属性对应的数据源选择列表，则响应于获取路径的输入操作，确定该目标节点的属性的绑定数据的获取路径。

需要说明的是，在未有可参考的数据源依据作为动态数据时，可以直接手写绑定数据的获取路径(或索引)。

例如，根据前文所述，在购物可编辑图像中选择动态的绑定数据，终端设备的YY应用程序响应于该选择操作，确定绑定数据为动态值，用户在在该购物可编辑图像中的数据类型进行选择，例如，选择“文字”类型，此时，终端设备的YY应用程序根据该属性，未获取到与该属性对应的可靠的数据源时，则不会生成数据源选择列表，用户看到当前界面并未展示该数据源选择列表时，用户在该绑定数据框中手动输入动态数据的获取路径或索引“ZZ”，作为绑定数据，并展示在该绑定数据框中。

需要说明的是，在配置完当前一个目标节点后，用户可以继续选取想要目标节点，并配置后续目标节点的属性的绑定数据，直至用户完成所有想要的目标节点属性的数据绑定。

此外，在配置完该目标节点后的一个属性的绑定数据后，还可以针对该相同目标节点的其他属性继续进行数据绑定，直至用户完成所有想要的该目标节点的属性的数据绑定。

在一些实例中，该方法100A还包括：针对至少一个目标节点的属性的绑定数据，生成表示绑定数据的集合的描述文件。

为了不同的用途，可以给予该视图模块不同的功能或处理方式，使得这样生成的视图模块可以适配多种平台以及多种场景。通过将多个节点的多个属性的绑定数据进行集合，生成绑定数据的集合的描述文件，从而完成一份完整的数据结构。该描述文件可以增加对取值路径的模拟功能，对取值路径具有参考意义，从而模拟其他取值路径。还可以对该绑定数据的数据合法性进行集中检测，确定该绑定数据是否合法，是否存在问题等一系列功能。

还可以对绑定数据进行补充或限制，如显示绑定数据的文字在12个字数内，以及图片尺寸在m*n等等。

需要说明的是，步骤103可以是终端设备响应于用户的生成操作，根据可编辑图像、绑定数据以及绑定数据的解析方式，生成目标编程语言对应的代码。

同时，步骤103也可以是终端直接进行自动生成操作，根据可编辑图像、绑定数据以及绑定数据的解析方式，生成目标编程语言对应的代码。

其中，解析方式是指绑定数据的获取方式，例如，与数据源所在平台进行数据对接的方式等。

在一些实例中，响应于生成操作，根据可编辑图像、绑定数据以及绑定数据的解析方式，生成目标编程语言对应的代码。

在一些实例中，根据可编辑图像、绑定数据以及绑定数据的解析方式，生成目标编程语言对应的代码，包括：将具有绑定数据的可编辑图像以及绑定数据的解析方式转换成目标编程语言对应的代码。

在一些实例中，将具有绑定数据的可编辑图像以及绑定数据的解析方式转换成目标编程语言对应的代码，包括：1006：响应于编程语言的选择操作，确定目标编程语言以及与目标编程语言对应的解析算法；响应于代码的生成操作，根据解析算法，对配置了绑定数据的可编辑图像进行目标编程语言的编码，生成可编辑图像代码；1007：根据解析算法，对绑定数据解析方式进行目标编程语言的编码，生成绑定数据解析代码。

在一些实例中，该方法100A还包括：将可编辑图像代码以及绑定数据解析代码进行发布，生成对应的视图模块。

其中，编程语言是指用来定义计算机程序的形式语言，可以包括不同的多个开发编程语言，此处就不再限定。

解析算法是指用于将具有绑定数据的可编辑图像以及绑定数据的解析方式转换成目标编程语言对应代码的算法。

例如，根据前文所述，当终端设备对购物可编辑图像上的至少一个节点以及该节点的至少一个属性配置绑定数据后，用户在YY应用程序的界面上的选择目标编程语言，还可以在该界面上设置对应的应用场景，用户点击YY应用程序的界面上的代码控件，执行该生成操作，终端设备的YY应用程序响应于该代码的生成操作，确定目标编程语言对应的解析算法，根据该目标编程语言对应的生成静态视图页面代码的生成方式，解析算法将设置好绑定数据的购物可编辑图像进行编码，生成购物静态页面代码。再根据该目标编程语言对应的解析方式的生成方式，解析算法将绑定数据解析方式进行目标编程语言的编码，生成绑定数据解析代码。将可编辑图像代码以及绑定数据解析代码进行组合，并将该组合代码进行展示，图5示出了生成代码的界面500，用户可以对该组合代码进行查看，用户点击界面500中的发布控件，对该组合代码进行发布，终端设备的YY应用程序响应该发布操作，将该组合代码进行发布，并生成视图模块。图6示出了通过该视图模块生成的线上购物场景下的前端购物的视图页面600B与可编辑图像600A的对比图6。其中，在该可编辑图像600A中进行数据绑定以及代码生成以及发布后，生成了视图模块，开发人员通过运用该视图模块，形成了可视化的视图页面600B，此时绑定数据已经展示在该视图页面 600B中。

图1C为本申请一示例性实施例的代码的生成方法的流程示意图。本申请实施例提供的该方法100C由终端设备响应用户的操作(例如，获取操作、选取操作、选择操作、配置操作以及生成操作等)来执行，该方法100C包括以下步骤：

11：响应于获取操作，获取并展示可编辑图像；

12：响应于选取操作，选取在可编辑图像中展示的可编辑的目标节点；

13：响应于选择操作，选择目标节点的属性；

14：响应于配置操作，配置目标节点的属性的绑定数据；

15：响应于生成操作，根据可编辑图像、绑定数据以及绑定数据的解析方式，生成目标编程语言对应的代码。

由于前文已经详细阐述过该代码的生成过程，此处就简略对以上步骤进行说明：

11：响应于获取操作，获取并展示可编辑图像。

例如，用户在电脑本地安装的生成代码的应用程序的界面中，执行获取操作，该应用程序从电脑本地获取包含购物可编辑图像的节点的JSON编程语言，并将其转换为JSON树形结构，再将JSON树形结构转换为XML编程语言，运行该XML语言展示该购物可编辑图像以及该购物可编辑图像上的各个节点。

12：响应于选取操作，选取在可编辑图像中展示的可编辑的目标节点。

例如，根据前文所述，用户在电脑的应用程序的界面上执行选取操作，选取该购物可编辑图像上的任一节点作为目标节点，电脑响应于该选取操作，选取该目标节点。

13：响应于选择操作，选择目标节点的属性。

例如，根据前文所述，用户在电脑的应用程序的界面上执行选择操作，选择该目标节点的一个属性，电脑响应于该选择操作，选择该目标节点的属性。

14：响应于配置操作，配置目标节点的属性的绑定数据。

例如，根据前文所述，用户在电脑的应用程序的界面上执行配置操作，配置该属性的绑定数据，电脑响应于该配置操作，配置该属性的绑定数据。

例如，根据前文所述，用户在电脑的应用程序的界面上执行生成操作，针对具有绑定数据的购物可编辑图像以及绑定数据的解析方式，生成目标编程语言对应的代码。电脑响应于该生成操作，将具有绑定数据的购物可编辑图像以及绑定数据的解析方式，生成目标编程语言对应的代码。

下面结合示例性应用场景对本申请技术方案进行详细说明：

场景1：在PC(Personal Computer)电脑上的设计工具s里面导出一个可编辑图像的数据，导入到该PC端的生成代码的应用程序中，得到一个该可编辑图像的静态UI。选择该静态UI中的标题节点以及文字内容属性，并选择进行动态数据源的绑定，由于标题节点是商品的标题，所以将该属性和这个商品数据源-标题数据绑定在了一起，在确定绑定关系之后，可以对这个绑定做额外操作，比如让文字数量不超过12个，比如模拟数据的生成等，并查看代码，通过代码可以看到，其中标题已经是绑定后的数据了，最终进行代码发布。

数据绑定的思想具象化出来的对静态UI的操作可以基本替代开发人员代码，能帮助解决当前业界痛点，解放这部分的生产力。

图7为本申请又一示例性实施例提供的代码的生成装置的结构框架示意图。该装置700可以应用于终端设备中，该装置700包括选择模块701、配置模块 702和生成模块703，以下针对各个模块的功能进行详细的阐述：

选择模块701，用于响应于选取操作，选取在可编辑图像中展示的可编辑的目标节点。

配置模块702，用于响应于配置操作，配置目标节点的属性的绑定数据。

生成模块703，用于根据可编辑图像、绑定数据以及绑定数据的解析方式，生成目标编程语言对应的代码。

在一些实例中，该装置700还包括：第一识别模块，用于识别获取到的可编辑图像的静态结构，将静态结构转换为指定编程语言的树形结构，并根据树形结构展示可编辑图像；其中，第二识别模块，用于通过从树形结构中识别出至少一个基础节点以及至少一个高级节点，展示在可编辑图像中，作为可编辑的节点，并将选取到的任一基础节点或任一高级节点作为目标节点；其中，高级节点是通过基础节点转化得到。

在一些实例中，第二识别模块，用于将从树形结构中识别出至少一个节点作为基础节点；根据节点名称，从至少一个基础节点中获取出待转换的节点，并将待转换的节点转换为高级节点。

在一些实例中，在选取目标节点后，该装置700还包括：第一获取模块，用于根据选取的目标节点，获取与该目标节点对应的至少一个属性；展示模块，用于响应于属性的查看操作，展示获取到的至少一个属性；第一选择模块，用于响应于属性的选择操作，选择该目标节点的属性。

在一些实例中，该装置700还包括：第二获取模块，用于根据选取的目标节点，获取并展示与目标节点对应的至少一个属性，其中至少一个属性根据选择频率进行排序；第二选择模块，用于响应于属性的选择操作，选择该目标节点的属性。

在一些实例中，配置模块702，用于响应于静态的绑定数据的选择操作，确定绑定数据为静态值；响应于绑定数据的输入操作，确定目标节点的属性的绑定数据。

在一些实例中，配置模块702，包括：第一确定单元，用于响应于动态的绑定数据的选择操作，确定绑定数据为动态值；获取单元，用于获取并展示出与该目标节点的属性对应的数据源选择列表；第一生成单元，用于响应于对数据源的选择操作，生成该目标节点的属性的绑定数据的获取路径。

在一些实例中，该装置700还包括：确定模块，用于在响应于动态的绑定数据的选择操作后，未展示出与该目标节点的属性对应的数据源选择列表，则响应于获取路径的输入操作，确定该目标节点的属性的绑定数据的获取路径。

在一些实例中，绑定数据作为该目标节点的属性的属性值。

在一些实例中，生成模块703，用于针对至少一个目标节点的属性的绑定数据，生成表示绑定数据的集合的描述文件。

在一些实例中，生成模块703，用于将具有绑定数据的可编辑图像以及绑定数据的解析方式转换成目标编程语言对应的代码。

在一些实例中，生成模块703，包括：第二确定单元，用于响应于编程语言的选择操作，确定目标编程语言以及与目标编程语言对应的解析算法；第二生成单元，用于响应于代码的生成操作，根据解析算法，对配置了绑定数据的可编辑图像进行目标编程语言的编码，生成可编辑图像代码；第三生成单元，用于根据解析算法，对绑定数据解析方式进行目标编程语言的编码，生成绑定数据解析代码。

在一些实例中，该装置700还包括：发布模块，用于将可编辑图像代码以及绑定数据解析代码进行发布，生成对应的视图模块。

以上描述了图7所示的生成装置700的内部功能和结构，在一个可能的设计中，图7所示的生成装置700的结构可实现为终端设备，如图8所示，该终端设备800可以包括：存储器801以及处理器802；

存储器801，用于存储计算机程序；

处理器802，用于执行计算机程序，以用于：

响应于选取操作，选取在可编辑图像中展示的可编辑的目标节点；

响应于配置操作，配置目标节点的属性的绑定数据；

根据可编辑图像、绑定数据以及绑定数据的解析方式，生成目标编程语言对应的代码。

在一些实例中，处理器802还用于：识别获取到的可编辑图像的静态结构，将静态结构转换为指定编程语言的树形结构，并根据树形结构展示可编辑图像；其中，通过从树形结构中识别出至少一个基础节点以及至少一个高级节点，展示在可编辑图像中，作为可编辑的节点，并将选取到的任一基础节点或任一高级节点作为目标节点；其中，高级节点是通过基础节点转化得到。

在一些实例中，处理器802，具体用于：将从树形结构中识别出至少一个节点作为基础节点；根据节点名称，从至少一个基础节点中获取出待转换的节点，并将待转换的节点转换为高级节点。

在一些实例中，在选取目标节点后，处理器802还用于：根据选取的目标节点，获取与该目标节点对应的至少一个属性；响应于属性的查看操作，展示获取到的至少一个属性；响应于属性的选择操作，选择该目标节点的属性。

在一些实例中，处理器802还用于：根据选取的目标节点，获取并展示与目标节点对应的至少一个属性，其中至少一个属性根据选择频率进行排序；第二选择模块，用于响应于属性的选择操作，选择该目标节点的属性。

在一些实例中，处理器802，具体用于：响应于静态的绑定数据的选择操作，确定绑定数据为静态值；响应于绑定数据的输入操作，确定目标节点的属性的绑定数据。

在一些实例中，处理器802，具体用于：响应于动态的绑定数据的选择操作，确定绑定数据为动态值；获取并展示出与该目标节点的属性对应的数据源选择列表；响应于对数据源的选择操作，生成该目标节点的属性的绑定数据的获取路径。

在一些实例中，处理器802还用于：在响应于动态的绑定数据的选择操作后，未展示出与该目标节点的属性对应的数据源选择列表，则响应于获取路径的输入操作，确定该目标节点的属性的绑定数据的获取路径。

其中，绑定数据作为该目标节点的属性的属性值。

在一些实例中，处理器802，具体用于：针对至少一个目标节点的属性的绑定数据，生成表示绑定数据的集合的描述文件。

在一些实例中，处理器802，具体用于：将具有绑定数据的可编辑图像以及绑定数据的解析方式转换成目标编程语言对应的代码。

在一些实例中，处理器802，具体用于：响应于编程语言的选择操作，确定目标编程语言以及与目标编程语言对应的解析算法；响应于代码的生成操作，根据解析算法，对配置了绑定数据的可编辑图像进行目标编程语言的编码，生成可编辑图像代码；根据解析算法，对绑定数据解析方式进行目标编程语言的编码，生成绑定数据解析代码。

在一些实例中，处理器802，还用于：将可编辑图像代码以及绑定数据解析代码进行发布，生成对应的视图模块。

另外，本发明实施例提供了一种计算机存储介质，计算机程序被一个或多个处理器执行时，致使一个或多个处理器实现图1A方法实施例中代码的生成方法的步骤。

本申请又一示例性实施例提供了代码的生成装置。该装置900可以应用于终端设备中，该装置900包括展示模块901、选取模块902、选择模块903、配置模块904以及生成模块905，以下针对各个模块的功能进行详细的阐述：

展示模块901，用于响应于获取操作，获取并展示可编辑图像。

选取模块902，用于响应于选取操作，选取在可编辑图像中展示的可编辑的目标节点。

选择模块903，用于响应于选择操作，选择目标节点的属性。

配置模块904，用于响应于配置操作，配置目标节点的属性的绑定数据。

生成模块905，用于响应于生成操作，根据可编辑图像、绑定数据以及绑定数据的解析方式，生成目标编程语言对应的代码。

以上生成装置的内部功能和结构，在一个可能的设计中，生成装置的结构可实现为终端设备，该终端设备可以包括：存储器1001以及处理器1002；

存储器1001，用于存储计算机程序；

处理器1002，用于执行计算机程序，以用于：响应于获取操作，获取并展示可编辑图像；响应于选取操作，选取在可编辑图像中展示的可编辑的目标节点；响应于选择操作，选择目标节点的属性；响应于配置操作，配置目标节点的属性的绑定数据；响应于生成操作，根据可编辑图像、绑定数据以及绑定数据的解析方式，生成目标编程语言对应的代码。

另外，本发明实施例提供了一种计算机存储介质，计算机程序被一个或多个处理器执行时，致使一个或多个处理器实现图1C方法实施例中代码的生成方法的步骤。

本申请一示例性实施例还提供了一种代码的生成方法。本申请实施例提供的该方法由终端设备响应用户的操作以及终端自动操作来执行，该方法包括以下步骤：

111：确定待进行处理的可编辑图像；

112：确定可编辑图像待编辑的目标节点；

113：确定目标节点的属性的绑定数据；

114：根据可编辑图像、绑定数据以及绑定数据的解析方式，生成目标编程语言对应的代码。

由于上述步骤111、112以及114的具体实现方式已经在前文详细阐述过了，此处就不再赘述。

在一些实例中，确定可编辑图像待编辑的目标节点，包括：为用户提供可供选择的可供编辑目标节点的界面；基于用户选择，确定待编辑的目标节点。

由于此步骤的具体实现方式已经在前文详细阐述过了，此处就不再赘述。

在一些实例中，确定目标节点的属性的绑定数据，包括：根据目标节点获取对应的属性以及该属性的绑定数据。

在一些实例中，确定目标节点的属性的绑定数据，包括：根据目标节点获取对应的属性以及该属性对应的绑定数据列表，其中，该绑定数据列表中的绑定数据是根据选择频率由大到小进行排序的；响应于绑定数据的选择操作，选择该目标节点的属性的绑定数据。

本申请又一示例性实施例提供了代码的生成装置。该装置可以应用于终端设备中，该装置包括第一确定模块、第二确定模块、第三确定模块以及生成模块，以下针对各个模块的功能进行详细的阐述：

第一确定模块，用于确定待进行处理的可编辑图像；

第二确定模块，用于确定可编辑图像待编辑的目标节点；

第三确定模块，用于确定目标节点的属性的绑定数据；

生成模块，用于根据可编辑图像、绑定数据以及所述绑定数据的解析方式，生成目标编程语言对应的代码。

以上生成装置的内部功能和结构，在一个可能的设计中，生成装置的结构可实现为终端设备，该终端设备可以包括：存储器以及处理器；

存储器，用于存储计算机程序；

处理器，用于执行所述计算机程序，以用于：

确定待进行处理的可编辑图像；

确定可编辑图像待编辑的目标节点；

确定目标节点的属性的绑定数据；

另外，本发明实施例提供了一种计算机存储介质，计算机程序被一个或多个处理器执行时，致使一个或多个处理器实现上述方法中实施例中代码的生成方法的步骤111-114。

另外，在上述实施例及附图中的描述的一些流程中，包含了按照特定顺序出现的多个操作，但是应该清楚了解，这些操作可以不按照其在本文中出现的顺序来执行或并行执行，操作的序号如101、102、103等，仅仅是用于区分开各个不同的操作，序号本身不代表任何的执行顺序。另外，这些流程可以包括更多或更少的操作，并且这些操作可以按顺序执行或并行执行。需要说明的是，本文中的“第一”、“第二”等描述，是用于区分不同的消息、设备、模块等，不代表先后顺序，也不限定“第一”和“第二”是不同的类型。

以上所描述的装置实施例仅仅是示意性的，其中所述作为分离部件说明的单元可以是或者也可以不是物理上分开的，作为单元显示的部件可以是或者也可以不是物理单元，即可以位于一个地方，或者也可以分布到多个网络单元上。可以根据实际的需要选择其中的部分或者全部模块来实现本实施例方案的目的。本领域普通技术人员在不付出创造性的劳动的情况下，即可以理解并实施。

通过以上的实施方式的描述，本领域的技术人员可以清楚地了解到各实施方式可借助加必需的通用硬件平台的方式来实现，当然也可以通过硬件和软件结合的方式来实现。基于这样的理解，上述技术方案本质上或者说对现有技术做出贡献的部分可以以计算机产品的形式体现出来，本发明可采用在一个或多个其中包含有计算机可用程序代码的计算机可用存储介质(包括但不限于磁盘存储器、CD-ROM、光学存储器等)上实施的计算机程序产品的形式。

本发明是参照根据本发明实施例的方法、设备(系统)、和计算机程序产品的流程图和/或方框图来描述的。应理解可由计算机程序指令实现流程图和 /或方框图中的每一流程和/或方框、以及流程图和/或方框图中的流程和/ 或方框的结合。可提供这些计算机程序指令到通用计算机、专用计算机、嵌入式处理机或其他可编程多媒体数据处理设备的处理器以产生一个机器，使得通过计算机或其他可编程多媒体数据处理设备的处理器执行的指令产生用于实现在流程图一个流程或多个流程和/或方框图一个方框或多个方框中指定的功能的装置。

这些计算机程序指令也可存储在能引导计算机或其他可编程多媒体数据处理设备以特定方式工作的计算机可读存储器中，使得存储在该计算机可读存储器中的指令产生包括指令装置的制造品，该指令装置实现在流程图一个流程或多个流程和/或方框图一个方框或多个方框中指定的功能。

这些计算机程序指令也可装载到计算机或其他可编程多媒体数据处理设备上，使得在计算机或其他可编程设备上执行一系列操作步骤以产生计算机实现的处理，从而在计算机或其他可编程设备上执行的指令提供用于实现在流程图一个流程或多个流程和/或方框图一个方框或多个方框中指定的功能的步骤。

在一个典型的配置中，计算设备包括一个或多个处理器(CPU)、输入/输出接口、网络接口和内存。

内存可能包括计算机可读介质中的非永久性存储器，随机存取存储器 (RAM)和/或非易失性内存等形式，如只读存储器(ROM)或闪存(flash RAM)。内存是计算机可读介质的示例。

计算机可读介质包括永久性和非永久性、可移动和非可移动媒体可以由任何方法或技术来实现信息存储。信息可以是计算机可读指令、数据结构、程序的模块或其他数据。计算机的存储介质的例子包括，但不限于相变内存(PRAM)、静态随机存取存储器(SRAM)、动态随机存取存储器(DRAM)、其他类型的随机存取存储器(RAM)、只读存储器(ROM)、电可擦除可编程只读存储器 (EEPROM)、快闪记忆体或其他内存技术、只读光盘只读存储器(CD-ROM)、数字多功能光盘(DVD)或其他光学存储、磁盒式磁带，磁带磁磁盘存储或其他磁性存储设备或任何其他非传输介质，可用于存储可以被计算设备访问的信息。按照本文中的界定，计算机可读介质不包括暂存电脑可读媒体(transitory media)，如调制的数据信号和载波。

最后应说明的是：以上实施例仅用以说明本发明的技术方案，而非对其限制；尽管参照前述实施例对本发明进行了详细的说明，本领域的普通技术人员应当理解：其依然可以对前述各实施例所记载的技术方案进行修改，或者对其中部分技术特征进行等同替换；而这些修改或者替换，并不使相应技术方案的本质脱离本发明各实施例技术方案的精神和范围。

Claims

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

响应于选取操作，选取在可编辑图像中展示的可编辑的目标节点，所述可编辑图像存在相应的树形结构，所述树形结构是通过如下方式得到：识别所述可编辑图像的静态结构，将所述静态结构转换为指定编程语言的树形结构，所述静态结构是指包含所述可编辑图像各个节点的指定编程语言的代码结构；

响应于配置操作，配置所述目标节点的属性的绑定数据；

根据所述可编辑图像、所述绑定数据以及所述绑定数据的解析方式，生成目标编程语言对应的代码。

2.根据权利要求1所述的方法，其特征在于，响应于选取操作之前，所述方法还包括：

识别获取到的可编辑图像的静态结构，将所述静态结构转换为指定编程语言的树形结构，并根据所述树形结构展示所述可编辑图像；

其中，通过从所述树形结构中识别出至少一个基础节点以及至少一个高级节点，展示在所述可编辑图像中，作为可编辑的节点，并将选取到的任一基础节点或任一高级节点作为目标节点；

其中，所述高级节点是通过基础节点转化得到。

3.根据权利要求2所述的方法，其特征在于，所述从所述树形结构中识别出所述至少一个基础节点以及至少一个高级节点，包括：

将从所述树形结构中识别出所述至少一个节点作为基础节点；

根据节点名称，从所述至少一个基础节点中获取出待转换的节点，并将待转换的节点转换为高级节点。

4.根据权利要求1所述的方法，其特征在于，在选取目标节点后，所述方法还包括：

根据选取的目标节点，获取与该目标节点对应的至少一个属性；

响应于属性的查看操作，展示获取到的所述至少一个属性；

响应于属性的选择操作，选择该目标节点的属性。

5.根据权利要求1或4所述的方法，其特征在于，所述方法还包括：

根据选取的目标节点，获取并展示与所述目标节点对应的至少一个属性，其中，所述至少一个属性根据选择频率由大到小进行排序；

响应于属性的选择操作，选择该目标节点的属性。

6.根据权利要求1所述的方法，其特征在于，所述响应于配置操作，配置所述目标节点的属性的绑定数据，包括：

响应于静态的绑定数据的选择操作，确定所述绑定数据为静态值；

响应于所述绑定数据的输入操作，确定所述目标节点的属性的绑定数据。

7.根据权利要求1所述的方法，其特征在于，所述响应于配置操作，配置所述目标节点的属性的绑定数据，包括：

响应于动态的绑定数据的选择操作，确定所述绑定数据为动态值；

获取并展示出与该目标节点的属性对应的数据源选择列表；

响应于对数据源的选择操作，生成该目标节点的属性的绑定数据的获取路径。

8.根据权利要求7所述的方法，其特征在于，所述方法还包括：

在响应于动态的绑定数据的选择操作后，未展示出与该目标节点的属性对应的数据源选择列表，则响应于所述获取路径的输入操作，确定所述该目标节点的属性的绑定数据的获取路径。

9.根据权利要求1所述的方法，其特征在于，所述绑定数据作为该目标节点的属性的属性值。

10.根据权利要求1所述的方法，其特征在于，所述方法还包括：

针对至少一个目标节点的属性的绑定数据，生成表示绑定数据的集合的描述文件。

11.根据权利要求1所述的方法，其特征在于，所述根据所述可编辑图像、所述绑定数据以及所述绑定数据的解析方式，生成目标编程语言对应的代码，包括：

将具有绑定数据的可编辑图像以及所述绑定数据的解析方式转换成目标编程语言对应的代码。

12.根据权利要求11所述的方法，其特征在于，所述将具有绑定数据的可编辑图像以及所述绑定数据的解析方式转换成目标编程语言对应的代码，包括：

响应于编程语言的选择操作，确定目标编程语言以及与所述目标编程语言对应的解析算法；

响应于代码的生成操作，根据所述解析算法，对配置了绑定数据的可编辑图像进行目标编程语言的编码，生成可编辑图像代码；

根据所述解析算法，对所述绑定数据解析方式进行目标编程语言的编码，生成绑定数据解析代码。

13.根据权利要求12所述的方法，其特征在于，所述方法还包括：

将所述可编辑图像代码以及所述绑定数据解析代码进行发布，生成对应的视图模块。

14.一种代码的生成装置，其特征在于，包括：

选择模块，用于响应于选取操作，选取在可编辑图像中展示的可编辑的目标节点，所述可编辑图像存在相应的树形结构，所述树形结构是通过如下方式得到：识别所述可编辑图像的静态结构，将所述静态结构转换为指定编程语言的树形结构，所述静态结构是指包含所述可编辑图像各个节点的指定编程语言的代码结构；

配置模块，用于响应于配置操作，配置所述目标节点的属性的绑定数据；

生成模块，用于根据所述可编辑图像、所述绑定数据以及所述绑定数据的解析方式，生成目标编程语言对应的代码。

15.一种设备，其特征在于，包括存储器以及处理器；

所述存储器，用于存储计算机程序；

所述处理器，用于执行所述计算机程序，以用于：

响应于配置操作，配置所述目标节点的属性的绑定数据；

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

17.一种代码的生成方法，其特征在于，包括：

响应于获取操作，获取可编辑图像，识别所述可编辑图像的静态结构，将所述静态结构转换为指定编程语言的树形结构，并根据所述树形结构展示所述可编辑图像，所述静态结构是指包含所述可编辑图像各个节点的指定编程语言的代码结构；

响应于选择操作，选择所述目标节点的属性；

响应于配置操作，配置所述目标节点的属性的绑定数据；

响应于生成操作，根据所述可编辑图像、所述绑定数据以及所述绑定数据的解析方式，生成目标编程语言对应的代码。

18.一种代码的生成装置，其特征在于，包括：

展示模块，用于响应于获取操作，获取可编辑图像，识别所述可编辑图像的静态结构，将所述静态结构转换为指定编程语言的树形结构，并根据所述树形结构展示所述可编辑图像，所述静态结构是指包含所述可编辑图像各个节点的指定编程语言的代码结构；

选取模块，用于响应于选取操作，选取在可编辑图像中展示的可编辑的目标节点；

选择模块，用于响应于选择操作，选择所述目标节点的属性；

生成模块，用于响应于生成操作，根据所述可编辑图像、所述绑定数据以及所述绑定数据的解析方式，生成目标编程语言对应的代码。

19.一种设备，其特征在于，包括存储器以及处理器；

所述存储器，用于存储计算机程序；

所述处理器，用于执行所述计算机程序，以用于：

响应于选择操作，选择所述目标节点的属性；

响应于配置操作，配置所述目标节点的属性的绑定数据；

20.一种存储有计算机程序的计算机可读存储介质，其特征在于，计算机程序被一个或多个处理器执行时，致使所述一个或多个处理器实现权利要求17项所述方法中的步骤。

21.一种代码的生成方法，其特征在于，包括：

确定待进行处理的可编辑图像，所述可编辑图像存在相应的树形结构，所述树形结构是通过如下方式得到：识别所述可编辑图像的静态结构，将所述静态结构转换为指定编程语言的树形结构，所述静态结构是指包含所述可编辑图像各个节点的指定编程语言的代码结构；

确定所述可编辑图像待编辑的目标节点；

确定所述目标节点的属性的绑定数据；

22.根据权利要求21所述的方法，其特征在于，所述确定所述可编辑图像待编辑的目标节点，包括：

为用户提供可供选择的可供编辑目标节点的界面；

基于用户选择，确定待编辑的目标节点。

23.根据权利要求21或22所述的方法，其特征在于，所述确定所述目标节点的属性的绑定数据，包括：

根据所述目标节点获取对应的属性以及该属性的绑定数据。

24.根据权利要求21或22所述的方法，其特征在于，所述确定所述目标节点的属性的绑定数据，包括：

根据所述目标节点获取对应的属性以及该属性对应的绑定数据列表，其中，该绑定数据列表中的绑定数据是根据选择频率由大到小进行排序的；

响应于绑定数据的选择操作，选择该目标节点的属性的绑定数据。

25.一种代码的生成装置，其特征在于，包括：

第一确定模块，用于确定待进行处理的可编辑图像，所述可编辑图像存在相应的树形结构，所述树形结构是通过如下方式得到：识别所述可编辑图像的静态结构，将所述静态结构转换为指定编程语言的树形结构，所述静态结构是指包含所述可编辑图像各个节点的指定编程语言的代码结构；

第二确定模块，用于确定所述可编辑图像待编辑的目标节点；

第三确定模块，用于确定所述目标节点的属性的绑定数据；

26.一种设备，其特征在于，包括存储器以及处理器；

所述存储器，用于存储计算机程序；

所述处理器，用于执行所述计算机程序，以用于：

确定所述可编辑图像待编辑的目标节点；

确定所述目标节点的属性的绑定数据；

27.一种存储有计算机程序的计算机可读存储介质，其特征在于，计算机程序被一个或多个处理器执行时，致使所述一个或多个处理器实现权利要求21-24任一项所述方法中的步骤。