纹理数据生成方法、装置、存储介质及设备与流程

文档序号:18256827发布日期:2019-07-24 10:18阅读:275来源:国知局
纹理数据生成方法、装置、存储介质及设备与流程

本申请实施例涉及计算机技术领域,特别涉及一种纹理数据生成方法、装置、存储介质及设备。



背景技术:

终端中显示的图形界面可以是对纹理数据进行渲染得到的,而纹理数据是渲染引擎加载JavaScript(简称JS)代码段后,对该JavaScript代码段进行渲染得到的。比如,图形界面是能够响应用户的手势操作的贴纸,则可以生成贴纸的纹理数据,再将该贴纸显示在视频或图像上。比如,贴纸包括“是否好看”的问题以及“是”和“否”的选项。

相关技术中,在生成纹理数据时,可以创建一个渲染引擎和一个共享JS上下文(JSContext),利用该渲染引擎加载一个JS代码段,再基于该共享JS上下文生成来生成纹理数据。

当需要同时生成多种纹理数据时,需要创建多个渲染引擎和多个共享JS上下文,而创建多个渲染引擎和多个共享JS上下文时会消耗较多的内存资源,导致生成纹理数据时的内存开销较大。



技术实现要素:

本申请实施例提供了一种纹理数据生成方法、装置、存储介质及设备,用于解决同时创建多个渲染引擎和多个共享JS上下文来生成多种纹理数据时,内存开销较大的问题。所述技术方案如下:

一方面,提供了一种纹理数据生成方法,用于渲染引擎中,所述渲染引擎包括渲染内核和至少两个渲染引擎界面,所述方法包括:

创建一个共享JS上下文,所述共享JS上下文用于提供JS代码段的运行环境;

对于所述至少两个渲染引擎界面中的每个渲染引擎界面,所述渲染引擎界面获取一个JS代码段,将所述JS代码段发送给所述渲染内核;

对于每个JS代码段,所述渲染内核基于所述共享JS上下文,对所述JS代码段进行渲染,得到对应于所述JS代码段的纹理数据。

一方面,提供了一种视频中的图形界面显示方法,所述方法包括:

显示视频的封面和位于所述封面的上层的n张贴纸,所述贴纸是对纹理数据进行渲染得到的,n≥2;

接收到对所述封面的第一操作时,显示所述视频中的各个视频帧和位于所述封面的上层的所述n张贴纸;

接收到对所述n张贴纸中任意一张贴纸的第二操作时,将显示的所述贴纸替换为所述贴纸的功能界面,所述功能界面中包含所述贴纸针对所述第二操作所收集的反馈信息。

一方面,提供了一种纹理数据生成装置,用于渲染引擎中,所述渲染引擎包括渲染内核和至少两个渲染引擎界面,所述装置包括:

创建模块,用于创建一个共享JS上下文,所述共享JS上下文用于提供JS代码段的运行环境;

发送模块,用于对于所述至少两个渲染引擎界面中的每个渲染引擎界面,控制所述渲染引擎界面获取一个JS代码段,将所述JS代码段发送给所述渲染内核;

渲染模块,用于对于每个JS代码段,控制所述渲染内核基于所述共享JS上下文,对所述JS代码段进行渲染,得到对应于所述JS代码段的纹理数据。

一方面,提供了一种视频中的图形界面显示装置,所述装置包括:

显示模块,用于显示视频的封面和位于所述封面的上层的n张贴纸,所述贴纸是对纹理数据进行渲染得到的,n≥2;

所述显示模块,还用于接收到对所述封面的第一操作时,显示所述视频中的各个视频帧和位于所述封面的上层的所述n张贴纸;

所述显示模块,还用于接收到对所述n张贴纸中任意一张贴纸的第二操作时,将显示的所述贴纸替换为所述贴纸的功能界面,所述功能界面中包含所述贴纸针对所述第二操作所收集的反馈信息。

一方面,提供了一种计算机可读存储介质,所述存储介质中存储有至少一条指令、至少一段程序、代码集或指令集,所述至少一条指令、所述至少一段程序、所述代码集或指令集由处理器加载并执行以实现如上所述的纹理数据生成方法。

一方面,提供了一种纹理数据生成设备,所述纹理数据生成设备包括处理器和存储器,所述存储器中存储有至少一条指令,所述指令由所述处理器加载并执行以实现如上所述的纹理数据生成方法。

本申请实施例中,当渲染引擎包括至少两个渲染引擎界面和一个渲染内核时,可以创建一个共享JS上下文,并利用每个渲染引擎界面将获取到的一个JS代码段发送给渲染内核,渲染内核可以基于该共享JS上下文对各个代码段进行渲染,得到每个代码段对应的一种纹理数据,这样,可以通过创建一个渲染引擎和一个共享JS上下文来生成多种纹理数据,解决了需要同时创建多个渲染引擎和多个共享JS上下文来生成多种纹理数据时,内存开销大的问题,从而达到了节省内存开销的效果。

附图说明

为了更清楚地说明本申请实施例中的技术方案,下面将对实施例描述中所需要使用的附图作简单地介绍,显而易见地,下面描述中的附图仅仅是本申请的一些实施例,对于本领域普通技术人员来讲,在不付出创造性劳动的前提下,还可以根据这些附图获得其他的附图。

图1是根据部分示例性实施例示出的一种渲染系统的架构图;

图2是本申请一个实施例提供的纹理数据生成方法的方法流程图;

图3是本申请另一实施例提供的纹理数据生成方法的方法流程图;

图4是本申请另一实施例提供的渲染引擎的架构图;

图5是本申请另一实施例提供的闭包对象的示意图;

图6是本申请另一实施例提供的渲染引擎的结构图;

图7是本申请另一实施例提供的纹理数据的显示流程图;

图8是本申请另一实施例提供的实验数据的示意图;

图9是根据部分示例性实施例示出的一种交互系统的架构图;

图10是本申请一个实施例提供的视频中的图形界面显示方法的方法流程图;

图11是本申请一个实施例提供的视频封面的示意图;

图12是本申请一个实施例提供的贴纸的功能界面的示意图;

图13是本申请一个实施例提供的拍摄视频的界面示意图;

图14是本申请一个实施例提供的贴纸选择的界面示意图;

图15是本申请一个实施例提供的纹理数据生成装置的结构框图;

图16是本申请再一实施例提供的视频中的图像界面显示装置的结构框图;

图17是本申请一个实施例提供的终端的结构框图。

具体实施方式

为使本申请实施例的目的、技术方案和优点更加清楚,下面将结合附图对本申请实施方式作进一步地详细描述。

下面先对渲染系统的架构进行介绍。

请参考图1,本实施例中的渲染系统包括JS代码101、前端公共库102、渲染引擎103和操作系统平台104。

JS代码101是用于体现业务的实现逻辑的代码。比如,JS代码101可以指示绘制圆形图案、三角形图案等渲染效果。

前端公共库102是一些基础类库,可以供JS代码101调用。

渲染引擎103是一种JS脚本渲染引擎,在终端的操作系统平台上加载JS代码101,可以渲染出图形界面。其中,渲染引擎至少包括渲染引擎界面、渲染内核和模块接口,比如Canvas(画布)接口。

渲染引擎界面是用于渲染并显示渲染引擎生成的纹理数据的界面。若将渲染引擎称为QG引擎,则渲染引擎界面可以成为QGView。

本实施例中,可以由外部创建渲染引擎界面,并将创建好的渲染引擎界面加载到渲染引擎103中。其中,渲染引擎界面的数量与需要同时生成的纹理数据的种类相等。比如,当需要生成一种纹理数据时,可以创建一个渲染引擎界面;当需要同时生成三种纹理数据时,可以创建三个渲染引擎界面,下文中以创建至少两个渲染引擎界面为例进行说明。

渲染内核至少包括JS API(Application Interface,应用程序接口)。其中,JS API是JS语言和操作系统语言之间的通讯桥梁,比如,JS API可以将JS代码翻译成操作系统平台能够识别的代码,再调用操作系统平台中的接口来执行该代码;或者,JS API可以将操作系统平台能够识别的代码翻译成JS代码,再触发JS逻辑来执行该JS代码。

需要说明的是,渲染内核的作用类似于浏览器内核,实现了JS代码能在本地渲染的效果,就像在浏览器中执行JS代码一样。

Canvas接口是供JS API调用的绘图接口。Canvas接口可以提供不同的通信协议与操作系统平台通信,如图1中所示的WebGL(Web Graphics Library,3D绘图协议)和Canvas2D(2D绘图协议)。Canvas接口通过调用操作系统平台的接口来实现绘图功能。比如,Canvas接口可以调用图1中的OpenGL(Open Graphics Library,开放式图库)。

下面对渲染引擎生成纹理数据的流程进行介绍。

请参考图2,其示出了本申请一个实施例提供的纹理数据生成方法的方法流程图,该纹理数据生成方法可以应用于图1所示的渲染引擎中。该纹理数据生成方法,包括:

步骤201,创建一个共享JS上下文,该共享JS上下文用于提供JS代码段的运行环境。

共享JS上下文中包含一些共享环境变量,在运行JS代码段的过程中会用到这些共享环境变量,所以,可以用共享JS上下文代指全局的JS代码的运行环境。也即,共享JS上下文用于提供JS代码段的运行环境。

本实施例中,可以由渲染引擎创建共享JS上下文,并将该共享JS上下文加载到渲染内核中。

步骤202,对于至少两个渲染引擎界面中的每个渲染引擎界面,渲染引擎界面获取一个JS代码段,将该JS代码段发送给渲染内核。

在创建每个渲染引擎界面时,可以为每个渲染引擎界面分配一个唯一的标识(Key),这样,可以将渲染引擎界面获取的JS代码段和该渲染引擎界面的标识一起发送给渲染内容,从而通过该标识来指示发送该JS代码的渲染引擎界面。

步骤203,对于每个JS代码段,渲染内核基于共享JS上下文,对该JS代码段进行渲染,得到对应于该JS代码段的纹理数据。

对于每个JS代码段,渲染内核可以根据共享JS上下文和该JS代码段生成一个JS实例,再将该JS实例翻译成操作系统平台能够识别的实例;再基于转换后的实例生成Canvas,再通过该Canvas调用Canvas接口,最后通过该Canvas接口调用OpenGL来生成纹理数据,该纹理数据即为对应于该JS代码段的纹理数据。

若渲染内核可以获取到渲染引擎界面的标识,则渲染内核可以将生成的JS实例、Canvas分别与该标识进行对应。

综上所述,本申请实施例提供的纹理数据生成方法,当渲染引擎包括至少两个渲染引擎界面和一个渲染内核时,可以创建一个共享JS上下文,并利用每个渲染引擎界面将获取到的一个JS代码段发送给渲染内核,渲染内核可以基于该共享JS上下文对各个代码段进行渲染,得到每个代码段对应的一种纹理数据,这样,可以通过创建一个渲染引擎和一个共享JS上下文来生成多种纹理数据,解决了需要同时创建多个渲染引擎和多个共享JS上下文来生成多种纹理数据时,内存开销大的问题,从而达到了节省内存开销的效果。

请参考图3,其示出了本申请另一实施例提供的纹理数据生成方法的方法流程图,该纹理数据生成方法可以应用于图1所示的渲染引擎中。该纹理数据生成方法,包括:

步骤301,创建一个共享JS上下文,该共享JS上下文用于提供JS代码段的运行环境。

共享JS上下文中包含一些共享环境变量,在运行JS代码段的过程中会用到这些共享环境变量,所以,可以用共享JS上下文代指全局的JS代码的运行环境。也即,共享JS上下文用于提供JS代码段的运行环境。

本实施例中,可以由渲染引擎创建共享JS上下文,并将该共享JS上下文加载到渲染内核中。

步骤302,对于至少两个渲染引擎界面中的每个渲染引擎界面,渲染引擎界面获取一个JS代码段,将该JS代码段发送给渲染内核。

在创建每个渲染引擎界面时,可以为每个渲染引擎界面分配一个唯一的标识(Key),这样,可以将渲染引擎界面获取的JS代码段和该渲染引擎界面的标识一起发送给渲染内容,从而通过该标识来指示发送该JS代码的渲染引擎界面。

可选的,渲染引擎还可以包括位于渲染引擎界面和渲染内核之间的代理(Agent),则每个渲染引擎界面可以将JS代码段发送给代理,代理为每个渲染引擎界面分配一个唯一的标识,并将每个渲染引擎界面的JS代码和标识对应发送给渲染内核,请参考图4。

在渲染内核获取到每个渲染引擎界面的IS代码段和标识后,创建映射表,该映射表中存储有渲染引擎界面发送的JS代码段和该渲染引擎界面的标识之间的对应关系。

如图4所示,渲染引擎界面A获取到JS代码段A,将该JS代码段A发送给代理,代理为该渲染引擎界面A生成KeyA,并将该JS代码段A和KeyA一起发送给渲染内核,渲染内核在映射表中创建JS代码段A和KeyA之间的对应关系。渲染引擎界面B获取到JS代码段B,将该JS代码段B发送给代理,代理为该渲染引擎界面B生成KeyB,并将该JS代码段B和KeyB一起发送给渲染内核,渲染内核在映射表中创建JS代码段B和KeyB之间的对应关系。

步骤303,对于每个JS代码段,渲染内核获取JS代码段对应的一个闭包对象,该闭包对象用于隔离渲染内核中的各个JS代码段的渲染。

这里所说的闭包对象可以理解为闭包宏QGDefineView(function(window)){},该闭包宏的闭包特性可以将JS实例的运行环境封装起来,以便和外界其他JS实例的运行环境相隔离,防止JS实例在同一个共享JS上下文中运行时,修改该共享JS上下文中的一些共享环境变量,从而引起其他JS实例的运行逻辑和生成的数据出错。

请参考图5,JS实例A和JS实例B共享同一个共享JS上下文中的共享环境变量X,若JS实例A将共用的共享环境变量X的数值修改为20,而JS实例B所需的该共享环境变量X的数值为30,则JS实例B的运行逻辑和生成的数据会出错。

步骤304,渲染内核将JS代码段加载到闭包对象中。

渲染内核将每个JS代码段记载到对应的一个闭包对象中。比如,JS代码段A对应于闭包对象A,JS代码段B对应于闭包对象B,则渲染内核将JS代码段A加载到闭包对象A中,间JS代码段B加载到闭包对象B中。

步骤305,渲染内核将共享JS上下文中的共享环境变量发送给闭包对象,该共享环境变量是所有JS代码段共享的环境变量。

渲染内核可以通过Window参数,将共享JS上下文中的共享环境变量发送给闭包对象。比如,渲染内核将图5中的共享环境变量X=10发送给闭包对象。

步骤306,闭包对象对共享环境变量进行存储,并对该共享环境变量中的部分或全部共享环境变量进行修改,得到局部环境变量。

闭包对象可以对该共享环境变量进行存储,即,闭包对象将Window参数中的共享环境变量拷贝到自己内部。

闭包对象可以对自己内部存储的共享环境变量中的部分或全部共享环境变量进行修改,得到局部环境变量,该局部环境变量的数值不会影响闭包对象外的共享环境变量的数值。比如,JS实例A可以将闭包对象A中存储的共享环境变量X的数值修改为20,JS实例B可以将闭包对象B中存储的共享环境变量X的数值修改为30,此时,共享JS上下文中存储的共享环境变量X的数值仍然为10。

步骤307,渲染内核基于闭包对象内的局部环境变量,对该JS代码段进行渲染,得到对应于该JS代码段的纹理数据。

对于每个JS代码段,渲染内核可以根据共享JS上下文和该JS代码段生成一个JS实例,再将该JS实例翻译成操作系统平台能够识别的实例;再基于转换后的实例生成Canvas,再通过该Canvas调用Canvas接口,最后通过该Canvas接口调用OpenGL来生成纹理数据,该纹理数据即为对应于该JS代码段的纹理数据。即对于每个JS代码段,渲染内核将得到的纹理数据和映射表中该JS代码段对应的标识进行对应。

若渲染内核可以获取到渲染引擎界面的标识,则渲染内核可以将生成的JS实例、Canvas分别与映射表中该JS代码段对应的标识进行对应。

本实施例中,可以同时创建多个渲染引擎界面,每个渲染引擎界面可以加载一个JS代码段,每个JS代码段可以生成一个JS实例和一个Canvas,这样,不同的JS实例和Canvas都运行在同一个共享JS上下文中,能在同时生成多种纹理数据时节省内存开销。

在生成纹理数据之后,渲染引擎可以对该纹理数据进行输出,此时的纹理数据对用户不可见,需要调用其他工具对该纹理数据进行渲染和显示,或者,渲染引擎可以对该纹理数据进行渲染和显示,从而给用户呈现直接的视觉效果,此时执行步骤308-310。

步骤308,对于至少两个渲染引擎界面中的每个渲染引擎界面,该渲染引擎界面从渲染内核获取对应的纹理数据。

在一种可能的实现方式中,渲染内核在得到纹理数据后,可以将该纹理数据和对应的标识发送给代理,代理根据该标识确定渲染引擎界面,再将该纹理数据发送给该渲染引擎界面。在另一种可能的实现方式中,渲染引擎界面可以向代理请求纹理数据,代理向渲染内核发送携带有该渲染引擎界面的标识的获取请求,渲染内核从映射表中查找到该标识对应的纹理数据,将该纹理数据和该标识发送给代理,代理根据该标识确定渲染引擎界面,再将该纹理数据发送给该渲染引擎界面。当然,渲染引擎界面还可以通过其他方式从渲染内核获取纹理数据,本实施例不作限定。

本实施例中,渲染引擎界面的内部可以监听显示界面的刷新信号,该刷新信号的发送次数与显示界面的刷新次数相等。比如,1秒内显示界面的刷新次数为60次,则该刷新信号的发送次数也为60次。当渲染引擎界面监听到刷新信号时,可以从渲染内核获取纹理数据,以便将纹理数据显示在显示界面上。或者,渲染引擎界面也可以不根据刷新信号来从渲染内核获取纹理数据,本实施例不对纹理数据的获取时机作限定。

请参考图6,渲染引擎在获取到JS代码段后,可以将该JS代码段发送给渲染内核,渲染内核再调用Canvas接口,Canvas接口再调用操作系统平台的OpenGL来生成纹理数据,最后该纹理数据被发送给渲染引擎界面。

步骤309,渲染引擎界面将该纹理数据中的各帧数据存储到渲染缓冲区中。

本实施例中的纹理数据包括多帧数据,每帧数据可以按照渲染顺序依次存储到渲染引擎界面中的渲染缓冲区中。即,渲染缓冲区中存储的是一个数据队列,该数据队列中排序在前的数据先渲染,排序在后的数据后渲染。

若步骤308中,渲染引擎界面在监听到刷新信号时获取纹理数据,则在步骤309之后执行步骤311;若步骤308中,渲染引擎界面不根据刷新信号获取纹理数据,则在步骤309之后执行步骤310。

步骤310,渲染引擎界面监听显示界面的刷新信号。

步骤311,当监听到刷新信号时,渲染引擎界面将渲染缓冲区中最早缓存的一帧数据发送到帧缓冲区中,该帧缓冲区与渲染层绑定。

步骤312,渲染层对帧缓冲区中的一帧数据进行渲染,并将得到的渲染数据显示在该显示界面中。

渲染缓冲区中可能会存储有多帧数据,渲染引擎界面可以将最早缓存的一帧数据发送到帧缓冲区中。即,当渲染缓冲区中存储的是一个数据队列时,将该数据队列中的第一个数据发送到帧缓冲区中。在发送完成后,渲染引擎界面对该数据队列中的该数据进行删除。

本实施例中,在创建渲染引擎界面时还需要将帧缓冲区与渲染层绑定,这样,每当帧缓冲区中存储有一帧数据时,渲染层可以从该帧缓冲区中读取该帧数据,对该帧数据进行渲染,并将渲染得到的渲染数据显示在显示界面中。这里所说的渲染层可以是CALayer渲染层。

请参考图7,渲染引擎界面包括渲染缓冲区、帧缓冲区和渲染层,且渲染引擎界面可以从渲染内核获取纹理数据,再将该纹理数据存储到渲染缓冲区中,在监听到刷新信号时,将该纹理数据发送到帧缓冲区中,CALayer渲染层再将帧缓冲区中的一帧数据渲染并显示在显示界面上。

综上所述,本申请实施例提供的纹理数据生成方法,当渲染引擎包括至少两个渲染引擎界面和一个渲染内核时,可以创建一个共享JS上下文,并利用每个渲染引擎界面将获取到的一个JS代码段发送给渲染内核,渲染内核可以基于该共享JS上下文对各个代码段进行渲染,得到每个代码段对应的一种纹理数据,这样,可以通过创建一个渲染引擎和一个共享JS上下文来生成多种纹理数据,解决了需要同时创建多个渲染引擎和多个共享JS上下文来生成多种纹理数据时,内存开销大的问题,从而达到了节省内存开销的效果。

闭包对象将JS实例的运行环境封装起来,以便和外界其他JS实例的运行环境相隔离,防止JS实例在同一个共享JS上下文中运行时,修改该共享JS上下文中的一些共享环境变量,从而引起其他JS实例的运行逻辑和生成的数据出错,从而提高了JS实例的运行的准确性。另外,不同JS势力之间的效果、人机交互互不影响。

渲染引擎界面对纹理数据进行显示,可以避免纹理数据对用户不可见的问题,从而使纹理数据能够直观地呈现在显示界面上。

下面在苹果(iphone)6手机上,对相关技术和本申请实施例的两种实现方式进行了实验,得到的实验数据如图8所示。其中,实线代表相关技术中同时生成多种纹理数据的内存增量,虚线代表本申请实施例中同时生成多种纹理数据的内存增量。分析实验数据可以发现,优化前每个QGView的平均增量为3340KB,优化后每个QGView的平均增量为337KB,内存开销减少约90%。

下面对上述纹理数据生成方法的应用场景进行介绍。

上文中的纹理数据可以渲染成图形界面,并叠加在任意的显示界面上进行显示。比如,图形界面可以叠加在图像中进行显示,或者,图形界面可以叠加在视频的视频帧中进行显示。下面以图形界面为贴纸、且贴纸叠加在视频帧中显示为例,对视频中的图形界面的显示方法进行说明。

其中,当视频是终端中存储的视频时,该视频中的图形界面的显示方法可以由终端执行;当视频是终端联网得到的视频时,该视频中的图形界面显示方法可以由终端和服务器共同执行。

请参考图9,其示出了本申请实施例提供的一种交互系统的结构示意图。该交互系统包括终端910和服务器920,该终端910中包含渲染引擎。终端910与服务器920通过有线网络或无线网络建立连接。

终端910可以是手机、平板电脑、电子书阅读器、智能眼镜、智能手表、MP3播放器(Moving Picture Experts Group Audio Layer III,动态影像专家压缩标准音频层面3)、MP4(Moving Picture Experts Group Audio Layer IV,动态影像专家压缩标准音频层面4)播放器、膝上型便携计算机和台式计算机等等。

终端910中安装有客户端,该客户端可以制作包含图形界面的视频,并将该视频发布到服务器中,或者,该客户端可以从服务器获取发布的包含图形界面的视频。

服务器920是客户端的后台服务器,可以是一台服务器或多台服务器组成的服务器集群或云计算中心。

本申请实施例中,终端910的数量为至少一个,图1中仅以示出一个终端910和一个服务器920来举例说明。

请参考图10,其示出了本申请一个实施例提供的视频中的图形界面的显示方法的方法流程图,该视频中的图形界面的显示方法可以应用于终端中或图9所示的交互系统中。该视频中的图形界面的显示方法,包括:

步骤1001,显示视频的封面和位于该封面的上层的n张贴纸,该贴纸是对纹理数据进行渲染得到的,n≥2。

视频可以是终端中存储的,也可以是终端从服务器的发布平台上获取到的,本实施例不对视频的来源作限定。

视频的封面通常是该视频的第一个视频帧,也可以是该视频中的其他视频帧,还可以是其他图像等等,本实施例不作限定。

本实施例中,终端可以通过步骤301-310来在视频的封面上显示n张贴纸。其中,每种纹理数据对应于一张贴纸。

贴纸是指利用渲染引擎加载JS代码段后渲染得到的图形界面,且该图形界面可以叠加在其他显示界面的上层进行显示。

可选的,贴纸可以不包含操作选项,此时该贴纸不会响应用户的操作。或者,贴纸可以包含操作选项,此时该贴纸能够响应用户的操作。当终端是触控终端时,贴纸能够响应用户的手势点击操作。

其中,实现不同功能的贴纸可能具有不同的操作方式。请参考图11,图11中的第一张视图显示的是终端的桌面,该桌面中包含客户端“xq”的图标1101,当用户点击该图标1101时显示界面跳转到第二张视图;第二张视图显示有“xq”中的消息列表和“动态”控件1102,当用户点击该“动态”控件时显示界面跳转到第三张视图;第三张视图显示有“好友x视”的入口1103,当用户点击该“好友x视”的入口1103时,显示界面跳转到第四张视图;第四张视图显示的是“好友x视”的页面。假设视频的封面1104上显示有两张贴纸为例进行说明。其中,上面一张贴纸1105是评分贴纸,该贴纸1105包括“评分”的文字和5个用于评分的分值选项,且这5个分值选项是可操作的。下面一张贴纸1106是投票贴纸,该贴纸1106包括问题“是否好看”以及“是”和“否”的选项,且“是”和“否”的选项是可操作的。

步骤1002,接收到对封面的第一操作时,显示视频中的各个视频帧和位于该封面的上层的n张贴纸。

用户通过触发第一操作来控制终端播放视频,该第一操作可以是单击封面的操作、双击封面的操作、在封面上滑动的操作等等,本实施例不作限定。

本实施例中,在显示每个视频帧时,可以获取到n帧纹理数据,在该视频帧中叠加显示该n帧纹理数据对应的n张贴纸。

步骤1003,接收到对n张贴纸中任意一张贴纸的第二操作时,将显示的贴纸替换为贴纸的功能界面,该功能界面中包含贴纸针对第二操作所收集的反馈信息。

反馈信息是用户针对视频内容对贴纸产生的反馈。其中,反馈信息与贴纸的操作方式相关。当贴纸包含输入框时,反馈信息可以是针对贴纸的内容所输入的信息。比如,反馈信息可以是用户的观后感等。当贴纸包含选项时,反馈信息可以是针对选项的点击次数所收集的统计信息。比如,当贴纸是评分贴纸时,反馈信息可以是统计得到的总评分值以及参与评分的人数;当贴纸是投票贴纸时,反馈信息可以是每个选项的投票百分比以及参与投票的人数。

用户通过触发第二操作来操作贴纸,该第二操作可以是单击贴纸中选项的操作、双击贴纸中选项的操作等等,本实施例不作限定。

比如,当贴纸是评分贴纸时,若用户选择了5个分值选项中的一个分值选项,则在显示下一个视频帧时,在该贴纸的显示位置显示该贴纸的功能界面,该功能界面中包含当前所有针对该贴纸所进行的评分操作得到的总评分值,还可以包括参与评分的人数。

比如,当贴纸是投票贴纸1106时,若用户选择了“是”和“否”中的一个选项,则显示界面从图11中的第四张视图跳转到图12,即在显示下一个视频帧时,在该贴纸的显示位置显示该贴纸的功能界面,该功能界面中包含当前所有针对该贴纸所进行的投票操作得到的投票结果。如图12所示,下面一张贴纸1206的功能界面中显示有“是”和“否”的选择百分比以及参与投票的人数。

综上所述,本申请实施例提供的视频中的图形界面显示方法,由于视频帧的上层可以同时显示n张贴纸,可以丰富视频帧中贴纸的内容,从而提升用户的体验。

不同的贴纸是不同的渲染引擎界面渲染得到的,所以,针对不同的贴纸之间的操作互不影响。

可选的,用户还可以通过终端制作上述视频和对应的贴纸,制作流程如下所示:

步骤1、显示一个第一拍摄控件。

请参考图11,图11中的第一张视图显示的是终端的桌面,该桌面中包含客户端“xq”的图标1101,当用户点击该图标1101时显示界面跳转到第二张视图;第二张视图显示有“xq”中的消息列表和“动态”控件1102,当用户点击该“动态”控件时显示界面跳转到第三张视图;第三张视图显示有“好友x视”的入口1103,当用户点击该“好友x视”的入口1103时,显示界面跳转到图13中的第一张视图,图13中的第一张视图中显示有第一拍摄控件1301。

步骤2、接收到对该第一拍摄控件的第五操作时,显示第二拍摄控件和预览界面,如图13中的第二张视图中的第二拍摄控件1302和预览界面1303。

用户通过触发第五操作来控制客户端从动态界面跳转到拍摄界面,该第五操作可以是单击第一拍摄控件的操作、双击第一拍摄控件的操作等等,本实施例不作限定。比如,当用户点击第一拍摄控件1301时,显示界面跳转到图13中的第二张视图。

步骤3、接收到对该第二拍摄控件的第六操作时,拍摄视频;接收到对该第二拍摄控件的第七操作时,结束视频拍摄。

用户通过触发第六操作来控制摄像头开始拍摄视频,该第六操作可以是单击第二拍摄控件的操作、双击第二拍摄控件的操作等等,本实施例不作限定。比如,用户点击第二拍摄控件1302时,开始拍摄视频。

用户通过触发第七操作来控制摄像头停止拍摄视频,该第七操作可以是单击第二拍摄控件的操作、双击第二拍摄控件的操作等等,本实施例不作限定。比如,用户再次点击第二拍摄控件1302时,停止拍摄视频,显示界面跳转到图14中的第一张视图。

步骤4、在结束视频拍摄时,显示一个贴纸选择控件,比如图14中的第一张视图中的贴纸选择控件1401。

步骤5、接收到对贴纸选择控件的第三操作时,显示m张贴纸,m≥n。

用户通过触发第三操作来控制客户端显示待选择的贴纸,该第三操作可以是单击贴纸选择控件的操作、双击贴纸选择控件的操作等等,本实施例不作限定。比如,用户点击贴纸选择控件1401时,显示界面跳转到图14中的第二张视图。如图14中的第二张视图所示,m张贴纸包括投票贴纸1402和评分贴纸1403。

步骤6、接收到对m张贴纸中任意n张贴纸的选择操作时,显示视频的封面、n张贴纸和一个发布控件。

用户通过触发选择操作来控制客户端选择在视频帧上显示的贴纸。比如,当用户点击投票贴纸1402和评分贴纸1403时,显示界面跳转到图14中的第三张视图,视频的封面的上层显示有投票贴纸1402和评分贴纸1403。

步骤7、接收到对发布控件的第四操作时,对应发布视频和n张贴纸。

用户通过触发选择操作来控制客户端将视频和n张贴纸发布到服务器中的分布平台上,该第四操作可以是单击发布控件的操作、双击发布控件的操作等等,本实施例不作限定。

请参考图15,其示出了本申请一个实施例提供的纹理数据生成装置的结构框图,该纹理数据生成装置可以应用于渲染引擎中,渲染引擎包括渲染内核和至少两个渲染引擎界面。该纹理数据生成装置,包括:

创建模块1510,用于创建一个共享JS上下文,共享JS上下文用于提供JS代码段的运行环境;

发送模块1520,用于对于至少两个渲染引擎界面中的每个渲染引擎界面,控制渲染引擎界面获取一个JS代码段,将JS代码段发送给渲染内核;

渲染模块1530,用于对于每个JS代码段,控制渲染内核基于共享JS上下文,对JS代码段进行渲染,得到对应于JS代码段的纹理数据。

可选的,渲染模块1530,还用于:

对于每个JS代码段,控制渲染内核获取JS代码段对应的一个闭包对象,闭包对象用于隔离渲染内核中的各个JS代码段的渲染;

控制渲染内核将JS代码段加载到闭包对象中;

控制渲染内核基于共享JS上下文,对闭包对象中的JS代码段进行渲染,得到对应于JS代码段的纹理数据。

可选的,渲染模块1530,还用于:

控制渲染内核将共享JS上下文中的共享环境变量发送给闭包对象,共享环境变量是所有JS代码段共享的环境变量;

控制闭包对象对共享环境变量进行存储,并对共享环境变量中的部分或全部共享环境变量进行修改,得到局部环境变量;

控制渲染内核基于闭包对象内的局部环境变量,对JS代码段进行渲染,得到对应于JS代码段的纹理数据。

可选的,渲染模块1530,还用于:

控制渲染内核获取每个渲染引擎界面的标识;

控制渲染内核创建映射表,映射表中存储有渲染引擎界面发送的JS代码段和渲染引擎界面的标识之间的对应关系;

对于每个JS代码段,控制渲染内核基于共享JS上下文,对JS代码段进行渲染,将得到的纹理数据和映射表中JS代码段对应的标识进行对应。

可选的,该装置还包括:

获取模块,用于在对于每个JS代码段,控制渲染内核基于共享JS上下文,对JS代码段进行渲染,得到对应于JS代码段的纹理数据之后,对于至少两个渲染引擎界面中的每个渲染引擎界面,控制渲染引擎界面从渲染内核获取对应的纹理数据;

显示模块,用于控制渲染引擎界面对纹理数据进行渲染和显示。

可选的,显示模块,还用于:

控制渲染引擎界面将纹理数据中的各帧数据存储到渲染缓冲区中;

控制渲染引擎界面监听显示界面的刷新信号;

当监听到刷新信号时,控制渲染引擎界面将渲染缓冲区中最早缓存的一帧数据发送到帧缓冲区中,帧缓冲区与渲染层绑定;

渲染层对帧缓冲区中的一帧数据进行渲染,并将得到的渲染数据显示在显示界面中。

综上所述,本申请实施例提供的纹理数据生成装置,当渲染引擎包括至少两个渲染引擎界面和一个渲染内核时,可以创建一个共享JS上下文,并利用每个渲染引擎界面将获取到的一个JS代码段发送给渲染内核,渲染内核可以基于该共享JS上下文对各个代码段进行渲染,得到每个代码段对应的一种纹理数据,这样,可以通过创建一个渲染引擎和一个共享JS上下文来生成多种纹理数据,解决了需要同时创建多个渲染引擎和多个共享JS上下文来生成多种纹理数据时,内存开销大的问题,从而达到了节省内存开销的效果。

闭包对象将JS实例的运行环境封装起来,以便和外界其他JS实例的运行环境相隔离,防止JS实例在同一个共享JS上下文中运行时,修改该共享JS上下文中的一些共享环境变量,从而引起其他JS实例的运行逻辑和生成的数据出错,从而提高了JS实例的运行的准确性。另外,不同JS势力之间的效果、人机交互互不影响。

渲染引擎界面对纹理数据进行显示,可以避免纹理数据对用户不可见的问题,从而使纹理数据能够直观地呈现在显示界面上。

请参考图16,其示出了本申请一个实施例提供的视频中的图形界面显示装置的结构框图,该视频中的图形界面显示装置可以应用于终端或图9所示的交互系统中。该视频中的图形界面显示装置,包括:

显示模块1610,用于显示视频的封面和位于封面的上层的n张贴纸,贴纸是对纹理数据进行渲染得到的,n≥2;

显示模块1610,还用于接收到对封面的第一操作时,显示视频中的各个视频帧和位于封面的上层的n张贴纸;

显示模块1610,还用于接收到对n张贴纸中任意一张贴纸的第二操作时,将显示的贴纸替换为贴纸的功能界面,功能界面中包含贴纸针对第二操作所收集的反馈信息。

可选的,显示模块1610,还用于在结束视频拍摄时,显示一个贴纸选择控件;

显示模块1610,还用于接收到对贴纸选择控件的第三操作时,显示m张贴纸,m≥n;

显示模块1610,还用于接收到对m张贴纸中任意n张贴纸的选择操作时,显示视频的封面、n张贴纸和一个发布控件;

该装置还包括:发布模块1620,用于接收到对发布控件的第四操作时,对应发布视频和n张贴纸。

综上所述,本申请实施例提供的视频中的图形界面显示装置,由于视频帧的上层可以同时显示n张贴纸,可以丰富视频帧中贴纸的内容,从而提升用户的体验。

不同的贴纸是不同的渲染引擎界面渲染得到的,所以,针对不同的贴纸之间的操作互不影响。

图17示出了本申请一个示例性实施例提供的终端1700的结构框图。该终端1700可以是便携式移动终端,比如:智能手机、平板电脑、MP3播放器(Moving Picture Experts Group Audio Layer III,动态影像专家压缩标准音频层面3)、MP4(Moving Picture Experts Group Audio Layer IV,动态影像专家压缩标准音频层面4)播放器、笔记本电脑或台式电脑。终端1700还可能被称为用户设备、便携式终端、膝上型终端、台式终端等其他名称。

通常,终端1700包括有:处理器1701和存储器1702。

处理器1701可以包括一个或多个处理核心,比如4核心处理器、8核心处理器等。处理器1701可以采用DSP(Digital Signal Processing,数字信号处理)、FPGA(Field-Programmable Gate Array,现场可编程门阵列)、PLA(Programmable Logic Array,可编程逻辑阵列)中的至少一种硬件形式来实现。处理器1701也可以包括主处理器和协处理器,主处理器是用于对在唤醒状态下的数据进行处理的处理器,也称CPU(Central Processing Unit,中央处理器);协处理器是用于对在待机状态下的数据进行处理的低功耗处理器。在一些实施例中,处理器1701可以在集成有GPU(Graphics Processing Unit,图像处理器),GPU用于负责显示屏所需要显示的内容的渲染和绘制。一些实施例中,处理器1701还可以包括AI(Artificial Intelligence,人工智能)处理器,该AI处理器用于处理有关机器学习的计算操作。

存储器1702可以包括一个或多个计算机可读存储介质,该计算机可读存储介质可以是非暂态的。存储器1702还可包括高速随机存取存储器,以及非易失性存储器,比如一个或多个磁盘存储设备、闪存存储设备。在一些实施例中,存储器1702中的非暂态的计算机可读存储介质用于存储至少一个指令,该至少一个指令用于被处理器1701所执行以实现本申请中方法实施例提供的纹理数据生成方法和视频中的图形界面显示方法。

在一些实施例中,终端1700还可选包括有:外围设备接口1703和至少一个外围设备。处理器1701、存储器1702和外围设备接口1703之间可以通过总线或信号线相连。各个外围设备可以通过总线、信号线或电路板与外围设备接口1703相连。具体地,外围设备包括:射频电路1704、触摸显示屏1705、摄像头1706、音频电路1707、定位组件1708和电源1709中的至少一种。

外围设备接口1703可被用于将I/O(Input/Output,输入/输出)相关的至少一个外围设备连接到处理器1701和存储器1702。在一些实施例中,处理器1701、存储器1702和外围设备接口1703被集成在同一芯片或电路板上;在一些其他实施例中,处理器1701、存储器1702和外围设备接口1703中的任意一个或两个可以在单独的芯片或电路板上实现,本实施例对此不加以限定。

射频电路1704用于接收和发射RF(Radio Frequency,射频)信号,也称电磁信号。射频电路1704通过电磁信号与通信网络以及其他通信设备进行通信。射频电路1704将电信号转换为电磁信号进行发送,或者,将接收到的电磁信号转换为电信号。可选地,射频电路1704包括:天线系统、RF收发器、一个或多个放大器、调谐器、振荡器、数字信号处理器、编解码芯片组、用户身份模块卡等等。射频电路1704可以通过至少一种无线通信协议来与其它终端进行通信。该无线通信协议包括但不限于:城域网、各代移动通信网络(2G、3G、4G及5G)、无线局域网和/或WiFi(Wireless Fidelity,无线保真)网络。在一些实施例中,射频电路1704还可以包括NFC(Near Field Communication,近距离无线通信)有关的电路,本申请对此不加以限定。

显示屏1705用于显示UI(User Interface,用户界面)。该UI可以包括图形、文本、图标、视频及其它们的任意组合。当显示屏1705是触摸显示屏时,显示屏1705还具有采集在显示屏1705的表面或表面上方的触摸信号的能力。该触摸信号可以作为控制信号输入至处理器1701进行处理。此时,显示屏1705还可以用于提供虚拟按钮和/或虚拟键盘,也称软按钮和/或软键盘。在一些实施例中,显示屏1705可以为一个,设置终端1700的前面板;在另一些实施例中,显示屏1705可以为至少两个,分别设置在终端1700的不同表面或呈折叠设计;在再一些实施例中,显示屏1705可以是柔性显示屏,设置在终端1700的弯曲表面上或折叠面上。甚至,显示屏1705还可以设置成非矩形的不规则图形,也即异形屏。显示屏1705可以采用LCD(Liquid Crystal Display,液晶显示屏)、OLED(Organic Light-Emitting Diode,有机发光二极管)等材质制备。

摄像头组件1706用于采集图像或视频。可选地,摄像头组件1706包括前置摄像头和后置摄像头。通常,前置摄像头设置在终端的前面板,后置摄像头设置在终端的背面。在一些实施例中,后置摄像头为至少两个,分别为主摄像头、景深摄像头、广角摄像头、长焦摄像头中的任意一种,以实现主摄像头和景深摄像头融合实现背景虚化功能、主摄像头和广角摄像头融合实现全景拍摄以及VR(Virtual Reality,虚拟现实)拍摄功能或者其它融合拍摄功能。在一些实施例中,摄像头组件1706还可以包括闪光灯。闪光灯可以是单色温闪光灯,也可以是双色温闪光灯。双色温闪光灯是指暖光闪光灯和冷光闪光灯的组合,可以用于不同色温下的光线补偿。

音频电路1707可以包括麦克风和扬声器。麦克风用于采集用户及环境的声波,并将声波转换为电信号输入至处理器1701进行处理,或者输入至射频电路1704以实现语音通信。出于立体声采集或降噪的目的,麦克风可以为多个,分别设置在终端1700的不同部位。麦克风还可以是阵列麦克风或全向采集型麦克风。扬声器则用于将来自处理器1701或射频电路1704的电信号转换为声波。扬声器可以是传统的薄膜扬声器,也可以是压电陶瓷扬声器。当扬声器是压电陶瓷扬声器时,不仅可以将电信号转换为人类可听见的声波,也可以将电信号转换为人类听不见的声波以进行测距等用途。在一些实施例中,音频电路1707还可以包括耳机插孔。

定位组件1708用于定位终端1700的当前地理位置,以实现导航或LBS(Location Based Service,基于位置的服务)。定位组件1708可以是基于美国的GPS(Global Positioning System,全球定位系统)、中国的北斗系统、俄罗斯的格雷纳斯系统或欧盟的伽利略系统的定位组件。

电源1709用于为终端1700中的各个组件进行供电。电源1709可以是交流电、直流电、一次性电池或可充电电池。当电源1709包括可充电电池时,该可充电电池可以支持有线充电或无线充电。该可充电电池还可以用于支持快充技术。

在一些实施例中,终端1700还包括有一个或多个传感器1710。该一个或多个传感器1710包括但不限于:加速度传感器1711、陀螺仪传感器1712、压力传感器1713、指纹传感器1714、光学传感器1715以及接近传感器1716。

加速度传感器1711可以检测以终端1700建立的坐标系的三个坐标轴上的加速度大小。比如,加速度传感器1711可以用于检测重力加速度在三个坐标轴上的分量。处理器1701可以根据加速度传感器1711采集的重力加速度信号,控制触摸显示屏1705以横向视图或纵向视图进行用户界面的显示。加速度传感器1711还可以用于游戏或者用户的运动数据的采集。

陀螺仪传感器1712可以检测终端1700的机体方向及转动角度,陀螺仪传感器1712可以与加速度传感器1711协同采集用户对终端1700的3D动作。处理器1701根据陀螺仪传感器1712采集的数据,可以实现如下功能:动作感应(比如根据用户的倾斜操作来改变UI)、拍摄时的图像稳定、游戏控制以及惯性导航。

压力传感器1713可以设置在终端1700的侧边框和/或触摸显示屏1705的下层。当压力传感器1713设置在终端1700的侧边框时,可以检测用户对终端1700的握持信号,由处理器1701根据压力传感器1713采集的握持信号进行左右手识别或快捷操作。当压力传感器1713设置在触摸显示屏1705的下层时,由处理器1701根据用户对触摸显示屏1705的压力操作,实现对UI界面上的可操作性控件进行控制。可操作性控件包括按钮控件、滚动条控件、图标控件、菜单控件中的至少一种。

指纹传感器1714用于采集用户的指纹,由处理器1701根据指纹传感器1714采集到的指纹识别用户的身份,或者,由指纹传感器1714根据采集到的指纹识别用户的身份。在识别出用户的身份为可信身份时,由处理器1701授权该用户执行相关的敏感操作,该敏感操作包括解锁屏幕、查看加密信息、下载软件、支付及更改设置等。指纹传感器1714可以被设置终端1700的正面、背面或侧面。当终端1700上设置有物理按键或厂商Logo时,指纹传感器1714可以与物理按键或厂商Logo集成在一起。

光学传感器1715用于采集环境光强度。在一个实施例中,处理器1701可以根据光学传感器1715采集的环境光强度,控制触摸显示屏1705的显示亮度。具体地,当环境光强度较高时,调高触摸显示屏1705的显示亮度;当环境光强度较低时,调低触摸显示屏1705的显示亮度。在另一个实施例中,处理器1701还可以根据光学传感器1715采集的环境光强度,动态调整摄像头组件1706的拍摄参数。

接近传感器1716,也称距离传感器,通常设置在终端1700的前面板。接近传感器1716用于采集用户与终端1700的正面之间的距离。在一个实施例中,当接近传感器1716检测到用户与终端1700的正面之间的距离逐渐变小时,由处理器1701控制触摸显示屏1705从亮屏状态切换为息屏状态;当接近传感器1716检测到用户与终端1700的正面之间的距离逐渐变大时,由处理器1701控制触摸显示屏1705从息屏状态切换为亮屏状态。

本领域技术人员可以理解,图17中示出的结构并不构成对终端1700的限定,可以包括比图示更多或更少的组件,或者组合某些组件,或者采用不同的组件布置。

本申请一个实施例提供了一种计算机可读存储介质,所述存储介质中存储有至少一条指令、至少一段程序、代码集或指令集,所述至少一条指令、所述至少一段程序、所述代码集或指令集由处理器加载并执行以实现如上所述的纹理数据生成方法和视频中的图形界面显示方法。

本申请一个实施例提供了一种纹理数据生成设备,所述纹理数据生成设备包括处理器和存储器,所述存储器中存储有至少一条指令,所述指令由所述处理器加载并执行以实现如上所述的纹理数据生成方法。

需要说明的是:上述实施例提供的纹理数据生成装置在进行纹理数据生成时,仅以上述各功能模块的划分进行举例说明,实际应用中,可以根据需要而将上述功能分配由不同的功能模块完成,即将纹理数据生成装置的内部结构划分成不同的功能模块,以完成以上描述的全部或者部分功能。另外,上述实施例提供的纹理数据生成装置与纹理数据生成方法实施例属于同一构思,其具体实现过程详见方法实施例,这里不再赘述。

本领域普通技术人员可以理解实现上述实施例的全部或部分步骤可以通过硬件来完成,也可以通过程序来指令相关的硬件完成,所述的程序可以存储于一种计算机可读存储介质中,上述提到的存储介质可以是只读存储器,磁盘或光盘等。

以上所述并不用以限制本申请实施例,凡在本申请实施例的精神和原则之内,所作的任何修改、等同替换、改进等,均应包含在本申请实施例的保护范围之内。

当前第1页1 2 3 
网友询问留言 已有0条留言
  • 还没有人留言评论。精彩留言会获得点赞!
1