CN112035188A - 控件生成方法、装置、网络设备及存储介质 - Google Patents

Abstract

本发明实施方式涉及通信技术领域，公开了一种控件生成方法，包括：获取目标控件的配置信息；根据所述配置信息调用底层Canvas接口生成所述目标控件。本发明实施方式还公开了一种控件生成装置、网络设备及存储介质。本发明实施方式提供的控件生成方法、装置、网络设备及存储介质，可以提高生成控件的效率。

Description

控件生成方法、装置、网络设备及存储介质

技术领域

本发明涉及通信技术领域，特别涉及一种控件生成方法、装置、网络设备及存储介质。

背景技术

微信小程序(Wechat Mini Program)为小程序的一种，是一种不需要下载安装即可使用的应用，用户通过扫一扫或搜一下即可打开微信小程序。

微信小程序的页面一般通过生成各种控件来实现，现有微信小程序在生成控件的方法主要通过微信原生的元素(wxml、wxss、json、javascript)以及封装以上元素的框架来实现，其中，wxml用于定义页面的模板(即页面能显示哪些控件)，wxss用于定义控件的样式(即控件如何显示)，json用于定义页面的配置和数据源(即控件需要用到哪些内容)，javascript用于控制界面的显示，处理数据和业务流程。

然而，发明人发现相关技术至少存在以下技术问题：通过微信原生的元素及封装框架来生成控件，必须事先定义好wxml(页面模板)、wxss(页面样式)、json(页面配置)和JavaScript(页面处理逻辑)，生成控件的效率较低。

发明内容

本发明实施方式的目的在于提供一种控件生成方法、装置、网络设备及存储介质，可以提高生成控件的效率。

为解决上述技术问题，本发明的实施方式提供了一种控件生成方法，包括：获取目标控件的配置信息；根据配置信息调用底层Canvas接口生成目标控件。

本发明的实施方式还提供了一种控件生成装置，包括：获取模块，用于获取目标控件的配置信息；生成模块，用于根据配置信息调用底层Canvas接口生成目标控件。

本发明的实施方式还提供了一种网络设备，包括：至少一个处理器；以及，与至少一个处理器通信连接的存储器；其中，存储器存储有可被至少一个处理器执行的指令，指令被至少一个处理器执行，以使至少一个处理器能够执行上述的控件生成方法。

本发明的实施方式还提供了一种计算机可读存储介质，存储有计算机程序，计算机程序被处理器执行时实现上述的控件生成方法。

本发明实施方式相对于相关技术而言，通过获取目标控件的配置信息，根据配置信息调用底层Canvas接口生成目标控件，不需要事先定义页面模板和页面样式等，不会生成临时文件，可以直接生成控件，提高了控件的生成效率；同时，通过设置目标控件的配置信息，可以生成不同样式的控件，从而满足频繁变化的页面样式的需求。

另外，根据配置信息调用底层Canvas接口生成目标控件，包括：根据配置信息在前端页面加入埋桩标记；根据配置信息生成视图；将视图显示在埋桩标记上，得到目标控件。

另外，将视图显示在埋桩标记上，包括：获取前端页面的页面大小和前端页面所在系统的系统类型；根据页面大小和系统类型采用自适应算法将视图显示在埋桩标记上。根据页面大小和系统类型采用自适应算法将视图显示在埋桩标记上，可以适应不同的系统类型和不同的屏幕类型，提高页面的显示效果。

另外，在将视图显示在埋桩标记上之后，还包括：获取在埋桩标记上输入的移除指令；根据移除指令移除目标控件。根据移除指令来移除目标控件，可以使前端页面根据需要设置页面的控件，达到页面动态显示的效果，提高对前端页面显示的控件的管理效率。

另外，控件生成方法还包括：当配置信息更新时，获取更新后的配置信息；根据更新后的配置信息调用底层Canvas接口生成新的控件。通过在配置信息更新时，根据更新后的配置信息调用底层Canvas接口生成新的控件，可以实现控件的快速更新或切换，提高控件更新和切换的效率。

另外，获取目标控件的配置信息，具体为：在时间触发器被触发时获取目标控件的配置信息。通过在时间触发器被触发时获取目标控件的配置信息，可以实现控件的定时切换和动态生成。

另外，配置信息包括目标控件的显示位置、显示内容、显示形状、显示大小、显示颜色中的至少一个。

附图说明

一个或多个实施例通过与之对应的附图中的图片进行示例性说明，这些示例性说明并不构成对实施例的限定。

图1是本发明第一实施方式提供的控件生成方法的流程示意图；

图2是本发明第一实施方式提供的控件生成方法中S102细化步骤的流程示意图；

图3是现有技术中通过微信原生元素及封装框架生成控件的示例图；

图4是现有技术中通过H5和webview来生成控件的示例图；

图5是通过本发明第一实施方式提供的控件生成方法生成控件的示例图；

图6是本发明第二实施方式提供的控件生成方法的流程示意图；

图7是本发明第三实施方式提供的控件生成装置的模块结构示意图；

图8是本发明第四实施方式提供的网络设备的结构示意图。

具体实施方式

为使本发明的目的、技术方案和优点更加清楚，下面将结合附图对本发明的各实施方式进行详细的阐述。然而，本领域的普通技术人员可以理解，在本发明各实施方式中，为了使读者更好地理解本申请而提出了许多技术细节。但是，即使没有这些技术细节和基于以下各实施方式的种种变化和修改，也可以实现本申请所要求保护的技术方案。

本发明的第一实施方式涉及一种控件生成方法，通过获取目标控件的配置信息，根据配置信息调用底层Canvas接口生成目标控件，不需要事先定义好页面模板和页面样式等，可以直接生成控件，提高了控件的生成效率。

应当说明的是，本发明实施方式提供的控件生成方法的执行主体可以为生成目标控件的终端，例如是手机、平板电脑等，也可以为与显示目标控件的终端相连接的服务端，其中，服务端可以由单独的服务器或多个服务器组成的集群来实现。以下以终端为例进行具体说明。

本发明实施方式提供的控件生成方法的具体流程如图1所示，具体包括以下步骤：

S101：获取目标控件的配置信息。

其中，目标控件可以为若干个，可选地，目标控件为非交互控件。目标控件的配置信息是指如何配置控件在前端页面进行显示的信息。

在一个具体的例子中，目标控件的配置信息可包括目标控件的显示位置、显示内容、显示形状、显示大小、显示颜色中的至少一个。其中，显示位置是指在前端页面显示的位置，例如在前端页面左上角的位置；显示内容是指控件中显示的文字等内容；显示形状是指控件显示的具体形状，例如以椭圆形显示控件；显示大小是指控件显示形状的大小；显示颜色是指控件显示的颜色，例如是蓝色进行显示。可选地，显示颜色还可以包括前端页面的显示颜色。当然，目标控件的配置信息还可以包括其它信息，例如显示大小的单位等，此处不做具体限制。

可选地，目标控件的配置信息可通过配置文件来实现，实际应用中，配置文件可由用户根据不同业务、不同场景等实际需要进行配置，终端通过获取配置文件，再对配置文件进行解析后获取目标控件的配置信息。

在一个具体的例子中，获取目标控件的配置信息，具体为：在时间触发器被触发时获取目标控件的配置信息。

其中，时间触发器可以根据需要设置一个指定的时间，当到达指定的时间时，时间触发器触发，此时终端获取目标控件的配置信息，并继续执行S102生成目标控件，从而使前端页面在指定的时间显示相应的控件，可以实现控件的定时切换和动态生成。

例如，在目标控件生成前，前端页面显示另一控件，在时间触发器被触发后，终端获取目标控件的配置信息以生成目标控件，可以实现前端页面中控件的定时切换。

S102：根据配置信息调用底层Canvas接口生成目标控件。

其中，底层Canvas接口为终端系统底层的Canvas接口，可以根据配置信息绘制相应的本地视图，以显示在前端页面上，从而得到目标控件。

在一个具体的例子中，根据配置信息调用底层Canvas接口生成目标控件，如图2所示，具体可以包括以下步骤：

S1021：根据配置信息在前端页面加入埋桩标记。

S1022：根据配置信息生成视图。

S1023：将视图显示在埋桩标记上，得到目标控件。

对于S1021-S1023，详细说明如下：

其中，前端页面是指在前端用于显示目标控件的页面。埋桩标记是在前端页面指定需要显示目标控件的位置，埋桩标记可根据目标控件的配置信息中的信息确定并加入到前端页面中，例如根据配置信息中的显示位置、显示形状和显示大小等信息确定后在前端页面加入。埋桩标记具体标记的形式可根据实际需要进行设置，此处不做具体限定。

可选地，根据配置信息生成视图，将视图显示在埋桩标记的具体过程可以是：1、通过目标控件的配置信息对应格式的页面绘制页面元素，其中，绘制的页面元素是指配置信息里具体包括的内容；2、将目标控件的配置信息加载到本地，解析成前端页面能识别的本地对象的数据格式；3、将解析得到的本地对象传入前端，前端根据本地对象调用系统底层Canvas接口，将各个页面元素等绘制在指定的位置，绘制为配置信息中的显示颜色、显示形状、显示大小等，以生成本地视图；4、将生成的本地视图以图片的形式插入到页面上的埋桩标记上显示出来。其中，在第2步中，在将配置信息解析成本地对象时，是通过预先设置的处理引擎将配置信息解析为本地对象；在第3步中，前端根据本地对象调用系统底层Canvas接口绘制本地视图时，是通过预先设置的绘图引擎来实现的。

在一个具体的例子中，将视图显示在埋桩标记上，可以包括：获取前端页面的页面大小和前端页面所在系统的系统类型，根据页面大小和系统类型采用自适应算法将视图显示在埋桩标记上。

其中，前端页面所在系统的系统类型可包括安卓系统和IOS系统。可以理解的是，当前端页面的页面大小和前端页面所在系统的系统类型不同时，最终显示在前端页面的视图也会有差异，因此，根据页面大小和系统类型采用自适应算法将视图显示在埋桩标记上，可以适应不同的系统类型和不同的屏幕类型，提高页面的显示效果。

在实际应用中，还可以根据前端页面的页面格式作动态分析，在动态分析的基础上动态使能或禁止显示页面元素。

在一个具体的例子中，在将视图显示在埋桩标记上之后，本发明实施方式提供的控件生成方法还包括：获取在埋桩标记上输入的移除指令，根据移除指令移除目标控件。

其中，移除指令可通过修改目标控件的配置信息来生成，也可以在前端页面上进行输入。当接收到移除指令时，终端根据移除指令移除目标控件，从而使前端页面根据需要设置页面的控件，达到页面动态显示的效果，提高对前端页面显示的控件的管理效率。

为了更清楚地说明本发明实施方式提供的控件生成方法，下面以在微信小程序中生成控件的场景为例进行对比说明，其中，具体的场景为在微信小程序中显示头像、昵称、家庭地址、工作地址、积分等控件。

请参考图3，其为现有技术中通过微信原生的元素及封装框架来生成控件的示例图。具体地，首先需要在后台定义头像、昵称、家庭地址、工作地址、积分等信息，即定义页面的模板；并定义头像显示的圆形、头像的大小和位置，昵称显示在头像的左边、到头像的距离、昵称的长度，家庭地址、工作地址的字体大小、长度、位置，积分的位置、颜色、大小等信息，即定义页面的样式；再定义加载头像、昵称、家庭地址、工作地址、积分信息的位置；还需要定义其它配置信息和依赖项，然后通过Javascript访问后台接口得到动态数据填充预先定义好的页面。这种技术方案由于必须定义好页面模板、页面样式、页面配置和页面处理逻辑后才能生成控件，因此生成控件的效率较低；并且，生成的页面只有后台配置的数据是动态的，而页面样式是静态的，展示为固定样式，头像、昵称、家庭地址、工作地址、积分等信息的形状、位置、颜色都是固定的，无法满足频繁变化的页面样式需求。

请参考图4，其为现有技术中通过H5和webview来生成控件的示例图，过程可以是：通过webview在前端页面进行占位，然后加载H5页面来生成控件。这种技术方案虽然可以利用H5页面本身的多样化来解决前一技术方案中的样式固定的问题，但是由于微信小程序对H5有许多限制，例如是H5链接数据、H5域名权限、修改次数等，使得这种技术方案存在较大的局限性。

此外，还有一种方案是将类似JSON格式的数据传入前端，前端根据JSON生成wxml和wxss，进而动态显示定义的界面，但是，由于该种方案需要根据配置信息生成wxml和wxss，本质上还是依靠微信原生的元素wxml和wxss，当数据量较大时，由于格式上会存在不兼容的情况，因此可能会产生较大的效率损失，也较容易出错。

请参考图5，其为本发明实施方式提供的控件生成方法生成控件的示例图。具体地，在后台配置为头像大小、形状、位置、资源等信息，昵称大小、形状、位置、文本等信息，工作地址大小、形状、位置、文本等信息，不同时刻、不同场景配置信息，然后通过前端的处理引擎将这些配置信息解析成本地对象，再通过绘制引擎调用底层Canvas接口将本地对象绘制为视图，显示在预先设置的埋桩标记上，根据不同时刻、不同场景配置信息得到不同的页面样式(页面样式1和页面样式2)。由于不依赖微信小程序原生的元素及封装框架，可以直接生成控件，因此控件生成的效率较快；由于是调用底层Canvas接口直接生成控件，因此也不会存在不兼容的问题；并且，通过不同时刻、不同场景等配置信息可以设置不同的页面样式，从而满足频繁变化的页面样式的需求；另外，由于页面定义发生在后台，可自由配置，而页面解析发生在前台，可自由生成不同的页面对象，因此可以提高页面显示元素的灵活性和可变性；在设计界面时，能根据用户需求修改页面结构，并实现组件之间的复用。

与相关技术相比，本发明实施方式提供的控件生成方法，通过获取目标控件的配置信息，根据配置信息调用底层Canvas接口生成目标控件，不需要事先定义页面模板和页面样式等，不会生成临时文件，可以直接生成控件，提高了控件的生成效率；同时，通过设置目标控件的配置信息，可以生成不同样式的控件，从而满足频繁变化的页面样式的需求。

本发明的第二实施方式涉及一种控件生成方法。第二实施方式与第一实施方式大致相同，主要区别之处在于：在本发明实施方式中，还包括：当配置信息更新时，获取更新后的配置信息；根据更新后的配置信息调用底层Canvas接口生成新的控件。

本发明实施方式提供的控件生成方法的具体流程如图6所示，具体包括以下步骤：

S201：获取目标控件的配置信息。

S202：根据配置信息调用底层Canvas接口生成目标控件。

S203：当配置信息更新时，获取更新后的配置信息。

S204：根据更新后的配置信息调用底层Canvas接口生成新的控件。

其中，S201-S202与第一实施方式中的S101-S102相同，具体请参见第一实施方式中的相关描述，为了减少重复，这里不再赘述。

对于S203-S204，详细说明如下：

终端可对配置信息进行监控，若配置信息发生更新，则获取更新后的配置信息，再根据更新后的配置信息调用底层Canvas接口生成新的控件，其中，新的控件可以是指更新后的目标控件，也可以是指与目标控件完全不同的新控件。

可选地，配置信息的更新可以是在原有配置信息中进行修改来更新，也可以是通过新的配置文件替换原来的配置文件来更新，具体可以根据实际需要进行设置，此处不做具体限制。

与相关技术相比，本发明实施方式提供的控件生成方法，通过在配置信息更新时，根据更新后的配置信息调用底层Canvas接口生成新的控件，可以实现控件的快速更新或切换，提高控件更新和切换的效率。

上面各种方法的步骤划分，只是为了描述清楚，实现时可以合并为一个步骤或者对某些步骤进行拆分，分解为多个步骤，只要包含相同的逻辑关系，都在本专利的保护范围内；对算法中或者流程中添加无关紧要的修改或者引入无关紧要的设计，但不改变其算法和流程的核心设计都在该专利的保护范围内。

本发明第三实施方式涉及一种控件生成装置300，如图7所示，包括获取模块301和生成模块302。各模块功能详细说明如下：

获取模块301，用于获取目标控件的配置信息；

生成模块302，用于根据配置信息调用底层Canvas接口生成目标控件。

进一步地，生成模块302具体用于：

根据配置信息在前端页面加入埋桩标记；

根据配置信息生成视图；

将视图显示在埋桩标记上，得到目标控件。

进一步地，生成模块302还用于：

获取前端页面的页面大小和前端页面所在系统的系统类型；

根据页面大小和系统类型采用自适应算法将视图显示在埋桩标记上。

进一步地，本发明实施方式提供的控件生成装置300还包括移除模块，其中，移除模块用于：

获取在埋桩标记上输入的移除指令；

根据移除指令移除目标控件。

进一步地，本发明实施方式提供的控件生成装置300还包括更新模块，其中，更新模块用于：

当配置信息更新时，获取更新后的配置信息；

根据更新后的配置信息调用底层Canvas接口生成新的控件。

进一步地，获取模块301具体用于：

在时间触发器被触发时获取目标控件的配置信息。

进一步地，配置信息包括目标控件的显示位置、显示内容、显示形状、显示大小、显示颜色中的至少一个。

不难发现，本实施方式为与第一、第二实施方式相对应的装置实施例，本实施方式可与第一、第二实施方式互相配合实施。第一、第二实施方式中提到的相关技术细节在本实施方式中依然有效，为了减少重复，这里不再赘述。相应地，本实施方式中提到的相关技术细节也可应用在第一、第二实施方式中。

值得一提的是，本实施方式中所涉及到的各模块均为逻辑模块，在实际应用中，一个逻辑单元可以是一个物理单元，也可以是一个物理单元的一部分，还可以以多个物理单元的组合实现。此外，为了突出本发明的创新部分，本实施方式中并没有将与解决本发明所提出的技术问题关系不太密切的单元引入，但这并不表明本实施方式中不存在其它的单元。

本发明第四实施方式涉及一种网络设备，如图8所示，包括至少一个处理器401；以及，与至少一个处理器401通信连接的存储器402；其中，存储器402存储有可被至少一个处理器401执行的指令，指令被至少一个处理器401执行，以使至少一个处理器401能够执行上述的控件生成方法。

其中，存储器402和处理器401采用总线方式连接，总线可以包括任意数量的互联的总线和桥，总线将一个或多个处理器401和存储器402的各种电路连接在一起。总线还可以将诸如外围设备、稳压器和功率管理电路等之类的各种其他电路连接在一起，这些都是本领域所公知的，因此，本文不再对其进行进一步描述。总线接口在总线和收发机之间提供接口。收发机可以是一个元件，也可以是多个元件，比如多个接收器和发送器，提供用于在传输介质上与各种其他装置通信的单元。经处理器401处理的数据通过天线在无线介质上进行传输，进一步，天线还接收数据并将数据传送给处理器401。

处理器401负责管理总线和通常的处理，还可以提供各种功能，包括定时，外围接口，电压调节、电源管理以及其他控制功能。而存储器402可以被用于存储处理器401在执行操作时所使用的数据。

本发明第五实施方式涉及一种计算机可读存储介质，存储有计算机程序。计算机程序被处理器执行时实现上述方法实施例。

即，本领域技术人员可以理解实现上述实施例方法中的全部或部分步骤是可以通过程序来指令相关的硬件来完成，该程序存储在一个存储介质中，包括若干指令用以使得一个设备(可以是单片机，芯片等)或处理器(processor)执行本申请各个实施例所述方法的全部或部分步骤。而前述的存储介质包括：U盘、移动硬盘、只读存储器(ROM，Read-OnlyMemory)、随机存取存储器(RAM，Random Access Memory)、磁碟或者光盘等各种可以存储程序代码的介质。

本领域的普通技术人员可以理解，上述各实施方式是实现本发明的具体实施例，而在实际应用中，可以在形式上和细节上对其作各种改变，而不偏离本发明的精神和范围。

Claims (10)

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

获取目标控件的配置信息；

根据所述配置信息调用底层Canvas接口生成所述目标控件。

2.根据权利要求1所述的控件生成方法，其特征在于，所述根据所述配置信息调用底层Canvas接口生成所述目标控件，包括：

根据所述配置信息在前端页面加入埋桩标记；

根据所述配置信息生成视图；

将所述视图显示在所述埋桩标记上，得到所述目标控件。

3.根据权利要求2所述的控件生成方法，其特征在于，所述将所述视图显示在所述埋桩标记上，包括：

获取所述前端页面的页面大小和所述前端页面所在系统的系统类型；

根据所述页面大小和所述系统类型采用自适应算法将所述视图显示在所述埋桩标记上。

4.根据权利要求2所述的控件生成方法，其特征在于，在所述将所述视图显示在所述埋桩标记上之后，还包括：

获取在所述埋桩标记上输入的移除指令；

根据所述移除指令移除所述目标控件。

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

当所述配置信息更新时，获取更新后的配置信息；

根据所述更新后的配置信息调用底层Canvas接口生成新的控件。

6.根据权利要求1所述的控件生成方法，其特征在于，所述获取目标控件的配置信息，具体为：

在时间触发器被触发时获取目标控件的配置信息。

7.根据权利要求1-6任一项所述的控件生成方法，其特征在于，所述配置信息包括所述目标控件的显示位置、显示内容、显示形状、显示大小、显示颜色中的至少一个。

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

获取模块，用于获取目标控件的配置信息；

生成模块，用于根据所述配置信息调用底层Canvas接口生成所述目标控件。

9.一种网络设备，其特征在于，包括：

至少一个处理器；以及，

与所述至少一个处理器通信连接的存储器；其中，

所述存储器存储有可被所述至少一个处理器执行的指令，所述指令被所述至少一个处理器执行，以使所述至少一个处理器能够执行如权利要求1至7中任一项所述的控件生成方法。

10.一种计算机可读存储介质，存储有计算机程序，其特征在于，所述计算机程序被处理器执行时实现如权利要求1至7中任一项所述的控件生成方法。

Images