CN107329654A - 绘制元素浮层的方法、装置以及计算机可读存储介质 - Google Patents

Abstract

本发明提供了一种绘制元素浮层的方法、装置以及计算机可读存储介质，涉及图像处理领域，该方法包括：客户端调用底层功能模块接口的接口函数；将所述接口函数与目标视频元素的ID进行绑定；获取所述元素浮层的显示信息；基于所述显示信息，以使上层功能模块调用绘制函数，在所述目标视频元素中绘制所述元素浮层。运用该方法，可以使得直播软件的底层功能模块具有重用性以及低耦合性。

Description

绘制元素浮层的方法、装置以及计算机可读存储介质

技术领域

本发明涉及图像处理领域，具体而言，涉及一种绘制元素浮层的方法、装置以及计算机可读存储介质。

背景技术

随着国内直播平台的日益火爆，每个直播平台都有自己的直播软件。传统的直播软件中诸如获取桌面，添加文字，添加摄像头等绘制自定义浮层的功能，都是通过直播软件的底层功能模块向上层提供的服务。可是，如果将这些绘制浮层的功能做到底层功能模块中，会耦合平台相关的业务，降低底层功能模块的易用性，增加耦合性。

然而随着直播业务的加深，新的直播软件功能需求被不断的提出。对于一款优秀的软件，如何做到将与平台相关的业务逻辑从底层功能模块中分离，使得直播软件底层功能模块具有易用性，低耦合性是一个比较大的考验。

发明内容

有鉴于此，本发明实施例的目的在于提供一种绘制元素浮层的方法、装置以及计算机可读存储介质，可以使得直播软件的底层功能模块具有重用性以及低耦合性。

第一方面，本发明实施例提供了一种绘制元素浮层的方法，所述方法包括：客户端调用底层功能模块接口的接口函数；将所述接口函数与目标视频元素的ID进行绑定；获取所述元素浮层的显示信息；基于所述显示信息，调用绘制函数，在所述目标视频元素中绘制所述元素浮层。

第二方面，本发明实施例提供了一种绘制元素浮层的装置，所述装置包括：调用模块、绑定模块、获取模块以及绘制模块。调用模块，用于调用底层功能模块接口的接口函数；绑定模块，用于将所述接口函数与目标视频元素的ID进行绑定；获取模块，用于获取所述元素浮层的显示信息；绘制模块，用于基于所述显示信息，调用绘制函数，在所述目标视频元素中绘制所述元素浮层。

第三方面，本发明实施例提供了一种计算机可读存储介质，所述可读存储介质存储有处理器可执行的程序代码，所述程序代码被配置成使所述处理器执行上述任一实施例所述方法。

与现有技术相比，本发明各实施例提出的绘制自定义元素浮层的方法以及装置的有益效果是：客户端通过调用底层功能模块接口的接口函数，将接口函数与需要绘制元素浮层的目标视频元素的ID绑定，并通过获取元素浮层的显示信息，以使上层功能模块调用绘制函数，在目标视频元素中绘制元素浮层，使得底层功能模块不涉及具体的业务逻辑，保证了底层功能模块的低耦合性以及可重用性。

为使本发明的上述目的、特征和优点能更明显易懂，下文特举较佳实施例，并配合所附附图，作详细说明如下。

附图说明

为了更清楚地说明本发明实施例的技术方案，下面将对实施例中所需要使用的附图作简单地介绍，应当理解，以下附图仅示出了本发明的某些实施例，因此不应被看作是对范围的限定，对于本领域普通技术人员来讲，在不付出创造性劳动的前提下，还可以根据这些附图获得其他相关的附图。

图1为本发明实施例提供的用户终端的结构框图；

图2为本发明第一实施例提供的一种绘制元素浮层的方法的流程图；

图3为本发明第二实施例提供的一种绘制元素浮层的方法的流程图；

图4为本发明第三实施例提供的一种绘制元素浮层的装置的结构框图；

图5为本发明第四实施例提供的一种绘制元素浮层的装置的结构框图。

具体实施方式

下面将结合本发明实施例中附图，对本发明实施例中的技术方案进行清楚、完整地描述，显然，所描述的实施例仅仅是本发明一部分实施例，而不是全部的实施例。通常在此处附图中描述和示出的本发明实施例的组件可以以各种不同的配置来布置和设计。因此，以下对在附图中提供的本发明的实施例的详细描述并非旨在限制要求保护的本发明的范围，而是仅仅表示本发明的选定实施例。基于本发明的实施例，本领域技术人员在没有做出创造性劳动的前提下所获得的所有其他实施例，都属于本发明保护的范围。

应注意到：相似的标号和字母在下面的附图中表示类似项，因此，一旦某一项在一个附图中被定义，则在随后的附图中不需要对其进行进一步定义和解释。同时，在本发明的描述中，术语“第一”、“第二”等仅用于区分描述，而不能理解为指示或暗示相对重要性。

如图1所示，是用户终端100的结构框图，所述用户终端100可以是个人电脑(personal computer，PC)、平板电脑、智能手机、个人数字助理(personal digitalassistant，PDA)等。所述用户终端100可以包括：绘制元素浮层的装置、存储器110、存储控制器120、处理器130、外设接口140、输入输出单元150、音频单元160、显示单元170。

所述存储器110、存储控制器120、处理器130、外设接口140、输入输出单元150、音频单元160以及显示单元170各元件相互之间直接或间接地电性连接，以实现数据的传输或交互。例如，这些元件相互之间可通过一条或多条通讯总线或信号线实现电性连接。所述绘制元素浮层的装置包括至少一个可以软件或固件(firmware)的形式存储于所述存储器110中或固化在客户端设备的操作系统(operating system，OS)中的软件功能模块。所述处理器130用于执行存储器110中存储的可执行模块，例如所述绘制元素浮层的装置包括的软件功能模块或计算机程序。

其中，存储器110可以是，但不限于，随机存取存储器(Random Access Memory，RAM)，只读存储器(Read Only Memory，ROM)，可编程只读存储器(Programmable Read-OnlyMemory，PROM)，可擦除只读存储器(Erasable Programmable Read-Only Memory，EPROM)，电可擦除只读存储器(Electric Erasable Programmable Read-Only Memory，EEPROM)等。其中，存储器110用于存储程序，所述处理器130在接收到执行指令后，执行所述程序，前述本发明实施例任一实施例揭示的流程定义的用户终端100所执行的方法可以应用于处理器130中，或者由处理器130实现。

处理器130可能是一种集成电路芯片，具有信号的处理能力。上述的处理器130可以是通用处理器，包括中央处理器(Central Processing Unit，简称CPU)、网络处理器(Network Processor，简称NP)等；还可以是数字信号处理器(DSP)、专用集成电路(ASIC)、现成可编程门阵列(FPGA)或者其他可编程逻辑器件、分立门或者晶体管逻辑器件、分立硬件组件。可以实现或者执行本发明实施例中的公开的各方法、步骤及逻辑框图。通用处理器可以是微处理器或者该处理器也可以是任何常规的处理器等。

所述外设接口140将各种输入/输出装置耦合至处理器130以及存储器110。在一些实施例中，外设接口140，处理器130以及存储控制器120可以在单个芯片中实现。在其他一些实例中，他们可以分别由独立的芯片实现。

输入输出单元150用于提供给用户输入数据实现用户与用户终端100的交互。所述输入输出单元150可以是，但不限于，鼠标和键盘等。

音频单元160向用户提供音频接口，其可包括一个或多个麦克风、一个或者多个扬声器以及音频电路。

显示单元170在用户终端100与用户之间提供一个交互界面(例如用户操作界面)或用于显示图像数据给用户参考。在本实施例中，所述显示单元170可以是液晶显示器或触控显示器。若为触控显示器，其可为支持单点和多点触控操作的电容式触控屏或电阻式触控屏等。支持单点和多点触控操作是指触控显示器能感应到来自该触控显示器上一个或多个位置处同时产生的触控操作，并将该感应到的触控操作交由处理器130进行计算和处理。

第一实施例

请参照图2，图2是本发明第一实施例提供的一种绘制元素浮层的方法的流程图，所述方法应用于客户端。所述客户端可以是安装在用户终端上的软件(例如直播软件)、第三方应用程序(Application，APP)或者用户终端本身。所述元素浮层，是将一张图像贴在现有图像的上面或者下面。

下面将对图2所示的流程进行详细阐述，所述方法包括：

步骤S110：客户端调用底层功能模块接口的接口函数。

所述底层功能模块可以是LiveEncoder模块，该底层功能模块可以提供一个ICaptureListener接口在现有的元素图像上绘制自定义图层。

ICaptureListener接口一般有两种接口函数，其中一个接口函数为上层贴图函数OnBeforDrawCapture，另一个接口函数为下层贴图函数OnAfterDrawCapture。其中，OnBeforDrawCapture函数在绘制视频源元素之前被调用，因为此时视频源元素的图像还没有绘制，当该函数完成后，才绘制视频源元素，所以该函数中可以实现在视频源元素图像的下面绘制浮层。OnAfterDrawCapture函数在绘制视频源元素之后被调用，因为此时视频源元素的图像已经被绘制，当在该函数中进行图像绘制时，所绘制出的图像将在视频源元素的上层显示。于本实施例中，所述接口函数为上层贴图函数OnBeforDrawCapture或者为下层贴图函数OnAfterDrawCapture。

由于ICaptureListener接口是一个抽象类，因此，需要客户端的上层功能模块继承该类，并通过调用接口函数实现接口函数的作用。

步骤S120：将所述接口函数与目标视频元素的ID进行绑定。

由于需要通过ICaptureListener接口的接口函数通知上层功能模块需要在该接口函数中完成视频元素的浮层贴图(在视频元素的下面贴图还是在视频元素的上面贴图)，因此，需要将所述接口函数与目标视频元素的ID进行绑定。其中，目标视频元素表征需要被绘制元素浮层的视频元素。例如，需要在目标视频元素的上面进行贴图，则将所述目标视频元素的ID写入上层贴图函数OnBeforDrawCapture的传入参数，使得ICaptureListener接口与目标视频元素进行绑定。

值得指出的是，为了防止底层功能模块使用的DirectX绘制方式与上层功能模块中使用的GDI(Graphic Device Interface)绘制方式出现不兼容的情况，于本实施例中，ICaptureListener接口的接口函数一般不会进行浮层的绘制，浮层的绘制工作一般是通过LiveEncoder模块提供的Draw方法来实现，详细步骤请参阅下文步骤S130以及步骤S140。

步骤S130：获取所述元素浮层的显示信息。

当确定接口函数后，客户端可以通过调用所述底层功能模块的获取函数获取所述元素浮层的显示信息，其中，所述底层功能模块的获取函数可以为get_dst_pos函数。例如，要实现在目标视频元素的上层绘制元素浮层，客户端可以在OnAfterDrawCapture函数所带的ID参数中，调用LiveEncoder的get_dst_pos函数获取元素浮层的显示信息。

其中，所述显示信息可以包括元素浮层在目标视频元素中的显示区域坐标、显示纹理坐标以及所述元素浮层的像素信息。

显示区域坐标表征元素浮层在目标视频元素中的显示位置，可以通过设置RenderBuffer结构中的x、y、w、h四个字段来设定元素浮层在窗口上显示的左上角的坐标以及要显示的宽度和高度。

显示纹理坐标表征一个元素浮层从什么位置开始显示，到什么位置结束显示。u、v表示开始显示的水平坐标和垂直坐标，u1、v1表示结束显示的水平坐标和垂直坐标。将u、v设置为0，将u1、v1设置为1表示全部显示该图像。

元素浮层的像素信息表征元素浮层的显示内容，例如可以是动画像素、图片像素等。

步骤S140：基于所述显示信息，以使上层功能模块调用绘制函数，在所述目标视频元素中绘制所述元素浮层。

进一步地，所述客户端可以在D3D11RenderSystem内部调用IDirect3D11的CreateTexture2D来创建纹理，并将所述元素浮层的像素信息拷贝进所述纹理。创建好将要显示的内容的纹理后，客户端可以通过调用IDirect3D11的Draw方法，基于所述显示区域坐标、所述显示纹理坐标，设置所述纹理的显示区域以及显示范围，绘制所述元素浮层。

本发明第一实施例提供的一种绘制元素浮层的方法，客户端通过调用底层功能模块接口的接口函数，将接口函数与需要绘制元素浮层的目标视频元素的ID绑定，并通过获取元素浮层的显示信息，以使上层功能模块调用绘制函数，在目标视频元素中绘制元素浮层，使得底层功能模块不涉及具体的业务逻辑，保证了底层功能模块的低耦合性以及可重用性。

第二实施例

请参照图3，图3是本发明第二实施例提供的一种绘制元素浮层的方法的流程图，所述方法应用于客户端。所述客户端可以是安装在用户终端上的软件(例如直播软件)、第三方应用程序(Application，APP)或者用户终端本身。所述元素浮层，是将一张图像贴在现有图像的上面或者下面。

下面将对图3所示的流程进行阐述，所述方法包括：

步骤S210：客户端调用底层功能模块接口的接口函数。

步骤S220：将所述接口函数与目标视频元素的ID进行绑定。

步骤S230：获取所述元素浮层的显示信息。

步骤S240：基于所述显示信息，以使上层功能模块调用绘制函数，在所述目标视频元素中绘制所述元素浮层。

步骤S250：所述客户端通过调用所述底层功能模块的移除函数，解除所述接口函数与所述目标视频元素的ID之间的绑定，停止绘制元素浮层。

当用户不需要在目标视频元素上显示元素浮层时，可以向用户终端发送指令，以使用户终端可以响应于所述指令，通过调用所述底层功能模块的移除函数，将接口函数与目标视频元素的ID之间的绑定解除，从而停止在目标视频元素上绘制元素浮层。

进一步地，所述底层功能模块的移除函数可以是LiveEncoder功能模块所提供的RemoveCaptureListener函数。

本发明第一实施例提供的一种绘制元素浮层的方法，客户端通过调用底层功能模块接口的接口函数，将接口函数与需要绘制元素浮层的目标视频元素的ID绑定，并通过获取元素浮层的显示信息，以使上层功能模块调用绘制函数，在目标视频元素中绘制元素浮层；此外，客户端还可以在不需要在目标视频元素上显示元素浮层时，通过解除接口函数与目标视频元素的ID绑定，实现停止在目标视频元素上绘制元素浮层，使得底层功能模块不涉及具体的业务逻辑，保证了底层功能模块的低耦合性以及可重用性。

第三实施例

请参照图4，图4是本发明第二实施例提供的一种绘制元素浮层的装置400的结构框图。下面将对图4所示的结构框图进行阐述，所示装置包括：调用模块410、绑定模块420、获取模块430以及绘制模块440，其中：

调用模块410，用于调用底层功能模块接口的接口函数。

所述底层功能模块的接口为ICaptureListener接口，所述接口函数为上层贴图函数OnBeforDrawCapture或者下层贴图函数OnAfterDrawCapture。

绑定模块420，用于将所述接口函数与目标视频元素的ID进行绑定。

获取模块430，用于获取所述元素浮层的显示信息。

绘制模块440，用于基于所述显示信息，以使上层功能模块调用绘制函数，在所述目标视频元素中绘制所述元素浮层。

本实施例对绘制元素浮层的装置400的各功能模块实现各自功能的过程，请参见上述图1至图3所示实施例中描述的内容，此处不再赘述。

第四实施例

请参照图5，图5是本发明第四实施例提供的一种绘制元素浮层的装置500的结构框图。下面将对图5所示的结构框图进行阐述，所示装置包括：调用模块510、绑定模块520、获取模块530、绘制模块540以及移除模块550，其中：

调用模块410，用于调用底层功能模块接口的接口函数。

绑定模块420，用于将所述接口函数与目标视频元素的ID进行绑定。

获取模块430，用于获取所述元素浮层的显示信息。

绘制模块440，用于基于所述显示信息，以使上层功能模块调用绘制函数，在所述目标视频元素中绘制所述元素浮层。

移除模块550，用于调用所述底层功能模块的移出函数，解除所述接口函数与所述目标视频元素的ID之间的绑定，停止绘制元素浮层。

本实施例对绘制元素浮层的装置500的各功能模块实现各自功能的过程，请参见上述图1至图3所示实施例中描述的内容，此处不再赘述。

综上所述，本发明实施例提出的一种绘制元素浮层的方法、装置以及计算机可读存储介质，客户端通过调用底层功能模块接口的接口函数，将接口函数与需要绘制元素浮层的目标视频元素的ID绑定，并通过获取元素浮层的显示信息，以使上层功能模块调用绘制函数，在目标视频元素中绘制元素浮层，使得底层功能模块不涉及具体的业务逻辑，保证了底层功能模块的低耦合性以及可重用性。

在本申请所提供的几个实施例中，应该理解到，所揭露的装置和方法，也可以通过其它的方式实现。以上所描述的装置实施例仅仅是示意性的，例如，附图中的流程图和框图显示了根据本发明的多个实施例的装置、方法和计算机程序产品的可能实现的体系架构、功能和操作。在这点上，流程图或框图中的每个方框可以代表一个模块、程序段或代码的一部分，所述模块、程序段或代码的一部分包含一个或多个用于实现规定的逻辑功能的可执行指令。也应当注意，在有些作为替换的实现方式中，方框中所标注的功能也可以以不同于附图中所标注的顺序发生。例如，两个连续的方框实际上可以基本并行地执行，它们有时也可以按相反的顺序执行，这依所涉及的功能而定。也要注意的是，框图和/或流程图中的每个方框、以及框图和/或流程图中的方框的组合，可以用执行规定的功能或动作的专用的基于硬件的系统来实现，或者可以用专用硬件与计算机指令的组合来实现。

另外，在本发明各个实施例中的各功能模块可以集成在一起形成一个独立的部分，也可以是各个模块单独存在，也可以两个或两个以上模块集成形成一个独立的部分。

所述功能如果以软件功能模块的形式实现并作为独立的产品销售或使用时，可以存储在一个计算机可读取存储介质中。基于这样的理解，本发明的技术方案本质上或者说对现有技术做出贡献的部分或者该技术方案的部分可以以软件产品的形式体现出来，该计算机软件产品存储在一个存储介质中，包括若干指令用以使得一台计算机设备(可以是个人计算机，服务器，或者网络设备等)执行本发明各个实施例所述方法的全部或部分步骤。而前述的存储介质包括：U盘、移动硬盘、只读存储器(ROM，Read-Only Memory)、随机存取存储器(RAM，Random Access Memory)、磁碟或者光盘等各种可以存储程序代码的介质。需要说明的是，在本文中，诸如第一和第二等之类的关系术语仅仅用来将一个实体或者操作与另一个实体或操作区分开来，而不一定要求或者暗示这些实体或操作之间存在任何这种实际的关系或者顺序。而且，术语“包括”、“包含”或者其任何其他变体意在涵盖非排他性的包含，从而使得包括一系列要素的过程、方法、物品或者设备不仅包括那些要素，而且还包括没有明确列出的其他要素，或者是还包括为这种过程、方法、物品或者设备所固有的要素。在没有更多限制的情况下，由语句“包括一个……”限定的要素，并不排除在包括所述要素的过程、方法、物品或者设备中还存在另外的相同要素。

以上所述仅为本发明的优选实施例而已，并不用于限制本发明，对于本领域的技术人员来说，本发明可以有各种更改和变化。凡在本发明的精神和原则之内，所作的任何修改、等同替换、改进等，均应包含在本发明的保护范围之内。应注意到：相似的标号和字母在下面的附图中表示类似项，因此，一旦某一项在一个附图中被定义，则在随后的附图中不需要对其进行进一步定义和解释。

以上所述，仅为本发明的具体实施方式，但本发明的保护范围并不局限于此，任何熟悉本技术领域的技术人员在本发明揭露的技术范围内，可轻易想到变化或替换，都应涵盖在本发明的保护范围之内。因此，本发明的保护范围应所述以权利要求的保护范围为准。

Claims (10)

1.一种绘制元素浮层的方法，其特征在于，所述方法包括：

客户端调用底层功能模块接口的接口函数；

将所述接口函数与目标视频元素的ID进行绑定；

获取所述元素浮层的显示信息；

基于所述显示信息，以使上层功能模块调用绘制函数，在所述目标视频元素中绘制所述元素浮层。

2.根据权利要求1所述的方法，其特征在于，所述底层功能模块的接口为ICaptureListener接口，所述接口函数为上层贴图函数OnBeforDrawCapture或者下层贴图函数OnAfterDrawCapture。

3.根据权利要求1所述的方法，其特征在于，所述显示信息包括显示区域坐标、显示纹理坐标以及所述元素浮层的像素信息，所述基于所述显示信息，调用绘制函数，在所述目标视频元素中绘制所述元素浮层，包括：

所述客户端创建纹理，将所述元素浮层的像素信息拷贝进所述纹理；

基于所述显示区域坐标、所述显示纹理坐标，设置所述纹理的显示区域以及显示范围，绘制所述元素浮层。

4.根据权利要求3所述的方法，其特征在于，所述客户端在D3D11RenderSystem内部调用IDirect3D11的CreateTexture2D来创建所述纹理。

5.根据权利要求1所述的方法，其特征在于，所述显示信息由所述客户端通过调用所述底层功能模块的获取函数获取，所述底层功能模块的获取函数为get_dst_pos函数。

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

所述客户端通过调用所述底层功能模块的移除函数，解除所述接口函数与所述目标视频元素的ID之间的绑定，停止绘制元素浮层。

7.一种绘制元素浮层的装置，其特征在于，所述装置包括：

调用模块，用于调用底层功能模块接口的接口函数；

绑定模块，用于将所述接口函数与目标视频元素的ID进行绑定；

获取模块，用于获取所述元素浮层的显示信息；

绘制模块，用于基于所述显示信息，以使上层功能模块调用绘制函数，在所述目标视频元素中绘制所述元素浮层。

8.根据权利要求7所述的装置，其特征在于，所述底层功能模块的接口为ICaptureListener接口，所述接口函数为上层贴图函数OnBeforDrawCapture或者下层贴图函数OnAfterDrawCapture。

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

移除模块，用于调用所述底层功能模块的移出函数，解除所述接口函数与所述目标视频元素的ID之间的绑定，停止绘制元素浮层。

10.一种计算机可读存储介质，其特征在于，所述可读存储介质存储有处理器可执行的程序代码，所述程序代码被配置成使所述处理器执行所述权利要求1-6任一项所述方法。