CN114415892A - 界面控件生成方法、装置、可读介质及电子设备 - Google Patents

Abstract

本申请属于界面设计技术领域，具体涉及一种界面控件生成方法、装置、可读介质及电子设备。本申请通过获取控件创建请求；基于所述控件创建请求，建立视图对象文件，所述视图对象文件包括文本控件、图形控件和位置信息，根据所述位置信息构建所述文本控件和图形控件的路径信息；为所述文本控件、图形控件和路径信息添加响应内容，生成样式文件；最后将所述样式文件加载在界面上，生成界面控件。通过本申请的方法，可以扩展界面控件的样式信息和触发方式，实现用户绘制路径信息时触发响应内容，扩展了界面控件的触发方式，实现了界面控件的多样性，满足用户对界面控件的设计和使用需求。

Description

界面控件生成方法、装置、可读介质及电子设备

技术领域

本申请属于界面设计技术领域，具体涉及一种界面控件生成方法、装置、可读介质及电子设备。

背景技术

界面控件指可在窗体上放置的可视化图形“元件”，如按钮、文件编辑框等。其中大多数是具有执行功能或通过“事件”引发代码运行并完成响应的功能。

随着计算机技术的不断发展，对于界面控件的使用也日益频繁。然而，现有界面控件的样式和触发方式过于单一，其中样式上仅支持纯文本，左边图片右侧文本，以及纯图片的样式，而触发方式上仅支持点击，双击等。无法满足人们对界面控件的使用需求。

需要说明的是，在上述背景技术部分公开的信息仅用于加强对本申请的背景的理解，因此可以包括不构成对本领域普通技术人员已知的现有技术的信息。

发明内容

本申请的目的在于提供一种界面控件生成方法、装置、计算机可读介质以及电子设备，至少在一定程度上克服相关技术中界面控件的样式和触发方式过于单一等技术问题。

本申请的其他特性和优点将通过下面的详细描述变得显然，或部分地通过本申请的实践而习得。

根据本申请实施例的一个方面，提供一种界面控件生成方法，包括：

获取控件创建请求；

基于所述控件创建请求，建立视图对象文件，所述视图对象文件包括文本控件、图形控件和位置信息，所述位置信息用于表示所述文本控件和所述图形控件的相对位置；

根据所述位置信息构建所述文本控件和图形控件的路径信息；

为所述文本控件、图形控件和路径信息添加响应内容，生成样式文件；

将所述样式文件加载在界面上，生成界面控件。

在本申请的一些实施例中，基于以上技术方案，在获取控件创建请求之前，所述方法包括：

在界面上创建一级选项，所述一级选项包括文本选项，图形选项和位置选项；

在所述文本选项下创建文本二级选项，所述文本二级选项包括文本的样式信息；在所述图形选项下创建图形二级选项，所述图形二级选项包括图形的样式信息；在所述位置选项下创建位置二级选项，所述位置二级选项包括所述控件中文本与图形的相对位置。

在本申请的一些实施例中，基于以上技术方案，获取控件创建请求，包括：

获取用户的选项信息，所述用户的选项信息包括用户在界面上选择的文本二级选项、图形二级选项和位置二级选项。

在本申请的一些实施例中，基于以上技术方案，在基于所述控件创建请求，建立视图对象文件之前，所述方法还包括：

建立标签对，并建立所述标签对与所述文本二级选项的映射关系，通过所述文本二级选项的点击调出所述标签对；

建立字符对，并建立所述字符对与所述图形二级选项的映射关系，通过所述图形二级选项的点击调出所述字符对；

建立相对坐标值，并建立所述相对坐标值与所述位置二级选项的映射关系，通过所述位置二级选项的点击调出所述相对坐标值。

在本申请的一些实施例中，基于以上技术方案，基于所述控件创建请求，建立视图对象文件，包括：

根据所述控件创建请求获得用户的选项信息；

基于所述选项信息获取标签对，字符对和相对坐标值；

利用所述标签对，字符对和相对坐标值组合建立所述视图对象文件。

在本申请的一些实施例中，基于以上技术方案，根据所述位置信息构建所述文本控件和图形控件的路径信息，包括：

获取与路径对应的路径线段；

以所述文本控件为起点，以所述图形控件为终点，绘制所述路径线段，得到路径信息。

在本申请的一些实施例中，基于以上技术方案，获取与路径对应的路径线段，包括：

获取用户自定义的路径线段或预设的路径线段。

根据本申请实施例的一个方面，提供一种界面控件生成装置，包括：

获取模块，用于获取控件创建请求；

建立模块，用于基于所述控件创建请求，建立视图对象文件，所述视图对象文件包括文本控件、图形控件和位置信息，所述位置信息用于表示所述文本控件和所述图形控件的相对位置；

构建模块，用于为根据所述位置信息构建所述文本控件和图形控件的路径信息；

样式生成模块，用于为所述文本控件、图形控件和路径信息添加响应内容，生成样式文件；

控件生成模块，用于将所述样式文件加载在界面上，生成界面控件。

在本申请的一些实施例中，基于以上技术方案，所述装置还包括选项创建模块，所述选项创建模块包括：

一级选项创建单元：用于在界面上创建一级选项，所述一级选项包括文本选项，图形选项和位置选项；

二级选项创建单元：用于在所述文本选项下创建文本二级选项，所述文本二级选项包括文本的样式信息；在所述图形选项下创建图形二级选项，所述图形二级选项包括图形的样式信息；在所述位置选项下创建位置二级选项，所述位置二级选项包括所述控件中文本与图形的相对位置。

在本申请的一些实施例中，基于以上技术方案，所述获取模块还用于获取用户的选项信息，所述用户的选项信息包括用户在界面上选择的文本二级选项、图形二级选项和位置二级选项。

在本申请的一些实施例中，基于以上技术方案，所述装置还包括映射建立模块，所述映射建立模块包括：

标签对建立单元，用于建立标签对，并建立所述标签对与所述文本二级选项的映射关系，通过所述文本二级选项的点击调出所述标签对；

字符对建立单元，用于建立字符对，并建立所述字符对与所述图形二级选项的映射关系，通过所述图形二级选项的点击调出所述字符对；

相对坐标建立单元，用于建立相对坐标值，并建立所述相对坐标值与所述位置二级选项的映射关系，通过所述位置二级选项的点击调出所述相对坐标值。

在本申请的一些实施例中，基于以上技术方案，所述建立模块包括：

选项获取单元，用于根据所述控件创建请求获得用户的选项信息；

映射获取单元，用于基于所述选项信息获取标签对，字符对和相对坐标值；

建立单元，用于利用所述标签对，字符对和相对坐标值组合建立所述视图对象文件。

在本申请的一些实施例中，基于以上技术方案，所述构建模块包括：

线段获取单元，用于获取与路径对应的路径线段；

绘制单元，用于以所述文本控件为起点，以所述图形控件为终点，绘制所述路径线段，得到路径信息。

在本申请的一些实施例中，基于以上技术方案，所述线段获取单元用于获取用户自定义的路径线段或预设的路径线段。

根据本申请实施例的一个方面，提供一种计算机可读介质，其上存储有计算机程序，该计算机程序被处理器执行时实现如以上技术方案中的界面控件生成方法。

根据本申请实施例的一个方面，提供一种电子设备，该电子设备包括：处理器；以及存储器，用于存储所述处理器的可执行指令；其中，所述处理器被配置为经由执行所述可执行指令来执行如以上技术方案中的界面控件生成方法。

根据本申请实施例的一个方面，提供一种计算机程序产品或计算机程序，该计算机程序产品或计算机程序包括计算机指令，该计算机指令存储在计算机可读存储介质中。计算机设备的处理器从计算机可读存储介质读取该计算机指令，处理器执行该计算机指令，使得该计算机设备执行如以上技术方案中的界面控件生成方法。

在本申请实施例提供的技术方案中，本申请通过获取控件创建请求；基于所述控件创建请求，建立视图对象文件，所述视图对象文件包括文本控件、图形控件和位置信息，根据所述位置信息构建所述文本控件和图形控件的路径信息；为所述文本控件、图形控件和路径信息添加响应内容，生成样式文件；最后将所述样式文件加载在界面上，生成界面控件。通过本申请的方法，可以利用文本控件、图形控件和位置信息来组成控件，扩展界面控件的样式信息，避免样式过于单一；利用位置信息构建所述文本控件和图形控件的路径信息，并为该路径信息添加响应内容，可以扩展界面控件的触发方式，实现用户绘制路径信息触发不同的响应内容，扩展了界面控件的触发方式，实现了界面控件的多样性，满足用户对界面控件的设计和使用需求。

应当理解的是，以上的一般描述和后文的细节描述仅是示例性和解释性的，并不能限制本申请。

附图说明

此处的附图被并入说明书中并构成本说明书的一部分，示出了符合本申请的实施例，并与说明书一起用于解释本申请的原理。显而易见地，下面描述中的附图仅仅是本申请的一些实施例，对于本领域普通技术人员来讲，在不付出创造性劳动的前提下，还可以根据这些附图获得其他的附图。

图1示意性地示出了应用本申请技术方案的示例性系统架构框图。

图2示意性地示出了本申请界面控件生成方法的流程图。

图3示意性的示出了本申请创建选项的方法流程图。

图4示意性的示出了本申请二级选项建立映射的方法流程图。

图5示意性的示出了本申请视图对象文件的建立方法流程图。

图6示意性的示出了本申请路径信息的构建方法流程图。

图7示意性的示出了本申请生成的界面控件示意图。

图8示意性的示出了本申请界面控件生成装置的结构框图。

图9示意性示出了适于用来实现本申请实施例的电子设备的计算机系统结构框图。

具体实施方式

现在将参考附图更全面地描述示例实施方式。然而，示例实施方式能够以多种形式实施，且不应被理解为限于在此阐述的范例；相反，提供这些实施方式使得本申请将更加全面和完整，并将示例实施方式的构思全面地传达给本领域的技术人员。

此外，所描述的特征、结构或特性可以以任何合适的方式结合在一个或更多实施例中。在下面的描述中，提供许多具体细节从而给出对本申请的实施例的充分理解。然而，本领域技术人员将意识到，可以实践本申请的技术方案而没有特定细节中的一个或更多，或者可以采用其它的方法、组元、装置、步骤等。在其它情况下，不详细示出或描述公知方法、装置、实现或者操作以避免模糊本申请的各方面。

附图中所示的方框图仅仅是功能实体，不一定必须与物理上独立的实体相对应。即，可以采用软件形式来实现这些功能实体，或在一个或多个硬件模块或集成电路中实现这些功能实体，或在不同网络和/或处理器装置和/或微控制器装置中实现这些功能实体。

附图中所示的流程图仅是示例性说明，不是必须包括所有的内容和操作/步骤，也不是必须按所描述的顺序执行。例如，有的操作/步骤还可以分解，而有的操作/步骤可以合并或部分合并，因此实际执行的顺序有可能根据实际情况改变。

界面控件指可在窗体上放置的可视化图形“元件”，如按钮、文件编辑框等。用户可以通过界面控件来点击，基于点击可以触发响应出内容。随着网络应用的不断增多，对于界面控件的使用也日益频繁。然而，现有的界面控件的样式和触发方式都过于单一。在样式上，现有的界面控件仅支持纯文本，或纯图形，或左边图片右侧文本的样式，无法满足用户对控件样式的要求。在触发方式上，现有的界面控件仅支持点击，双击等。无法满足用户对触发方式的要求。

为了解决以上的技术问题，本申请公开了一种界面控件生成方法、界面控件生成装置、计算机可读介质以及电子设备，下面将通过各个方面进一步说明本申请的内容。

图1示意性地示出了应用本申请技术方案的示例性系统架构框图。

如图1所示，系统架构100可以包括终端设备110、网络120和服务器130。终端设备110可以包括智能手机、平板电脑、笔记本电脑、台式电脑等各种电子设备。服务器130可以是独立的物理服务器，也可以是多个物理服务器构成的服务器集群或者分布式系统，还可以是提供云计算服务的云服务器。网络120可以是能够在终端设备110和服务器130之间提供通信链路的各种连接类型的通信介质，例如可以是有线通信链路或者无线通信链路。

根据实现需要，本申请实施例中的系统架构可以具有任意数目的终端设备、网络和服务器。例如，服务器130可以是由多个服务器设备组成的服务器群组。另外，本申请实施例提供的技术方案可以应用于终端设备110，也可以应用于服务器130，或者可以由终端设备110和服务器130共同实施，本申请对此不做特殊限定。

在本申请的一个实施例中，本申请的终端设备110或服务器130可以获取控件创建请求；并基于控件创建请求，建立视图对象文件，其中，视图对象文件包括文本控件、图形控件和位置信息，位置信息用于表示文本控件和图形控件的相对位置；根据位置信息构建文本控件和图形控件的路径信息；为文本控件、图形控件和路径信息添加响应内容，生成样式文件；将样式文件加载在界面上，生成界面控件。利用终端设备110或服务器130执行本申请的界面控件生成方法，可以实现界面控件的多样性，满足用户对界面控件的设计和使用需求。

以上部分介绍了应用本申请技术方案的示例性系统架构的内容，接下来继续介绍本申请的界面控件生成方法。

根据本申请实施例的一个方面，如图2所示，图2示意性地示出了本申请界面控件生成方法的流程图。

本申请提供一种界面控件生成方法，包括步骤S210-步骤S250。

在步骤S210中：获取控件创建请求。

本申请的控件创建请求中包括了界面控件的文字样式、图形样式和文字与图形的位置关系。其中，文字样式包括了界面控件中文字的位置，内容，字体，粗细和颜色等；而图形样式包括了图形的类型，位置，形状，大小和颜色等，其中，图形的类型包括动态图。文字与图形的位置关系包括文字与图形的相对位移、在图像中插入文字和在文字中插入图像。

本申请的控件创建请求可以来自于用户，例如，一个用户想要斜体文字，以及静态图片，文字嵌入在图片中的界面控件。用户就可以通过终端设备110和服务器130来发出控件创建请求。

本申请的控件创建请求也可以来自其他服务器或终端设备。随着人工智能的发展，许多其他服务器或终端设备可以根据设定的方式自动生成界面控件，因此，对应的也会自动发出控件创建请求。

在本申请的一个实施例中，如图3所示，图3示意性的示出了本申请创建选项的方法流程图。

在获取控件创建请求之前，本申请还包括步骤S310-步骤S320。

步骤S310：在界面上创建一级选项，一级选项包括文本选项，图形选项和位置选项。

本申请可以在用户的界面上创建一级选项，其中，一级选项包括了文本选项，图形选项和位置选项。用户通过界面点击对应的选项就可以调整到各个选项中的具体内容。

步骤S320：在文本选项下创建文本二级选项，文本二级选项包括文本的样式信息；在图形选项下创建图形二级选项，图形二级选项包括图形的样式信息；在位置选项下创建位置二级选项，位置二级选项包括控件中文本与图形的相对位置。

二级选项是一级选项的下级选项，当通过一级选项进行点击后就可以跳转到各个二级选项，用户就可以再对各个二级选项进行选择。其中，本申请的文本二级选项包括文本的样式信息，文本的样式信息同步骤S110中的文字样式，都包括了界面控件中文字的位置，内容，字体，粗细和颜色等。图形的样式信息包括了图形的类型，位置，形状，大小和颜色等。文本与图形的相对位置包括文本与图形的相对位移、在图像中插入文字和在文字中插入图像。

其中，步骤S310-步骤S320的选项创建方法用于控件创建请求来自用户的情况。用户可以在界面上分别选择不同的选项信息，获取到界面控件的文本的样式信息、图形的样式信息和文本与图形的相对位置。例如，用户在界面上分别选择了文本选项下文本的样式信息为：文字的位置在界面控件的中心点，内容为字母A，字体为黑体，粗细为四号和颜色为黑色；图形的样式信息为：图形的类型为静态图，位置为界面控件的左侧，形状为圆形，大小为直径2cm，颜色为黑色；文本与图形的相对位置为文本位于图形左侧2cm。通过用户的以上选项信息，就可以生成一个与以上样式信息相对应的界面控件。

在本申请的一个实施例中，当控件创建请求来自用户时，获取控件创建请求的方法，包括：

获取用户的选项信息，用户的选项信息包括用户在界面上选择的文本二级选项、图形二级选项和位置二级选项。

本申请通过获取用户的选项信息就可以获取到关于界面控件的各方面样式的控件创建请求。通过以上方法可以简化用户对于界面控件的设计步骤，用户不用设计复杂的代码，只需要在界面上点击不同的选项即可完成界面控件的生成，提高了使用便利性。

当控件创建请求来自于其他服务器或终端设备时，可以直接获取其他服务器或终端设备发送的关于界面控件的各种样式信息，而无需用户点击选项进行输入。

通过以上步骤获取到控件创建请求，就可以继续进行步骤S220。

在步骤S220中：基于控件创建请求，建立视图对象文件，视图对象文件包括文本控件、图形控件和位置信息，位置信息用于表示文本控件和图形控件的相对位置。

在本申请的一个实施例中，在步骤S210之后及步骤S220之前，本申请还包括二级选项建立映射的步骤，如图4所示，图4示意性的示出了本申请二级选项建立映射的方法流程图。

本申请二级选项建立映射方法包括步骤S410-步骤S430。

S410：建立标签对，并建立标签对与文本二级选项的映射关系，通过文本二级选项的点击调出标签对。

标签对的作用是用于在视图对象文件中表现不同文本的样式信息，本申请在创建建立视图对象文件之前，需要先构建标签对与文本二级选项的映射关系。例如，标签对<b></b>可以表示文本加粗，标签对<v></v>可以表示文本为斜体，标签对<c>紧跟的第一个#开头的9位数，可以表示文本的颜色，例如，<c>#255,255,255表示的是白色，其中后面九个数可以是RGB的值。本申请还可以用其它标签对来表示文本的不同样式信息，其中，利用标签对的形式可以使得标签成对出现，避免单个标签导致所表示的样式信息不足，无法表示所有的文本标签。本申请建立了标签对与文本二级选项的映射关系，当用户点击文本二级选项时，对应的可以调出映射关系表中的标签对。例如，<c>#255,255,255与文本二级选项中颜色为白色对应映射形成映射表，当用户通过界面点击文本二级选项中的颜色为白色时，就会调出标签对<c>#255,255,255。

S420：建立字符对，并建立字符对与图形二级选项的映射关系，通过图形二级选项的点击调出字符对。

本申请的字符对与标签对含义相似，是用于在视图对象文件中表现不同图形的样式信息。其中，本申请的字符对由一些排除文本外的特殊的字符组成，例如“，。！)”等。举例来说，字符对为.<代表图形是静态图形，字符对为！！代表图形的形状是圆形。本申请建立了字符对与图形二级选项的映射关系，形成了图形映射关系表，当用户点击图形二级选项后，可以调出映射关系表中与所点击的图形二级选项对应的标签对。

S430：建立相对坐标值，并建立相对坐标值与位置二级选项的映射关系，通过位置二级选项的点击调出相对坐标值。

相对坐标值可以表示文本与图形的相对坐标，本申请的相对坐标值表示的是图形相对文本的相对坐标。例如，相对坐标值为(1,1)表示图形在文本的右侧一个单位距离，上侧一个单位距离，其中单位距离可以是厘米。在计算相对距离时，可以以图形和文本的中心点作为其计算基础。利用相对坐标值(0，0)可以表示文本与图形重叠，此时还可以加入一个坐标值来表示文本和图形的重叠关系，例如(0，0，1)可以表示图形嵌入在文本上，且图像在上，文本在下；(0，0，0)可以表示图形嵌入在文本上，且图像在下，文本在上。通过将相对坐标值与位置二级选项的建立映射关系，当获取到位置二级选项时，就可以调用对应的相对坐标值。例如，用户在二级选项中选择图形嵌入在文本上，且图像在上，文本在下，对应的相对坐标值为(0，0，1)。

通过步骤S410-步骤S430完成二级选项建立映射后，就可以基于控件创建请求，建立视图对象文件。

在本申请的一个实施例中，如图5所示，图5示意性的示出了本申请视图对象文件的建立方法流程图。本申请建立视图对象文件的方法包括步骤S510-步骤S530。

步骤S510：根据控件创建请求获得用户的选项信息。

其中，通过控件创建请求可以获得用户所选择的二级选项信息。

步骤S520：基于选项信息获取标签对，字符对和相对坐标值。

通过用户选择的二级选项信息，利用步骤S410-步骤S430建立的映射关系，就可以获取到与二级选项信息对应的标签对，字符对和相对坐标值。

步骤S530：利用标签对，字符对和相对坐标值组合建立视图对象文件。

其中，本申请的视图对象文件可以是终端设备110或服务器130预定义的一个文件，终端设备110或服务器130可以通过解析该文件获取到界面控件的样式信息，并且基于该样式信息来生成对应的界面控件。例如，视图对象文件可以是后缀为.s的文件。

本申请利用标签对，字符对和相对坐标值组合建立视图对象文件，组合的方式可以是将标签对，字符对和相对坐标值进行拼接。例如，对于一个标签对为<b></b>，字符对为.<.，坐标值为-1，-2，对应的视图对象文件就可以是【<b></b>.<.-1，-2】.s文件。

通过以上的方法可以建立一个视图对象文件。当控件创建请求来自于其他服务器或终端设备时，本申请可以直接利用服务器或终端设备来生成一个包括了界面控件文本样式信息，图形样式信息和文本与图形相对位置的视图对象文件。

建立视图对象文件，可以继续步骤S230。

在步骤S230中：根据位置信息构建文本控件和图形控件的路径信息。

路径信息是从文本控件到图形控件之间的路线，当一个界面控件即包括文本控件，又包括图形控件时，从文本控件到图形控件之间可以有很多路线，例如可以是直线或曲线等。这些都可以构成文本控件和图形控件的路径信息。

在本申请的一个实施例中，如图6所示，图6示意性的示出了本申请路径信息的构建方法流程图。

根据位置信息构建文本控件和图形控件的路径信息的方法，包括步骤S610-步骤S620。

步骤S610：获取与路径对应的路径线段。

在本申请的一个实施例中本申请的路径线段可以包括系统预设的路径线段，也可以包括用户自定义的路径线段。例如，用户可以手绘路径线段保存到服务器130或终端设备110中。

步骤S620：以文本控件为起点，以图形控件为终点，绘制路径线段，得到路径信息。

当获取到路径线段后，就可以以文本控件为起点，以图形控件为终点，绘制路径线段，得到路径信息。

其中，本申请的路径信息不仅包括直线线段，还可以包括曲线，折线等。

在步骤S240中：为文本控件、图形控件和路径信息添加响应内容，生成样式文件。

响应内容是基于对文本控件、图形控件和路径信息的点击或绘制所触发的内容。界面控件具有执行功能或通过“事件”引发代码运行并完成响应的功能。例如，对于文本控件，可以通过单击来跳转出该界面控件中触发内容中包含的文字信息，通过单击图形可以跳转出该界面控件触发内容中包含的图形信息，通过绘制路径信息可以跳转出对文档中的内容编辑信息。

本申请通过为文本控件、图形控件和路径信息添加响应内容后，会生成样式文件，其中，样式文件是可以被终端设备110或服务器130识别并展示出界面控件的文件，该文件后缀可以是.c，终端设备110或服务器130可以将该样式文件记载在界面上，其中，该样式文件中包括了样式信息和触发的响应内容信息。

在步骤S250中：将样式文件加载在界面上，生成界面控件。

生成样式文件后，终端设备110或服务器130可以将样式文件加载在界面上，生成界面控件。其中，所生成的界面控件的样式信息是步骤S220中的视图对象文件中的样式信息。响应内容是步骤S240中添加的内容。

如图7所示，图7示意性的示出了本申请生成的界面控件示意图。

随着界面控件使用的不断精简化，很多手机上使用的界面控件可以不用通过多层点击到达指定链接，而可以直接通过对控件的不同操作来完成，例如，通过单击界面控件是进入对应链接，双击界面控件可以是调出编辑指令。然而由于界面控件可以操作的空间有限，因此无法触发调整到更多的内容上。

参考图7，本申请的界面控件是关于一个网页的界面控件，在该网页中包含了二级的子菜单，例如文字，图形，视频等等，然后再往下还有具体的链接。

而本申请的界面控件包括了文本内容为A的文本控件710，其中该文本控件710的样式是，字体是楷体，颜色是黑色。界面控件还包括了图形为圆形的图形控件720，其中，图形控件720的样式信息是，图形的大小是直径为4cm，颜色为白色。而且该界面控件中，图形位于文字的正下方5cm。其中，本申请为文本控件710添加了响应内容，例如，单击时直接跳转到网页的文字子菜单中，用户可以直接选择要看的文字内容。双击时，可以跳转到文字子菜单中的具体文章链接。同样的，单击图形时，跳转到网页的图形子菜单中，用户可以直接选择要看的图片内容。双击时，可以跳转到图形子菜单中的具体图片链接中。当然，本申请还可以对文本控件710和图形控件720设置轻触时，长按时的对应响应内容。

其中，本申请的界面控件的空白区域740被点击时，对应的直接跳转到该网页的主页上。当本申请绘制路径信息730时，例如绘制文字控件到图形控件720的路径信息730时，可以跳转到视频对应的二级菜单上。而且，本申请可以根据不同的路径信息730进行不同的调整。例如，可以是直线调整到长视频，曲线调整到短视频。

因此，通过本申请生成的界面控件，可以实现样式和触发方式的多样性，可以设置不同的路径信息来响应不同的触发内容，用户在使用时，直接在界面上用手指绘制从文本控件710到图形控件720的直线或曲线或折线可以触发不同的内容。其中，用户在绘制时，当触碰文本控件710时，会点亮一个绘制起点，此时用户就可以直接进行路径信息的绘制。

在本申请的一个实施例中，在生成样式文件之后，所述方法还包括：

为所述样式文件设置代理文件，所述代理文件基于点击以实现响应。

代理文件设置的目的是为了避免将样式文件直接暴露，而保护样式文件，外界可以通过代理文件来进行界面控件的生成以及点击访问等操作。例如，用户获取到的界面控件对应的样式文件是代理文件，用户只能使用，而无法对该代理文件进行编辑等操作。以此来提高样式文件使用的安全性。

在本申请实施例提供的技术方案中，本申请通过获取控件创建请求；基于控件创建请求，建立视图对象文件，视图对象文件包括文本控件、图形控件和位置信息，根据位置信息构建文本控件和图形控件的路径信息；为文本控件、图形控件和路径信息添加响应内容，生成样式文件；最后将样式文件加载在界面上，生成界面控件。通过本申请的方法，可以利用文本控件、图形控件和位置信息来组成控件，扩展界面控件的样式信息，避免样式过于单一；利用位置信息构建文本控件和图形控件的路径信息，并为该路径信息添加响应内容，可以扩展界面控件的触发方式，实现用户绘制路径信息触发不同的响应内容，扩展了界面控件的触发方式，实现了界面控件的多样性，满足用户对界面控件的设计和使用需求。

应当注意，尽管在附图中以特定顺序描述了本申请中方法的各个步骤，但是，这并非要求或者暗示必须按照该特定顺序来执行这些步骤，或是必须执行全部所示的步骤才能实现期望的结果。附加的或备选的，可以省略某些步骤，将多个步骤合并为一个步骤执行，以及/或者将一个步骤分解为多个步骤执行等。

以上部分介绍了本申请界面控件生成方法的内容，接下来继续介绍本申请界面控件生成装置的内容。

根据本申请实施例的一个方面，提供一种界面控件生成装置800，图8示意性地示出了本申请实施例提供的界面控件生成装置的结构框图。如图8所示，该装置包括：

获取模块810，用于获取控件创建请求；

建立模块820，用于基于控件创建请求，建立视图对象文件，视图对象文件包括文本控件、图形控件和位置信息，位置信息用于表示文本控件和图形控件的相对位置；

构建模块830，用于为根据位置信息构建文本控件和图形控件的路径信息；

样式生成模块840，用于为文本控件、图形控件和路径信息添加响应内容，生成样式文件；

控件生成模块850，用于将样式文件加载在界面上，生成界面控件。

在本申请的一些实施例中，基于以上技术方案，装置还包括选项创建模块，选项创建模块包括：

一级选项创建单元：用于在界面上创建一级选项，一级选项包括文本选项，图形选项和位置选项；

二级选项创建单元：用于在文本选项下创建文本二级选项，文本二级选项包括文本的样式信息；在图形选项下创建图形二级选项，图形二级选项包括图形的样式信息；在位置选项下创建位置二级选项，位置二级选项包括控件中文本与图形的相对位置。

在本申请的一些实施例中，基于以上技术方案，获取模块810还用于获取用户的选项信息，用户的选项信息包括用户在界面上选择的文本二级选项、图形二级选项和位置二级选项。

在本申请的一些实施例中，基于以上技术方案，装置还包括映射建立模块，映射建立模块包括：

标签对建立单元，用于建立标签对，并建立标签对与文本二级选项的映射关系，通过文本二级选项的点击调出标签对；

字符对建立单元，用于建立字符对，并建立字符对与图形二级选项的映射关系，通过图形二级选项的点击调出字符对；

相对坐标建立单元，用于建立相对坐标值，并建立相对坐标值与位置二级选项的映射关系，通过位置二级选项的点击调出相对坐标值。

在本申请的一些实施例中，基于以上技术方案，建立模块820包括：

选项获取单元，用于根据控件创建请求获得用户的选项信息；

映射获取单元，用于基于选项信息获取标签对，字符对和相对坐标值；

建立单元，用于利用标签对，字符对和相对坐标值组合建立视图对象文件。

在本申请的一些实施例中，基于以上技术方案，构建模块830包括：

线段获取单元，用于获取与路径对应的路径线段；

绘制单元，用于以文本控件为起点，以图形控件为终点，绘制路径线段，得到路径信息。

在本申请的一些实施例中，基于以上技术方案，线段获取单元用于获取用户自定义的路径线段或预设的路径线段。

本申请各实施例中提供的界面控件生成装置的具体细节已经在对应的方法实施例中进行了详细的描述，此处不再赘述。

以上部分介绍了本申请界面控件生成装置的内容，接下来继续介绍本申请其它方面的内容。

根据本申请实施例的一个方面，提供一种计算机可读介质，其上存储有计算机程序，该计算机程序被处理器执行时实现如以上技术方案中的界面控件生成方法。

根据本申请实施例的一个方面，提供一种电子设备，该电子设备包括：处理器；以及存储器，用于存储处理器的可执行指令；其中，处理器被配置为经由执行可执行指令来执行如以上技术方案中的界面控件生成方法。

根据本申请实施例的一个方面，提供一种计算机程序产品或计算机程序，该计算机程序产品或计算机程序包括计算机指令，该计算机指令存储在计算机可读存储介质中。计算机设备的处理器从计算机可读存储介质读取该计算机指令，处理器执行该计算机指令，使得该计算机设备执行如以上技术方案中的界面控件生成方法。

图9示意性地示出了用于实现本申请实施例的电子设备的计算机系统结构框图。

需要说明的是，图9示出的电子设备的计算机系统900仅是一个示例，不应对本申请实施例的功能和使用范围带来任何限制。

如图9所示，计算机系统900包括中央处理器901(Central Processing Unit，CPU)，其可以根据存储在只读存储器902(Read-Only Memory，ROM)中的程序或者从存储部分908加载到随机访问存储器903(Random Access Memory，RAM)中的程序而执行各种适当的动作和处理。在随机访问存储器903中，还存储有系统操作所需的各种程序和数据。中央处理器901、在只读存储器902以及随机访问存储器903通过总线904彼此相连。输入/输出接口905(Input/Output接口，即I/O接口)也连接至总线904。

以下部件连接至输入/输出接口905：包括键盘、鼠标等的输入部分906；包括诸如阴极射线管(Cathode Ray Tube，CRT)、液晶显示器(Liquid Crystal Display，LCD)等以及扬声器等的输出部分907；包括硬盘等的存储部分908；以及包括诸如局域网卡、调制解调器等的网络接口卡的通信部分909。通信部分909经由诸如因特网的网络执行通信处理。驱动器910也根据需要连接至输入/输出接口905。可拆卸介质911，诸如磁盘、光盘、磁光盘、半导体存储器等等，根据需要安装在驱动器910上，以便于从其上读出的计算机程序根据需要被安装入存储部分908。

特别地，根据本申请的实施例，各个方法流程图中所描述的过程可以被实现为计算机软件程序。例如，本申请的实施例包括一种计算机程序产品，其包括承载在计算机可读介质上的计算机程序，该计算机程序包含用于执行流程图所示的方法的程序代码。在这样的实施例中，该计算机程序可以通过通信部分909从网络上被下载和安装，和/或从可拆卸介质911被安装。在该计算机程序被中央处理器901执行时，执行本申请的系统中限定的各种功能。

需要说明的是，本申请实施例所示的计算机可读介质可以是计算机可读信号介质或者计算机可读存储介质或者是上述两者的任意组合。计算机可读存储介质例如可以是——但不限于——电、磁、光、电磁、红外线、或半导体的系统、装置或器件，或者任意以上的组合。计算机可读存储介质的更具体的例子可以包括但不限于：具有一个或多个导线的电连接、便携式计算机磁盘、硬盘、随机访问存储器(RAM)、只读存储器(ROM)、可擦式可编程只读存储器(Erasable Programmable Read Only Memory，EPROM)、闪存、光纤、便携式紧凑磁盘只读存储器(Compact Disc Read-Only Memory，CD-ROM)、光存储器件、磁存储器件、或者上述的任意合适的组合。在本申请中，计算机可读存储介质可以是任何包含或存储程序的有形介质，该程序可以被指令执行系统、装置或者器件使用或者与其结合使用。而在本申请中，计算机可读信号介质可以包括在基带中或者作为载波一部分传播的数据信号，其中承载了计算机可读的程序代码。这种传播的数据信号可以采用多种形式，包括但不限于电磁信号、光信号或上述的任意合适的组合。计算机可读信号介质还可以是计算机可读存储介质以外的任何计算机可读介质，该计算机可读介质可以发送、传播或者传输用于由指令执行系统、装置或者器件使用或者与其结合使用的程序。计算机可读介质上包含的程序代码可以用任何适当的介质传输，包括但不限于：无线、有线等等，或者上述的任意合适的组合。

附图中的流程图和框图，图示了按照本申请各种实施例的系统、方法和计算机程序产品的可能实现的体系架构、功能和操作。在这点上，流程图或框图中的每个方框可以代表一个模块、程序段、或代码的一部分，上述模块、程序段、或代码的一部分包含一个或多个用于实现规定的逻辑功能的可执行指令。也应当注意，在有些作为替换的实现中，方框中所标注的功能也可以以不同于附图中所标注的顺序发生。例如，两个接连地表示的方框实际上可以基本并行地执行，它们有时也可以按相反的顺序执行，这依所涉及的功能而定。也要注意的是，框图或流程图中的每个方框、以及框图或流程图中的方框的组合，可以用执行规定的功能或操作的专用的基于硬件的系统来实现，或者可以用专用硬件与计算机指令的组合来实现。

应当注意，尽管在上文详细描述中提及了用于动作执行的设备的若干模块或者单元，但是这种划分并非强制性的。实际上，根据本申请的实施方式，上文描述的两个或更多模块或者单元的特征和功能可以在一个模块或者单元中具体化。反之，上文描述的一个模块或者单元的特征和功能可以进一步划分为由多个模块或者单元来具体化。

通过以上的实施方式的描述，本领域的技术人员易于理解，这里描述的示例实施方式可以通过软件实现，也可以通过软件结合必要的硬件的方式来实现。因此，根据本申请实施方式的技术方案可以以软件产品的形式体现出来，该软件产品可以存储在一个非易失性存储介质(可以是CD-ROM，U盘，移动硬盘等)中或网络上，包括若干指令以使得一台计算设备(可以是个人计算机、服务器、触控终端、或者网络设备等)执行根据本申请实施方式的方法。

本领域技术人员在考虑说明书及实践这里公开的发明后，将容易想到本申请的其它实施方案。本申请旨在涵盖本申请的任何变型、用途或者适应性变化，这些变型、用途或者适应性变化遵循本申请的一般性原理并包括本申请未公开的本技术领域中的公知常识或惯用技术手段。

应当理解的是，本申请并不局限于上面已经描述并在附图中示出的精确结构，并且可以在不脱离其范围进行各种修改和改变。本申请的范围仅由所附的权利要求来限制。

Claims (10)

1.一种界面控件生成方法，其特征在于，包括：

获取控件创建请求；

基于所述控件创建请求，建立视图对象文件，所述视图对象文件包括文本控件、图形控件和位置信息，所述位置信息用于表示所述文本控件和所述图形控件的相对位置；

根据所述位置信息构建所述文本控件和图形控件的路径信息；

为所述文本控件、图形控件和路径信息添加响应内容，生成样式文件；

将所述样式文件加载在界面上，生成界面控件。

2.根据权利要求1所述的界面控件生成方法，其特征在于，在获取控件创建请求之前，所述方法包括：

在界面上创建一级选项，所述一级选项包括文本选项，图形选项和位置选项；

在所述文本选项下创建文本二级选项，所述文本二级选项包括文本的样式信息；在所述图形选项下创建图形二级选项，所述图形二级选项包括图形的样式信息；在所述位置选项下创建位置二级选项，所述位置二级选项包括所述控件中文本与图形的相对位置。

3.根据权利要求2所述的界面控件生成方法，其特征在于，获取控件创建请求，包括：

获取用户的选项信息，所述用户的选项信息包括用户在界面上选择的文本二级选项、图形二级选项和位置二级选项。

4.根据权利要求2所述的界面控件生成方法，其特征在于，在基于所述控件创建请求，建立视图对象文件之前，所述方法还包括：

建立标签对，并建立所述标签对与所述文本二级选项的映射关系，通过所述文本二级选项的点击调出所述标签对；

建立字符对，并建立所述字符对与所述图形二级选项的映射关系，通过所述图形二级选项的点击调出所述字符对；

建立相对坐标值，并建立所述相对坐标值与所述位置二级选项的映射关系，通过所述位置二级选项的点击调出所述相对坐标值。

5.根据权利要求4所述的界面控件生成方法，其特征在于，基于所述控件创建请求，建立视图对象文件，包括：

根据所述控件创建请求获得用户的选项信息；

基于所述选项信息获取标签对，字符对和相对坐标值；

利用所述标签对，字符对和相对坐标值组合建立所述视图对象文件。

6.根据权利要求1所述的界面控件生成方法，其特征在于，根据所述位置信息构建所述文本控件和图形控件的路径信息，包括：

获取与路径对应的路径线段；

以所述文本控件为起点，以所述图形控件为终点，绘制所述路径线段，得到路径信息。

7.根据权利要求6所述的界面控件生成方法，其特征在于，获取与路径对应的路径线段，包括：

获取用户自定义的路径线段或预设的路径线段。

8.一种界面控件生成装置，其特征在于，包括：

获取模块，用于获取控件创建请求；

建立模块，用于基于所述控件创建请求，建立视图对象文件，所述视图对象文件包括文本控件、图形控件和位置信息，所述位置信息用于表示所述文本控件和所述图形控件的相对位置；

构建模块，用于为根据所述位置信息构建所述文本控件和图形控件的路径信息；

样式生成模块，用于为所述文本控件、图形控件和路径信息添加响应内容，生成样式文件；

控件生成模块，用于将所述样式文件加载在界面上，生成界面控件。

9.一种计算机可读介质，其上存储有计算机程序，该计算机程序被处理器执行时实现权利要求1至7中任意一项所述的界面控件生成方法。

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

处理器；以及

存储器，用于存储所述处理器的可执行指令；

其中，所述处理器配置为经由执行所述可执行指令来执行权利要求1至7中任意一项所述的界面控件生成方法。

Images