CN109117228A - 图形界面的生成方法及装置 - Google Patents

Abstract

本发明公开了一种图形界面的生成方法及装置。其中，方法包括：对与图形界面相关的目标图片进行图像识别，确定目标图片中包含的基础控件，并获取基础控件的属性信息；根据基础控件的属性信息，生成与目标图片对应的界面描述文件；解析界面描述文件，获得与界面描述文件对应的解析结果；根据解析结果生成与目标图片对应的图形界面。采用本方案，可将视觉图等图片自动生成相应的图形界面，图形界面的生成效率高，人工成本低，并且，图像界面的生成过程简单易行，适于大规模应用。

Description

图形界面的生成方法及装置

技术领域

本发明涉及计算机技术领域，具体涉及一种图形界面的生成方法及装置。

背景技术

图形界面是采用图形化的方式来显示用户操作界面，其与命令行等界面相比，具有操作简洁、界面人性化、用户认知负担小以及用户体验高等特点，从而被广泛应用。

目前，在图形界面的开发过程中，通常需先获取生成图形界面所需的视觉图，再经由界面开发人员对视觉图进行人工分析后，制定相应的图形界面绘制策略，进行根据绘制策略生成对应的图形界面。

然而，现有技术在通过人工分析视觉图生成图形界面过程中，人工成本较高，图形界面开发效率低下，不利于大规模应用。

发明内容

鉴于上述问题，提出了本发明以便提供一种克服上述问题或者至少部分地解决上述问题的图形界面的生成方法及装置。

根据本发明的一个方面，提供了一种图形界面的生成方法，包括：

对与所述图形界面相关的目标图片进行图像识别，确定所述目标图片中包含的基础控件，并获取所述基础控件的属性信息；

根据所述基础控件的属性信息，生成与所述目标图片对应的界面描述文件；

解析所述界面描述文件，获得与所述界面描述文件对应的解析结果；

根据所述解析结果生成与所述目标图片对应的图形界面。

可选的，所述根据所述基础控件的属性信息，生成与目标图片对应的界面描述文件进一步包括：

根据所述基础控件的属性信息，确定各个基础控件之间的层级关系；

根据各个基础控件之间的层级关系以及所述基础控件的属性信息，生成与目标图片对应的界面描述文件。

可选的，所述界面描述文件为树形控件描述文件。

可选的，所述属性信息包括位置信息及尺寸信息；

则所述根据所述基础控件的属性信息，确定各个基础控件之间的层级关系进一步包括：

根据所述基础控件的位置信息及尺寸信息，确定各个基础控件之间的层级关系。

可选的，所述根据所述基础控件的位置信息及尺寸信息，确定各个基础控件之间的层级关系进一步包括：

根据所述基础控件的位置信息及尺寸信息，确定所述基础控件的控件区域；

根据各个基础控件对应的控件区域之间的包含关系，确定各个基础控件之间的层级关系。

可选的，所述属性信息还包括：颜色信息、文本内容信息、和/或非文本内容信息。

可选的，所述根据所述基础控件的属性信息，生成与所述目标图片对应的界面描述文件进一步包括：

根据所述基础控件的属性信息，生成与所述目标图片对应的树形控件描述文件；

将所述树形控件描述文件转换为预设布局的界面描述文件。

可选的，所述预设布局为Flexbox布局。

可选的，在所述解析所述界面描述文件，获得与所述界面描述文件对应的解析结果之前，所述方法还包括：

接收并根据针对于生成的界面描述文件的更改操作，更改所述界面描述文件。

可选的，在所述解析所述界面描述文件，获得与所述界面描述文件对应的解析结果之前，所述方法还包括：

在生成的界面描述文件中的各个基础控件中***对应的控件元素数据，更新界面描述文件。

可选的，在所述生成与所述目标图片对应的界面描述文件之后，所述方法还包括：

存储所述界面描述文件，并生成与所述界面描述文件对应的访问标识。

可选的，所述访问标识以二维码形式呈现；

则在解析所述界面描述文件，获得与所述界面描述文件对应的解析结果之前，所述方法还包括：

接收并根据预设终端针对于与所述界面描述文件对应的二维码的扫描操作，将所述界面描述文件发送至所述预设终端；

则所述解析所述界面描述文件，获得与所述界面描述文件对应的解析结果，根据所述解析结果生成与所述目标图片对应的图形界面由所述预设终端执行。

可选的，在所述根据所述解析结果生成与所述目标图片对应的图形界面之后，所述方法还包括：

呈现所述图形界面。

可选的，所述呈现所述图形界面进一步包括：

将所述图形界面***预设界面中的预设位置；

或者，将所述界面以独立界面形式呈现。

可选的，所述基础控件包括文本控件和/或非文本控件。

根据本发明的另一方面，提供了一种图形界面的生成装置，包括：

确定模块，对所述图形界面相关的目标图片进行图像识别，确定所述目标图片中包含的基础控件；

获取模块，适于获取所述基础控件的属性信息；

文件生成模块，适于根据所述基础控件的属性信息，生成与所述目标图片对应的界面描述文件；

解析模块，适于解析所述界面描述文件，获得与所述界面描述文件对应的解析结果；

界面生成模块，适于根据所述解析结果生成与所述目标图片对应的图形界面。

可选的，所述文件生成模块进一步适于：

根据所述基础控件的属性信息，确定各个基础控件之间的层级关系；

根据各个基础控件之间的层级关系以及所述基础控件的属性信息，生成与目标图片对应的界面描述文件。

可选的，所述界面描述文件为树形控件描述文件。

可选的，所述属性信息包括位置信息及尺寸信息；

则所述文件生成模块进一步适于：根据所述基础控件的位置信息及尺寸信息，确定各个基础控件之间的层级关系。

可选的，所述文件生成模块进一步适于：

根据所述基础控件的位置信息及尺寸信息，确定所述基础控件的控件区域；

根据各个基础控件对应的控件区域之间的包含关系，确定各个基础控件之间的层级关系。

可选的，所述属性信息还包括：颜色信息、文本内容信息、和/或非文本内容信息。

可选的，所述文件生成模块进一步适于：

根据所述基础控件的属性信息，生成与所述目标图片对应的树形控件描述文件；

将所述树形控件描述文件转换为预设布局的界面描述文件。

可选的，所述预设布局为Flexbox布局。

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

更改模块，适于接收并根据针对于生成的界面描述文件的更改操作，更改所述界面描述文件。

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

***模块，适于在生成的界面描述文件中的各个基础控件中***对应的控件元素数据，并更新界面描述文件。

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

存储模块，适于存储所述界面描述文件；

标识生成模块，适于并生成与所述界面描述文件对应的访问标识。

可选的，所述访问标识以二维码形式呈现；

则所述装置还包括：

接收模块，适于接收并根据预设终端针对于与所述界面描述文件对应的二维码的扫描操作；

发送模块，适于将所述界面描述文件发送至所述预设终端；

则所述解析模块及所述界面生成模块设置于所述预设终端。

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

呈现模块，适于呈现所述图形界面。

可选的，所述呈现模块进一步适于：

将所述图形界面***预设界面中的预设位置；

或者，将所述界面以独立界面形式呈现。

可选的，所述基础控件包括文本控件和/或非文本控件。

根据本发明的又一方面，提供了一种计算设备/终端/服务器，包括：处理器、存储器、通信接口和通信总线，所述处理器、所述存储器和所述通信接口通过所述通信总线完成相互间的通信；

所述存储器用于存放至少一可执行指令，所述可执行指令使所述处理器执行上述图形界面的生成方法对应的操作。

根据本发明的再一方面，提供了一种计算机存储介质，所述存储介质中存储有至少一可执行指令，所述可执行指令使处理器执行如上述图形界面的生成方法对应的操作。

根据本发明提供的图形界面的生成方法及装置。通过图像识别的方式确定与图形界面相关的目标图片中所包含的基础控件，并获取基础控件的属性信息，进一步根据基础控件的属性信息，生成与目标图片对应的界面描述文件，最终解析界面描述文件，获得与界面描述文件对应的解析结果，并根据解析结果生成与目标图片对应的图形界面。本方案可将视觉图等图片自动生成相应的图形界面，图形界面的生成效率高，人工成本低，并且图像界面的生成过程简单易行，适于大规模应用。

上述说明仅是本发明技术方案的概述，为了能够更清楚了解本发明的技术手段，而可依照说明书的内容予以实施，并且为了让本发明的上述和其它目的、特征和优点能够更明显易懂，以下特举本发明的具体实施方式。

附图说明

通过阅读下文优选实施方式的详细描述，各种其他的优点和益处对于本领域普通技术人员将变得清楚明了。附图仅用于示出优选实施方式的目的，而并不认为是对本发明的限制。而且在整个附图中，用相同的参考符号表示相同的部件。在附图中：

图1示出了根据本发明一个实施例提供的图形界面的生成方法的流程示意图；

图2示出了根据本发明另一个实施例提供的图形界面的生成方法的流程示意图；

图3示出了根据本发明另一个实施例提供的一种目标图片示意图；

图4示出了图3中所示目标图片中的各个基础控件之间的层级关系示意图；

图5示出了根据本发明一个实施例提供的图形界面的生成装置的功能结构示意图；

图6示出了根据本发明一个实施例提供的一种计算设备的结构示意图。

具体实施方式

下面将参照附图更详细地描述本公开的示例性实施例。虽然附图中显示了本公开的示例性实施例，然而应当理解，可以以各种形式实现本公开而不应被这里阐述的实施例所限制。相反，提供这些实施例是为了能够更透彻地理解本公开，并且能够将本公开的范围完整的传达给本领域的技术人员。

图1示出了根据本发明一个实施例提供的图形界面的生成方法的流程示意图。如图1所示，该方法包括：

步骤S110，对与图形界面相关的目标图片进行图像识别，确定目标图片中包含的基础控件，并获取基础控件的属性信息。

具体地，首先获取与图形界面相关的目标图片。其中，本发明对目标图片的具体类型及图片来源等不做限定。例如，目标图片既可以为可通过特定工具(如photoshop工具)打开并获取其图层信息的视觉图，也可以为无法通过特定工具打开并获知其图层信息的图片，如已经合并图层的应用界面截图等。并且，本发明中所述的目标图片既可以为完整图片，也可以为某一图片中的部分区域。

进一步地，由于在实际的实施过程中图形界面中可包含多种控件，如按钮控件、时间控件、图片控件、背景控件等等，从而使得界面逻辑复杂。然而，图形界面中的控件均可由一种或多种基础控件组成。例如，所有的图形界面均可由文本控件及非文本控件(如图片控件)等基础控件组成。所以，本发明中将界面中的各个控件简化为由一个或多个基础控件组成的控件，从而简化后续图形界面的生成逻辑，提升图形界面的生成效率，因此，本步骤中在获取目标图片之后，对与图形界面相关的目标图片进行图像识别，从而确定目标图片中包含的基础控件及基础控件的属性信息。

其中，本实施例对目标图片进行图像识别确定其包含的基础控件及获取基础控件的具体方法不做限定，本领域技术人员可根据实际的业务情况自行设置，例如可通过文本识别或轮廓识别等方法确定目标图片中所包含的文本控件或图片控件及获取相应的控件属性。

步骤S120，根据基础控件的属性信息，生成与目标图片对应的界面描述文件。

具体地，根据各个基础控件的属性信息，可确定目标图片中的控件结构布局，从而根据该控件结构布局生成与目标图片对应的界面描述文件。例如，根据各个基础控件的位置及内容等属性信息，可确定目标图片中各个基础控件的位置等信息，从而获知该目标图片的结构布局，进而生成与目标图片对应的界面描述文件。

步骤S130，解析界面描述文件，获得与界面描述文件对应的解析结果。

在生成与目标图片对应的界面描述文件之后，为生成相应的图形界面，需对生成的界面描述文件进行解析，以获得与界面描述文件对应的解析结果。

步骤S140，根据解析结果生成与目标图片对应的图形界面。

根据步骤S130获得的解析结果自动生成与目标图片对应的图形界面，从而根据目标图片直接生成对应的图形界面。

由此可见，本实施例中将图形界面简化为一个或多个基础控件，由此来简化图形界面生成逻辑，提升图形界面的生成效率；并通过图像识别的方式快速且自动化地确定与图形界面相关的目标图片中所包含的基础控件及基础控件的属性信息，并进一步根据基础控件的属性信息，生成与目标图片对应的界面描述文件，最终解析界面描述文件，获得与界面描述文件对应的解析结果，并根据解析结果生成与目标图片对应的图形界面。本方案可将任意类型的图片自动生成相应的图形界面，图形界面的生成效率高，人工成本低，并且，图像界面的生成过程简单易行，适于大规模应用。

图2示出了根据本发明另一个实施例提供的图形界面的生成方法的流程示意图。如图2所示，该方法包括：

步骤S210，对与图形界面相关的目标图片进行图像识别，确定目标图片中包含的基础控件，并获取基础控件的属性信息。

首先，获取与图形界面相关的目标图片。其中，本实施例对目标图片的具体类型及来源不做限定。例如，目标图片可以为如图3所示的屏幕截图。在获取目标图片之后，可将目标图片进行存储，以供后续对该目标图片进行图像识别。可选的，可将目标图片存储至内存中，从而便于后续对目标图片的快速处理，提升图形界面整体的生成效率。

进一步地，对目标图片进行图像识别，确定目标图片中包含的基础控件，并获取目标图片中包含的各个基础控件的属性信息。其中多个基础控件可组成形成对应的复合控件。其中，基础控件包括文本控件和/或非文本控件。进一步地，非文本控件可以为图片控件。在实际的实施过程中，为降低控件信息存储数据量，本实施例中的非文本控件也可以包括背景控件，其中，背景控件可转换为相应的图片控件。如图3中所示的基础控件31，其可以被作为图片控件，但由于该控件为单一颜色组成，且图片控件的存储数据量较大，所以，本实施例中可将其确定为背景控件。

在对目标图片进行图像识别的过程中，可根据基础控件类型，采用相应的图像识别方法对目标图片进行图像识别，从而确定目标图片中包含的基础控件。

具体地，针对于文本控件，可采用OCR(Optical Character Recognition，光学字符识别)技术对目标图片进行OCR识别，确定目标图片中包含的文本控件。针对于非文本控件，可采用轮廓提取技术，对目标图片进行轮廓提取，确定目标图片中包含的非文本控件。

可选的，在采用轮廓提取技术对目标图片进行轮廓提取，确定目标图片中包含的非文本控件过程中，为降低目标图片中的颜色等信息对轮廓提取的干扰，提高轮廓提取的精度及效率，可将目标图片转换为与目标图片对应的灰度图，并对该灰度图进行边缘检测，确定目标图片中包含的非文本控件。具体地，可采用opencv等工具将目标图片转换为对应的灰度图，并利用Canny等算法对灰度图进行边缘检测，确定目标图片中包含的非文本控件。

可选的，在采用轮廓提取技术对目标图片进行轮廓提取，确定目标图片中包含的非文本控件过程中，当图片中存在渐变区域或多彩区域时，通常使得提取出的轮廓中包含有冗余轮廓(如将图片控件内部的某一图片元素提取出作为一个轮廓)。所以，本实施例中可先对目标图片进行轮廓提取，确定目标图片中包含的非文本候选控件，并进一步对非文本候选控件进行过滤，过滤掉非文本候选控件中包含的非文本冗余控件，从而获得目标图片中包含的非文本控件。其中，本实施例对具体的过滤掉非文本候选控件中包含的非文本冗余控件的过滤规则不做限定，本领域技术人员可根据实际的业务情况自行选择。例如，可获取并根据非文本候选控件的颜色直方图，过滤掉非文本候选控件中包含的非文本冗余控件。如若第一非文本候选控件的颜色直方图与第二非文本候选控件中某部分的颜色直方图相匹配，则确定第一非文本候选控件位于第二非文本候选控件中，则将第一非文本候选控件确定为非文本冗余控件；也可以根据非文本候选控件的外接矩形，并结合对目标图片进行OCR识别后获得的文本控件的区域，过滤掉非文本候选控件中包含的非文本冗余控件。如若某一非文本候选控件的外接矩形与某一文本控件的区域相交，但该外接矩形并未完全包含该文本控件或者未被该文本控件完全包含时，则确定该非文本候选控件为非文本冗余控件。

进一步地，在确定目标图片中包含的基础控件之后，或者确定目标图片中包含的基础控件的过程中，获取目标图片中包含的各个基础控件的属性信息。其中，属性信息包括位置信息及尺寸信息，或者，属性信息还可进一步包括颜色信息、文本内容信息、和/或非文本内容信息。具体地，针对于文本控件，属性信息可以为文本控件的位置信息、尺寸信息、文本内容信息、文本颜色信息等；而图片控件，属性信息可以为图片控件的位置信息、尺寸信息、图片内容信息(如可将图片内容压缩为64位base码进行存储)等；背景控件的属性信息可以为背景控件的位置信息、尺寸信息、及背景颜色信息等。在此，本领域技术人员应当理解的是，本实施例对获取目标图片中包含的各个基础控件的属性信息的具体时机及具体方法不做限定，例如，可在确定目标图片中包含的基础控件过程中，采用OCR及轮廓提取技术同时获取各个基础控件的属性信息，也可以在后续步骤中确定各个基础控件之间的层级关系之后，遍历各个层级关系中各个基础控件节点，获取各个基础控件对应的属性信息。

以图3为例，通过本步骤对其进行图像识别后，可确定图3中包含有基础控件8个，即基础控件31至基础控件38。其中，基础控件31为非文本控件(可将其作为背景控件)，其属性信息可包含基础控件31的位置信息、尺寸信息以及背景颜色信息(黑色)；基础控件32为非文本控件(可将其作为背景控件)，其属性信息可包含基础控件32的位置信息、尺寸信息以及背景颜色信息(灰色)；基础控件33为非文本控件(可将其作为图片控件)，其属性信息中可包含基础控件33的位置信息、尺寸信息以及将图片压缩后获得的64位base码；基础控件34为文本控件，其属性信息中可包含基础控件34的位置信息、尺寸信息、文本内容“请扫桌号二维码下单”及文本颜色(黑色)；同理，基础控件35、基础控件37及基础控件38均为文本控件，而基础控件36为非文本控件(将其确定为背景颜色为黑色的背景控件)。

步骤S220，根据基础控件的属性信息，确定各个基础控件之间的层级关系，并根据各个基础控件之间的层级关系以及基础控件的属性信息，生成与目标图片对应的树形控件描述文件。

在获取各个基础控件的属性信息之后，可根据基础控件的属性信息，确定各个基础控件之间的层级关系，并根据各个基础控件之间的层级关系以及基础控件的属性信息，生成与目标图片对应的界面描述文件。

其中，本步骤中生成的与目标图片对应的界面描述文件具体为树形控件描述文件。

则在具体的实施过程中，首先根据基础控件的属性信息，确定各个基础控件之间的层级关系。具体地，根据基础控件的位置信息及尺寸信息，确定基础控件的控件区域，根据各个基础控件对应的控件区域之间的包含关系，确定各个基础控件之间的层级关系。即若第一基础控件的控件区域包含第二基础控件的控件区域，则将第一基础控件确定为第二基础控件的父层级。如图3所示，文本控件37对应的控件区域全部被非文本控件36所包含，则确定非文本控件36为文本控件37的父层级，文本控件37为非文本控件36的子层级。则通过本步骤可获得图3所示目标图片中的各个基础控件之间的层级关系(见图4)。如图4所示，第一层级包含有基础控件31；第二层级包含有基础控件31的子层级基础控件32；第三层级包含有基础控件32的子层级：基础控件33、基础控件33、基础控件34、基础控件35、基础控件36、及基础控件38；第四层级包含有基础控件35的子层级基础控件37。

其次，根据各个基础控件之间的层级关系以及基础控件的属性信息，生成与目标图片对应的树形控件描述文件。即以各个基础控件为各个树形节点，根据确定的各个基础控件之间的层级关系构建树形关系框架，并根据各个基础控件的属性信息，在构建的树形关系框架中各个树形节点添加相应的属性信息，从而生成与目标图片对应的树形控件描述文件。

步骤S230，将树形控件描述文件转换为预设布局的界面描述文件。

由于步骤S210中是通过图像识别的方式确定目标图片中包含的基础控件及基础控件的属性信息。则其获得的基础控件的属性信息的位置信息为绝对位置信息。所以，为适配不同机型及***，本步骤中进一步将树形控件描述文件转换为预设布局的界面描述文件。其中，预设布局可以为Flexbox布局。

步骤S240，接收并根据针对于生成的界面描述文件的更改操作，更改该界面描述文件。

为提高用户灵活性，使得最终生成的图形界面满足用户需求，本实施例中可为用户提供有界面描述文件的更改接口。用户可通过该接口实现对界面描述文件中各个基础控件的增加、删除、修改(如修改某个基础控件的位置或颜色等等)。在接收到针对于生成的界面描述文件的更改操作后，更改该界面描述文件。

步骤S250，在生成的界面描述文件中的各个基础控件中***对应的控件元素数据，更新界面描述文件。

为进一步地使得最终生成的图形界面满足用户需求，提升用户体验，本步骤中可根据用户操作在生成的界面描述文件中的各个基础控件中***对应的控件元素数据，并更新该界面描述文件。例如，若当前界面描述文件中仅记载有某一文本控件A的位置及尺寸信息，则本步骤中可在界面描述文件中的文本控件A对应的位置***相应的文本内容数据。

例如，以下代码为图3所示的目标图片通过本实施例转换的界面描述文件中的部分描述信息，其中，该描述信息记载有基础控件36及基础控件37件之间的层级关系、位置信息、颜色信息、文本内容信息和/或图片内容信息等。

在此，本领域技术人员应当理解的是，本实施例中的界面描述文件并不限于以下代码所示的表现形式，本发明对界面描述文件的具体描述语言及文件类别等不做限定，例如，界面描述文件可以为json格式等。

步骤S260，存储界面描述文件，并生成与界面描述文件对应的访问标识，接收预设终端通过所述访问标识触发的访问请求，并将界面描述文件发送至该预设终端。

在生成界面描述文件之后，可将生成的界面描述文件进行存储，并生成与界面描述文件一一对应的访问标识。其中，访问标识可以为***、二维码、或条形码等形式呈现。进一步地，预设终端可通过该访问标识发送访问请求，在接收到预设终端通过访问标识触发的访问请求之后，将该界面描述文件发送至该预设终端。

以访问标识为二维码为例，当接收到预设终端针对于与界面描述文件对应的二维码的扫描操作时，将该界面描述文件发送至该预设终端。

步骤S270，解析界面描述文件，获得与界面描述文件对应的解析结果，并根据该解析结果生成与目标图片对应的图形界面。

具体地，由预设终端对获取到的界面描述文件进行解析从而获得相应的解析结果，根据该解析结果确定图像界面各个控件的位置等信息，进而生成与目标图片对应的图形界面。

步骤S280，呈现生成的图形界面。

具体地，在生成与目标图片对应的图形界面之后，可将该图形界面***预设界面中的预设位置，或者，将该界面以独立界面形式呈现。

由此可见，本实施例中将图形界面简化为一个或多个基础控件，由此来简化图形界面生成逻辑，提升图形界面的生成效率；并通过图像识别的方式快速且自动化地确定与图形界面相关的目标图片中所包含的基础控件及基础控件的属性信息，并进一步根据基础控件的属性信息，确定各个基础控件的层级关系，根据该层级关系及基础控件的属性信息生成对应的树形控件描述文件；并且，为适配不同的***及机型，本实施例中还进一步地将树形控件描述文件转换为预设布局的描述文件；另外，为提升界面生成的灵活度，还可根据用户操作对生成的界面描述文件进行更改，或者***对应的控件元素数据，从而使得最终生成的图形界面满足用户需求。总之，本方案可将将任意类型的图片自动生成相应的图形界面，图形界面的生成效率高，人工成本低，并且，图像界面的生成过程简单易行，适于大规模应用。

图5示出了根据本发明一个实施例提供的图形界面的生成装置的功能结构示意图。如图5所示，该装置包括：确定模块51、获取模块52、文件生成模块、解析模块54、以及界面生成模块55。

其中，确定模块51，适于对图形界面相关的目标图片进行图像识别，确定目标图片中包含的基础控件；

获取模块52，适于获取所述基础控件的属性信息；

文件生成模块53，适于根据所述基础控件的属性信息，生成与所述目标图片对应的界面描述文件；

解析模块54，适于解析所述界面描述文件，获得与所述界面描述文件对应的解析结果；

界面生成模块55，适于根据所述解析结果生成与所述目标图片对应的图形界面。

可选的，文件生成模块53进一步适于：根据所述基础控件的属性信息，确定各个基础控件之间的层级关系；根据各个基础控件之间的层级关系以及所述基础控件的属性信息，生成与目标图片对应的界面描述文件。

可选的，所述界面描述文件为树形控件描述文件。

可选的，所述属性信息包括位置信息及尺寸信息；

则文件生成模块53进一步适于：根据所述基础控件的位置信息及尺寸信息，确定各个基础控件之间的层级关系。

可选的，文件生成模块53进一步适于：根据所述基础控件的位置信息及尺寸信息，确定所述基础控件的控件区域；根据各个基础控件对应的控件区域之间的包含关系，确定各个基础控件之间的层级关系。

可选的，所述属性信息还包括：颜色信息、文本内容信息、和/或非文本内容信息。

可选的，文件生成模块53进一步适于：根据所述基础控件的属性信息，生成与所述目标图片对应的树形控件描述文件；将所述树形控件描述文件转换为预设布局的界面描述文件。

可选的，所述预设布局为Flexbox布局。

可选的，该装置还包括：更改模块(图中未示出)，适于接收并根据针对于生成的界面描述文件的更改操作，更改所述界面描述文件。

可选的，该装置还包括：***模块(图中未示出)，适于在生成的界面描述文件中的各个基础控件中***对应的控件元素数据，并更新界面描述文件。

可选的，该装置还包括：存储模块(图中未示出)，适于存储所述界面描述文件；

标识生成模块(图中未示出)，适于并生成与所述界面描述文件对应的访问标识。

可选的，所述访问标识以二维码形式呈现；

则该装置还包括：接收模块(图中未示出)，适于接收并根据预设终端针对于与所述界面描述文件对应的二维码的扫描操作；

发送模块(图中未示出)，适于将所述界面描述文件发送至所述预设终端；

则所述解析模块54及所述界面生成模块55设置于所述预设终端。

可选的，该装置还包括：呈现模块(图中未示出)，适于呈现所述图形界面。

可选的，呈现模块进一步适于：将所述图形界面***预设界面中的预设位置；或者，将所述界面以独立界面形式呈现。

可选的，所述基础控件包括文本控件和/或非文本控件。

其中，本实施例提供的图形界面的生成装置中各个模块的具体功能可参照图1或图2所示方法实施例中相应步骤的阐述，本实施例在此不做赘述。

由此可见，本装置可将任意类型的图片自动生成相应的图形界面，图形界面的生成效率高，人工成本低，并且，图像界面的生成过程简单易行，适于大规模应用。

根据本发明一个实施例提供了一种非易失性计算机存储介质，所述计算机存储介质存储有至少一可执行指令，该计算机可执行指令可执行上述任意方法实施例中的图形界面的生成方法。

图6示出了根据本发明一个实施例提供的一种计算设备的结构示意图，本发明具体实施例并不对计算设备的具体实现做限定。

如图6所示，该计算设备可以包括：处理器(processor)602、通信接口(Communications Interface)604、存储器(memory)606、以及通信总线608。

其中：

处理器602、通信接口604、以及存储器606通过通信总线608完成相互间的通信。

通信接口604，用于与其它设备比如客户端或其它服务器等的网元通信。

处理器602，用于执行程序610，具体可以执行上述图形界面的生成方法实施例中的相关步骤。

具体地，程序610可以包括程序代码，该程序代码包括计算机操作指令。

处理器602可能是中央处理器CPU，或者是特定集成电路ASIC(ApplicationSpecific Integrated Circuit)，或者是被配置成实施本发明实施例的一个或多个集成电路。计算设备包括的一个或多个处理器，可以是同一类型的处理器，如一个或多个CPU；也可以是不同类型的处理器，如一个或多个CPU以及一个或多个ASIC。

存储器606，用于存放程序610。存储器606可能包含高速RAM存储器，也可能还包括非易失性存储器(non-volatile memory)，例如至少一个磁盘存储器。

程序610具体可以用于使得处理器602执行以下操作：

对与所述图形界面相关的目标图片进行图像识别，确定所述目标图片中包含的基础控件，并获取所述基础控件的属性信息；

根据所述基础控件的属性信息，生成与所述目标图片对应的界面描述文件；

解析所述界面描述文件，获得与所述界面描述文件对应的解析结果；

根据所述解析结果生成与所述目标图片对应的图形界面。

在一种可选的实施方式中，程序610具体可以用于使得处理器602执行以下操作：

根据所述基础控件的属性信息，确定各个基础控件之间的层级关系；

根据各个基础控件之间的层级关系以及所述基础控件的属性信息，生成与目标图片对应的界面描述文件。

在一种可选的实施方式中，所述界面描述文件为树形控件描述文件。

在一种可选的实施方式中，所述属性信息包括位置信息及尺寸信息；

程序610具体可以用于使得处理器602执行以下操作：

根据所述基础控件的位置信息及尺寸信息，确定各个基础控件之间的层级关系。

在一种可选的实施方式中，程序610具体可以用于使得处理器602执行以下操作：

根据所述基础控件的位置信息及尺寸信息，确定所述基础控件的控件区域；

根据各个基础控件对应的控件区域之间的包含关系，确定各个基础控件之间的层级关系。

在一种可选的实施方式中，所述属性信息还包括：颜色信息、文本内容信息、和/或非文本内容信息。

在一种可选的实施方式中，程序610具体可以用于使得处理器602执行以下操作：

根据所述基础控件的属性信息，生成与所述目标图片对应的树形控件描述文件；

将所述树形控件描述文件转换为预设布局的界面描述文件。

在一种可选的实施方式中，所述预设布局为Flexbox布局。

在一种可选的实施方式中，程序610具体可以用于使得处理器602执行以下操作：

接收并根据针对于生成的界面描述文件的更改操作，更改所述界面描述文件。

在一种可选的实施方式中，程序610具体可以用于使得处理器602执行以下操作：

在生成的界面描述文件中的各个基础控件中***对应的控件元素数据，更新界面描述文件。

在一种可选的实施方式中，程序610具体可以用于使得处理器602执行以下操作：

存储所述界面描述文件，并生成与所述界面描述文件对应的访问标识。

在一种可选的实施方式中，所述访问标识以二维码形式呈现；

则程序610具体可以用于使得处理器602执行以下操作：

接收并根据预设终端针对于与所述界面描述文件对应的二维码的扫描操作，将所述界面描述文件发送至所述预设终端；

则所述解析所述界面描述文件，获得与所述界面描述文件对应的解析结果，根据所述解析结果生成与所述目标图片对应的图形界面由所述预设终端执行。

在一种可选的实施方式中，程序610具体可以用于使得处理器602执行以下操作：呈现所述图形界面。

在一种可选的实施方式中，程序610具体可以用于使得处理器602执行以下操作：

将所述图形界面***预设界面中的预设位置；

或者，将所述界面以独立界面形式呈现。

在一种可选的实施方式中，所述基础控件包括文本控件和/或非文本控件。

在此提供的算法和显示不与任何特定计算机、虚拟***或者其它设备固有相关。各种通用***也可以与基于在此的示教一起使用。根据上面的描述，构造这类***所要求的结构是显而易见的。此外，本发明也不针对任何特定编程语言。应当明白，可以利用各种编程语言实现在此描述的本发明的内容，并且上面对特定语言所做的描述是为了披露本发明的最佳实施方式。

在此处所提供的说明书中，说明了大量具体细节。然而，能够理解，本发明的实施例可以在没有这些具体细节的情况下实践。在一些实例中，并未详细示出公知的方法、结构和技术，以便不模糊对本说明书的理解。

类似地，应当理解，为了精简本公开并帮助理解各个发明方面中的一个或多个，在上面对本发明的示例性实施例的描述中，本发明的各个特征有时被一起分组到单个实施例、图、或者对其的描述中。然而，并不应将该公开的方法解释成反映如下意图：即所要求保护的本发明要求比在每个权利要求中所明确记载的特征更多的特征。更确切地说，如下面的权利要求书所反映的那样，发明方面在于少于前面公开的单个实施例的所有特征。因此，遵循具体实施方式的权利要求书由此明确地并入该具体实施方式，其中每个权利要求本身都作为本发明的单独实施例。

本领域那些技术人员可以理解，可以对实施例中的设备中的模块进行自适应性地改变并且把它们设置在与该实施例不同的一个或多个设备中。可以把实施例中的模块或单元或组件组合成一个模块或单元或组件，以及此外可以把它们分成多个子模块或子单元或子组件。除了这样的特征和/或过程或者单元中的至少一些是相互排斥之外，可以采用任何组合对本说明书(包括伴随的权利要求、摘要和附图)中公开的所有特征以及如此公开的任何方法或者设备的所有过程或单元进行组合。除非另外明确陈述，本说明书(包括伴随的权利要求、摘要和附图)中公开的每个特征可以由提供相同、等同或相似目的的替代特征来代替。

此外，本领域的技术人员能够理解，尽管在此所述的一些实施例包括其它实施例中所包括的某些特征而不是其它特征，但是不同实施例的特征的组合意味着处于本发明的范围之内并且形成不同的实施例。例如，在权利要求书中，所要求保护的实施例的任意之一都可以以任意的组合方式来使用。

本发明的各个部件实施例可以以硬件实现，或者以在一个或者多个处理器上运行的软件模块实现，或者以它们的组合实现。本领域的技术人员应当理解，可以在实践中使用微处理器或者数字信号处理器(DSP)来实现根据图形界面的生成装置中的一些或者全部部件的一些或者全部功能。本发明还可以实现为用于执行这里所描述的方法的一部分或者全部的设备或者装置程序(例如，计算机程序和计算机程序产品)。这样的实现本发明的程序可以存储在计算机可读介质上，或者可以具有一个或者多个信号的形式。这样的信号可以从因特网网站上下载得到，或者在载体信号上提供，或者以任何其他形式提供。

应该注意的是上述实施例对本发明进行说明而不是对本发明进行限制，并且本领域技术人员在不脱离所附权利要求的范围的情况下可设计出替换实施例。在权利要求中，不应将位于括号之间的任何参考符号构造成对权利要求的限制。单词“包含”不排除存在未列在权利要求中的元件或步骤。位于元件之前的单词“一”或“一个”不排除存在多个这样的元件。本发明可以借助于包括有若干不同元件的硬件以及借助于适当编程的计算机来实现。在列举了若干装置的单元权利要求中，这些装置中的若干个可以是通过同一个硬件项来具体体现。单词第一、第二、以及第三等的使用不表示任何顺序。可将这些单词解释为名称。

Claims (10)

1.一种图形界面的生成方法，包括：

对与所述图形界面相关的目标图片进行图像识别，确定所述目标图片中包含的基础控件，并获取所述基础控件的属性信息；

根据所述基础控件的属性信息，生成与所述目标图片对应的界面描述文件；

解析所述界面描述文件，获得与所述界面描述文件对应的解析结果；

根据所述解析结果生成与所述目标图片对应的图形界面。

2.根据权利要求1所述的方法，其中，所述根据所述基础控件的属性信息，生成与目标图片对应的界面描述文件进一步包括：

根据所述基础控件的属性信息，确定各个基础控件之间的层级关系；

根据各个基础控件之间的层级关系以及所述基础控件的属性信息，生成与目标图片对应的界面描述文件。

3.根据权利要求2所述的方法，其中，所述界面描述文件为树形控件描述文件。

4.根据权利要求3所述的方法，其中，所述属性信息包括位置信息及尺寸信息；

则所述根据所述基础控件的属性信息，确定各个基础控件之间的层级关系进一步包括：

根据所述基础控件的位置信息及尺寸信息，确定各个基础控件之间的层级关系。

5.根据权利要求4所述的方法，其中，所述根据所述基础控件的位置信息及尺寸信息，确定各个基础控件之间的层级关系进一步包括：

根据所述基础控件的位置信息及尺寸信息，确定所述基础控件的控件区域；

根据各个基础控件对应的控件区域之间的包含关系，确定各个基础控件之间的层级关系。

6.根据权利要求5所述的方法，其中，所述属性信息还包括：颜色信息、文本内容信息、和/或非文本内容信息。

7.根据权利要求3-6中任一项所述的方法，其中，所述根据所述基础控件的属性信息，生成与所述目标图片对应的界面描述文件进一步包括：

根据所述基础控件的属性信息，生成与所述目标图片对应的树形控件描述文件；

将所述树形控件描述文件转换为预设布局的界面描述文件。

8.一种图形界面的生成装置，包括：

确定模块，对所述图形界面相关的目标图片进行图像识别，确定所述目标图片中包含的基础控件；

获取模块，适于获取所述基础控件的属性信息；

文件生成模块，适于根据所述基础控件的属性信息，生成与所述目标图片对应的界面描述文件；

解析模块，适于解析所述界面描述文件，获得与所述界面描述文件对应的解析结果；

界面生成模块，适于根据所述解析结果生成与所述目标图片对应的图形界面。

9.一种计算设备，包括：处理器、存储器、通信接口和通信总线，所述处理器、所述存储器和所述通信接口通过所述通信总线完成相互间的通信；

所述存储器用于存放至少一可执行指令，所述可执行指令使所述处理器执行如权利要求1-7中任一项所述的图形界面的生成方法对应的操作。

10.一种计算机存储介质，所述存储介质中存储有至少一可执行指令，所述可执行指令使处理器执行如权利要求1-7中任一项所述的图形界面的生成方法对应的操作。