CN110322532A - 动态图像的生成方法及装置 - Google Patents
动态图像的生成方法及装置 Download PDFInfo
- Publication number
- CN110322532A CN110322532A CN201810257035.1A CN201810257035A CN110322532A CN 110322532 A CN110322532 A CN 110322532A CN 201810257035 A CN201810257035 A CN 201810257035A CN 110322532 A CN110322532 A CN 110322532A
- Authority
- CN
- China
- Prior art keywords
- video frame
- frame
- designated
- list
- video
- Prior art date
- Legal status (The legal status is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the status listed.)
- Pending
Links
Classifications
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F8/00—Arrangements for software engineering
- G06F8/30—Creation or generation of source code
- G06F8/31—Programming languages or programming paradigms
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06T—IMAGE DATA PROCESSING OR GENERATION, IN GENERAL
- G06T13/00—Animation
Landscapes
- Engineering & Computer Science (AREA)
- Software Systems (AREA)
- Theoretical Computer Science (AREA)
- General Engineering & Computer Science (AREA)
- Physics & Mathematics (AREA)
- General Physics & Mathematics (AREA)
- Computing Systems (AREA)
- Two-Way Televisions, Distribution Of Moving Picture Or The Like (AREA)
Abstract
本公开涉及动态图像的生成方法及装置。该方法包括:在浏览器中接收到针对指定视频的视频帧获取请求时,获取所述指定视频的视频帧;通过所述浏览器的canvas元素的应用程序编程接口将获取的视频帧绘制在所述canvas元素的画布中;通过所述canvas元素的应用程序编程接口将所述canvas元素的画布中的视频帧添加至帧列表;根据所述帧列表中的视频帧生成动态图像。本公开能够在HTML5环境中生成动态图像,从视频帧的获取到动态图像的生成全部在浏览器中完成,降低了生成动态图像的繁琐度,提高了生成动态图像的效率。
Description
技术领域
本公开涉及信息技术领域,尤其涉及一种动态图像的生成方法及装置。
背景技术
相关技术中,在生成动态图像时,首先需要通过客户端录屏工具对屏幕中播放的视频进行录屏,得到录屏文件,再将录屏文件导入到动态图像编辑软件中编辑得到动态图像。例如,动态图像编辑软件为GIF(Graphics Interchange Format,图像互换格式)编辑软件。相关技术中生成动态图像需要分别采用客户端录屏工具和动态图像编辑软件,较为繁琐。
发明内容
有鉴于此,本公开提出了一种动态图像的生成方法及装置。
根据本公开的一方面,提供了一种动态图像的生成方法,包括:
在浏览器中接收到针对指定视频的视频帧获取请求时,获取所述指定视频的视频帧;
通过所述浏览器的canvas元素的应用程序编程接口将获取的视频帧绘制在所述canvas元素的画布中;
通过所述canvas元素的应用程序编程接口将所述canvas元素的画布中的视频帧添加至帧列表;
根据所述帧列表中的视频帧生成动态图像。
在一种可能的实现方式中,通过所述canvas元素的应用程序编程接口将所述canvas元素的画布中的视频帧添加至帧列表,包括:
将所述canvas元素的画布中的视频帧编码为base64数据格式;
通过所述canvas元素的应用程序编程接口将所述canvas元素的画布中base64数据格式的视频帧传输至帧列表;
在所述帧列表中对base64数据格式的视频帧进行解码。
在一种可能的实现方式中,根据所述帧列表中的视频帧生成动态图像,包括:
将所述帧列表中的视频帧编码为动态图像格式的base64数据;
将所述动态图像格式的base64数据提交给服务器,以指示所述服务器生成所述帧列表中的视频帧对应的动态图像。
在一种可能的实现方式中,根据所述帧列表中的视频帧生成动态图像,包括:
将所述帧列表中的各个视频帧分别编码为base64数据格式;
将所述帧列表中base64数据格式的视频帧提交给服务器,以指示所述服务器生成所述帧列表中的视频帧对应的动态图像。
在一种可能的实现方式中,根据所述帧列表中的视频帧生成动态图像,包括:
根据编辑指令,对所述帧列表中的视频帧进行编辑;
根据编辑后的帧列表中的视频帧生成动态图像。
在一种可能的实现方式中,在浏览器中接收到针对指定视频的视频帧获取请求时,获取所述指定视频的视频帧,包括:
在浏览器中接收到针对指定视频的视频帧获取请求时,按照指定帧率获取所述视频的视频帧,直至满足停止获取条件。
在一种可能的实现方式中,所述停止获取条件包括以下至少一项:
获取的视频帧的数量达到第一阈值;
获取视频帧的持续时长达到第二阈值;
接收到针对所述指定视频的视频帧停止获取请求。
在一种可能的实现方式中,在获取所述指定视频的视频帧之前,所述方法还包括:
在所述浏览器中设置允许访问的网站的域名。
在一种可能的实现方式中,在浏览器中接收到针对指定视频的视频帧获取请求时,获取所述指定视频的视频帧,包括:
在浏览器中接收到针对指定视频的视频帧获取请求时,若所述指定视频对应的域名为允许访问的网站的域名,则获取所述指定视频的视频帧。
根据本公开的另一方面,提供了一种动态图像的生成装置,包括:
获取模块,用于在浏览器中接收到针对指定视频的视频帧获取请求时,获取所述指定视频的视频帧;
绘制模块,用于通过所述浏览器的canvas元素的应用程序编程接口将获取的视频帧绘制在所述canvas元素的画布中;
添加模块,用于通过所述canvas元素的应用程序编程接口将所述canvas元素的画布中的视频帧添加至帧列表;
生成模块,用于根据所述帧列表中的视频帧生成动态图像。
在一种可能的实现方式中,所述添加模块包括:
第一编码子模块,用于将所述canvas元素的画布中的视频帧编码为base64数据格式;
传输子模块,用于通过所述canvas元素的应用程序编程接口将所述canvas元素的画布中base64数据格式的视频帧传输至帧列表;
解码子模块,用于在所述帧列表中对base64数据格式的视频帧进行解码。
在一种可能的实现方式中,所述生成模块包括:
第二编码子模块,用于将所述帧列表中的视频帧编码为动态图像格式的base64数据;
第一提交子模块,用于将所述动态图像格式的base64数据提交给服务器,以指示所述服务器生成所述帧列表中的视频帧对应的动态图像。
在一种可能的实现方式中,所述生成模块包括:
第三编码子模块,用于将所述帧列表中的各个视频帧分别编码为base64数据格式;
第二提交子模块,用于将所述帧列表中base64数据格式的视频帧提交给服务器,以指示所述服务器生成所述帧列表中的视频帧对应的动态图像。
在一种可能的实现方式中,所述生成模块包括:
编辑子模块,用于根据编辑指令,对所述帧列表中的视频帧进行编辑;
生成子模块,用于根据编辑后的帧列表中的视频帧生成动态图像。
在一种可能的实现方式中,所述获取模块用于:
在浏览器中接收到针对指定视频的视频帧获取请求时,按照指定帧率获取所述视频的视频帧,直至满足停止获取条件。
在一种可能的实现方式中,所述停止获取条件包括以下至少一项:
获取的视频帧的数量达到第一阈值;
获取视频帧的持续时长达到第二阈值;
接收到针对所述指定视频的视频帧停止获取请求。
在一种可能的实现方式中,所述装置还包括:
设置模块,用于在所述浏览器中设置允许访问的网站的域名。
在一种可能的实现方式中,所述获取模块用于:
在浏览器中接收到针对指定视频的视频帧获取请求时,若所述指定视频对应的域名为允许访问的网站的域名,则获取所述指定视频的视频帧。
在一种可能的实现方式中,
根据本公开的另一方面,提供了一种动态图像的生成装置,包括:处理器;用于存储处理器可执行指令的存储器;其中,所述处理器被配置为执行上述方法。
根据本公开的另一方面,提供了一种非易失性计算机可读存储介质,其上存储有计算机程序指令,其中,所述计算机程序指令被处理器执行时实现上述方法。
本公开的各方面的动态图像的生成方法及装置通过在浏览器中接收到针对指定视频的视频帧获取请求时,获取指定视频的视频帧,通过浏览器的canvas元素的应用程序编程接口将获取的视频帧绘制在canvas元素的画布中,通过canvas元素的应用程序编程接口将canvas元素的画布中的视频帧添加至帧列表,并根据帧列表中的视频帧生成动态图像,由此能够在HTML5环境中生成动态图像,从视频帧的获取到动态图像的生成全部在浏览器中完成,降低了生成动态图像的繁琐度,提高了生成动态图像的效率。
根据下面参考附图对示例性实施例的详细说明,本公开的其它特征及方面将变得清楚。
附图说明
包含在说明书中并且构成说明书的一部分的附图与说明书一起示出了本公开的示例性实施例、特征和方面,并且用于解释本公开的原理。
图1示出根据本公开一实施例的动态图像的生成方法的流程图。
图2示出根据本公开一实施例的动态图像的生成方法步骤S13的一示例性的流程图。
图3示出根据本公开一实施例的动态图像的生成方法步骤S14的一示例性的流程图。
图4示出根据本公开一实施例的动态图像的生成方法步骤S14的另一示例性的流程图。
图5示出根据本公开一实施例的动态图像的生成方法步骤S14的另一示例性的流程图。
图6示出根据本公开一实施例的动态图像的生成方法的一示例性的流程图。
图7示出根据本公开一实施例的动态图像的生成装置的框图。
图8示出根据本公开一实施例的动态图像的生成装置的一示例性的框图。
图9是根据一示例性实施例示出的一种用于动态图像的生成的装置800的框图。
具体实施方式
以下将参考附图详细说明本公开的各种示例性实施例、特征和方面。附图中相同的附图标记表示功能相同或相似的元件。尽管在附图中示出了实施例的各种方面,但是除非特别指出,不必按比例绘制附图。
在这里专用的词“示例性”意为“用作例子、实施例或说明性”。这里作为“示例性”所说明的任何实施例不必解释为优于或好于其它实施例。
另外,为了更好的说明本公开,在下文的具体实施方式中给出了众多的具体细节。本领域技术人员应当理解,没有某些具体细节,本公开同样可以实施。在一些实例中,对于本领域技术人员熟知的方法、手段、元件和电路未作详细描述,以便于凸显本公开的主旨。
图1示出根据本公开一实施例的动态图像的生成方法的流程图。该方法可以应用于手机或者平板电脑等终端设备中。如图1所示,该方法包括步骤S11至步骤S14。
在步骤S11中,在浏览器中接收到针对指定视频的视频帧获取请求时,获取指定视频的视频帧。
本实施例中的浏览器可以为支持HTML5(HyperText Markup Language5,超文本标记语言第5版本)的浏览器。
在一种可能的实现方式中,在浏览器中接收到针对指定视频的视频帧获取请求时,获取指定视频的视频帧,包括:在浏览器中接收到针对指定视频的视频帧获取请求时,按照指定帧率获取视频的视频帧,直至满足停止获取条件。例如,指定帧率为4帧/秒。
在一种可能的实现方式中,停止获取条件包括以下至少一项:获取的视频帧的数量达到第一阈值;获取视频帧的持续时长达到第二阈值;接收到针对指定视频的视频帧停止获取请求。
作为该实现方式的一个示例,停止获取条件为:接收到针对指定视频的视频帧停止获取请求。
作为该实现方式的另一个示例,停止获取条件为:获取的视频帧的数量达到第一阈值。
作为该实现方式的另一个示例,停止获取条件为:获取视频帧的持续时长达到第二阈值。
作为该实现方式的另一个示例,停止获取条件为:获取的视频帧的数量达到第一阈值,且获取视频帧的持续时长达到第二阈值。
在一种可能的实现方式中,在浏览器中接收到针对指定视频的视频帧获取请求时,获取指定视频的视频帧,包括:在浏览器中接收到针对指定视频的视频帧获取请求时,若指定视频对应的域名为允许访问的网站的域名,则获取指定视频的视频帧。在该实现方式中,指定视频对应的存储服务器需要支持资源的跨域访问。在该实现方式中,若指定视频对应的域名为允许访问的网站的域名,则可以获取指定视频的视频帧;若指定视频对应的域名不为允许访问的网站的域名,则可以禁止获取指定视频的视频帧。
在步骤S12中,通过浏览器的canvas元素的应用程序编程接口将获取的视频帧绘制在canvas元素的画布中。
其中,canvas元素是HTML5中用于绘制图形的元素。
在一种可能的实现方式中,通过浏览器的canvas元素的应用程序编程接口将获取的视频帧绘制在canvas元素的画布中,可以包括:通过浏览器的canvas元素的应用程序编程接口,按照指定帧率将获取的视频帧绘制在canvas元素的画布中。
在步骤S13中,通过canvas元素的应用程序编程接口将canvas元素的画布中的视频帧添加至帧列表。
在一种可能的实现方式中,可以通过canvas元素的toDataURL的应用程序编程接口将canvas元素的画布中的视频帧添加至帧列表。
在步骤S14中,根据帧列表中的视频帧生成动态图像。
其中,动态图像可以为GIF格式等动态图像个数。
在本实施例中,可以由终端设备根据帧列表中的视频帧生成动态图像,也可以将帧列表中的视频帧发送至服务器,由服务器生成动态图像,在此不作限定。
本实施例通过在浏览器中接收到针对指定视频的视频帧获取请求时,获取指定视频的视频帧,通过浏览器的canvas元素的应用程序编程接口将获取的视频帧绘制在canvas元素的画布中,通过canvas元素的应用程序编程接口将canvas元素的画布中的视频帧添加至帧列表,并根据帧列表中的视频帧生成动态图像,由此能够在HTML5环境中生成动态图像,从视频帧的获取到动态图像的生成全部在浏览器中完成,降低了生成动态图像的繁琐度,提高了生成动态图像的效率。
图2示出根据本公开一实施例的动态图像的生成方法步骤S13的一示例性的流程图。如图2所示,步骤S13可以包括步骤S131至步骤S133。
在步骤S131中,将canvas元素的画布中的视频帧编码为base64数据格式。
在本实施例中,base64是用于传输8比特字节码的编码方式。
在步骤S132中,通过canvas元素的应用程序编程接口将canvas元素的画布中base64数据格式的视频帧传输至帧列表。
在步骤S133中,在帧列表中对base64数据格式的视频帧进行解码。
本实施例通过将canvas元素的画布中的视频帧编码为base64数据格式,通过canvas元素的应用程序编程接口将canvas元素的画布中base64数据格式的视频帧传输至帧列表,并在帧列表中对base64数据格式的视频帧进行解码,由此使用base64数据在canvas元素的画布与帧列表之间进行视频帧的传输,从而能够避免视频帧的泄露,提高数据传输的安全性。
图3示出根据本公开一实施例的动态图像的生成方法步骤S14的一示例性的流程图。如图3所示,步骤S14可以包括步骤S141和步骤S142。
在步骤S141中,将帧列表中的视频帧编码为动态图像格式的base64数据。
在步骤S142中,将动态图像格式的base64数据提交给服务器,以指示服务器生成帧列表中的视频帧对应的动态图像。
本实施例通过将帧列表中的视频帧编码为动态图像格式的base64数据,并将动态图像格式的base64数据提交给服务器,由此使用base64数据在终端设备与服务器之间进行数据传输,能够避免数据泄露,提高数据传输的安全性。
图4示出根据本公开一实施例的动态图像的生成方法步骤S14的另一示例性的流程图。如图4所示,步骤S14可以包括步骤S143和步骤S144。
在步骤S143中,将帧列表中的各个视频帧分别编码为base64数据格式。
在步骤S144中,将帧列表中base64数据格式的视频帧提交给服务器,以指示服务器生成帧列表中的视频帧对应的动态图像。
本实施例通过将帧列表中的各个视频帧分别编码为base64数据格式,并将将帧列表中base64数据格式的视频帧提交给服务器,由此使用base64数据在终端设备与服务器之间进行数据传输,能够避免数据泄露。
图5示出根据本公开一实施例的动态图像的生成方法步骤S14的另一示例性的流程图。如图5所示,步骤S14可以包括步骤S145和步骤S146。
在步骤S145中,根据编辑指令,对帧列表中的视频帧进行编辑。
在一种可能的实现方式中,对帧列表中的视频帧进行编辑,可以包括:在帧列表中增加视频帧。
在另一种可能的实现方式中,对帧列表中的视频帧进行编辑,可以包括:在帧列表中删除视频帧。
在另一种可能的实现方式中,对帧列表中的视频帧进行编辑,可以包括:对帧列表中的视频帧进行参数调整。
作为该实现方式的一个示例,对帧列表中的视频帧进行参数调整,可以包括:对帧列表中的视频帧进行裁剪。
作为该实现方式的另一个示例,对帧列表中的视频帧进行参数调整,可以包括:对帧列表中的视频帧进行横向拉伸。
作为该实现方式的另一个示例,对帧列表中的视频帧进行参数调整,可以包括:对帧列表中的视频帧进行纵向拉伸。
作为该实现方式的另一个示例,对帧列表中的视频帧进行参数调整,可以包括:调整帧列表中的视频帧的颜色、亮度和分辨率等中的一项或多项。
在一种可能的实现方式中,该方法还可以包括:在帧列表中显示各个视频帧的尺寸。
在一种可能的实现方式中,该方法还可以包括:按照帧列表中的各个视频帧在指定视频中的时间由前到后的顺序,在帧列表中显示各个视频帧。
在一种可能的实现方式中,该方法还可以包括:在帧列表对应的界面中显示根据该帧列表中的视频帧生成的动态图像的预览图。
在步骤S146中,根据编辑后的帧列表中的视频帧生成动态图像。
在一种可能的实现方式中,根据编辑后的帧列表中的视频帧生成动态图像,包括:由终端设备根据编辑后的帧列表中的视频帧生成动态图像。
在另一种可能的实现方式中,根据编辑后的帧列表中的视频帧生成动态图像,包括:将编辑后的帧列表中的视频帧编码为动态图像格式的base64数据;将动态图像格式的base64数据提交给服务器,以指示服务器生成帧列表中的视频帧对应的动态图像。
在另一种可能的实现方式中,根据编辑后的帧列表中的视频帧生成动态图像,包括:将编辑后的帧列表中的各个视频帧分别编码为base64数据格式;将帧列表中base64数据格式的视频帧提交给服务器,以指示服务器生成帧列表中的视频帧对应的动态图像。
图6示出根据本公开一实施例的动态图像的生成方法的一示例性的流程图。如图6所示,该方法可以包括步骤S61至步骤S65。
在步骤S61中,在浏览器中设置允许访问的网站的域名。
在本实施例中,可以在浏览器的跨域设置中设置允许访问的网站的域名。
在步骤S62中,在浏览器中接收到针对指定视频的视频帧获取请求时,获取指定视频的视频帧。
在一种可能的实现方式中,在浏览器中接收到针对指定视频的视频帧获取请求时,获取指定视频的视频帧,包括:在浏览器中接收到针对指定视频的视频帧获取请求时,若指定视频对应的域名为允许访问的网站的域名,则获取指定视频的视频帧。
在步骤S63中,通过浏览器的canvas元素的应用程序编程接口将获取的视频帧绘制在canvas元素的画布中。
其中,对步骤S63参见上文对步骤S12的描述。
在步骤S64中,通过canvas元素的应用程序编程接口将canvas元素的画布中的视频帧添加至帧列表。
其中,对步骤S64参见上文对步骤S13的描述。
在步骤S65中,根据帧列表中的视频帧生成动态图像。
其中,对步骤S65参见上文对步骤S14的描述。
图7示出根据本公开一实施例的动态图像的生成装置的框图。如图7所示,该装置包括:获取模块71,用于在浏览器中接收到针对指定视频的视频帧获取请求时,获取指定视频的视频帧;绘制模块72,用于通过浏览器的canvas元素的应用程序编程接口将获取的视频帧绘制在canvas元素的画布中;添加模块73,用于通过canvas元素的应用程序编程接口将canvas元素的画布中的视频帧添加至帧列表;生成模块74,用于根据帧列表中的视频帧生成动态图像。
图8示出根据本公开一实施例的动态图像的生成装置的一示例性的框图。如图8所示:
在一种可能的实现方式中,添加模块73包括:第一编码子模块731,用于将canvas元素的画布中的视频帧编码为base64数据格式;传输子模块732,用于通过canvas元素的应用程序编程接口将canvas元素的画布中base64数据格式的视频帧传输至帧列表;解码子模块733,用于在帧列表中对base64数据格式的视频帧进行解码。
在一种可能的实现方式中,生成模块74包括:第二编码子模块741,用于将帧列表中的视频帧编码为动态图像格式的base64数据;第一提交子模块742,用于将动态图像格式的base64数据提交给服务器,以指示服务器生成帧列表中的视频帧对应的动态图像。
在一种可能的实现方式中,生成模块74包括:第三编码子模块743,用于将帧列表中的各个视频帧分别编码为base64数据格式;第二提交子模块744,用于将帧列表中base64数据格式的视频帧提交给服务器,以指示服务器生成帧列表中的视频帧对应的动态图像。
在一种可能的实现方式中,生成模块74包括:编辑子模块745,用于根据编辑指令,对帧列表中的视频帧进行编辑;生成子模块746,用于根据编辑后的帧列表中的视频帧生成动态图像。
在一种可能的实现方式中,获取模块71用于:在浏览器中接收到针对指定视频的视频帧获取请求时,按照指定帧率获取视频的视频帧,直至满足停止获取条件。
在一种可能的实现方式中,停止获取条件包括以下至少一项:获取的视频帧的数量达到第一阈值;获取视频帧的持续时长达到第二阈值;接收到针对指定视频的视频帧停止获取请求。
在一种可能的实现方式中,该装置还包括:设置模块75,用于在浏览器中设置允许访问的网站的域名。
在一种可能的实现方式中,获取模块71用于:在浏览器中接收到针对指定视频的视频帧获取请求时,若指定视频对应的域名为允许访问的网站的域名,则获取指定视频的视频帧。
本实施例通过在浏览器中接收到针对指定视频的视频帧获取请求时,获取指定视频的视频帧,通过浏览器的canvas元素的应用程序编程接口将获取的视频帧绘制在canvas元素的画布中,通过canvas元素的应用程序编程接口将canvas元素的画布中的视频帧添加至帧列表,并根据帧列表中的视频帧生成动态图像,由此能够在HTML5环境中生成动态图像,从视频帧的获取到动态图像的生成全部在浏览器中完成,降低了生成动态图像的繁琐度,提高了生成动态图像的效率。
图9是根据一示例性实施例示出的一种用于动态图像的生成的装置800的框图。例如,装置800可以是移动电话,计算机,数字广播终端,消息收发设备,游戏控制台,平板设备,医疗设备,健身设备,个人数字助理等。
参照图9,装置800可以包括以下一个或多个组件:处理组件802,存储器804,电源组件806,多媒体组件808,音频组件810,输入/输出(I/O)的接口812,传感器组件814,以及通信组件816。
处理组件802通常控制装置800的整体操作,诸如与显示,电话呼叫,数据通信,相机操作和记录操作相关联的操作。处理组件802可以包括一个或多个处理器820来执行指令,以完成上述的方法的全部或部分步骤。此外,处理组件802可以包括一个或多个模块,便于处理组件802和其他组件之间的交互。例如,处理组件802可以包括多媒体模块,以方便多媒体组件808和处理组件802之间的交互。
存储器804被配置为存储各种类型的数据以支持在装置800的操作。这些数据的示例包括用于在装置800上操作的任何应用程序或方法的指令,联系人数据,电话簿数据,消息,图片,视频等。存储器804可以由任何类型的易失性或非易失性存储设备或者它们的组合实现,如静态随机存取存储器(SRAM),电可擦除可编程只读存储器(EEPROM),可擦除可编程只读存储器(EPROM),可编程只读存储器(PROM),只读存储器(ROM),磁存储器,快闪存储器,磁盘或光盘。
电源组件806为装置800的各种组件提供电力。电源组件806可以包括电源管理系统,一个或多个电源,及其他与为装置800生成、管理和分配电力相关联的组件。
多媒体组件808包括在所述装置800和用户之间的提供一个输出接口的屏幕。在一些实施例中,屏幕可以包括液晶显示器(LCD)和触摸面板(TP)。如果屏幕包括触摸面板,屏幕可以被实现为触摸屏,以接收来自用户的输入信号。触摸面板包括一个或多个触摸传感器以感测触摸、滑动和触摸面板上的手势。所述触摸传感器可以不仅感测触摸或滑动动作的边界,而且还检测与所述触摸或滑动操作相关的持续时间和压力。在一些实施例中,多媒体组件808包括一个前置摄像头和/或后置摄像头。当装置800处于操作模式,如拍摄模式或视频模式时,前置摄像头和/或后置摄像头可以接收外部的多媒体数据。每个前置摄像头和后置摄像头可以是一个固定的光学透镜系统或具有焦距和光学变焦能力。
音频组件810被配置为输出和/或输入音频信号。例如,音频组件810包括一个麦克风(MIC),当装置800处于操作模式,如呼叫模式、记录模式和语音识别模式时,麦克风被配置为接收外部音频信号。所接收的音频信号可以被进一步存储在存储器804或经由通信组件816发送。在一些实施例中,音频组件810还包括一个扬声器,用于输出音频信号。
I/O接口812为处理组件802和外围接口模块之间提供接口,上述外围接口模块可以是键盘,点击轮,按钮等。这些按钮可包括但不限于:主页按钮、音量按钮、启动按钮和锁定按钮。
传感器组件814包括一个或多个传感器,用于为装置800提供各个方面的状态评估。例如,传感器组件814可以检测到装置800的打开/关闭状态,组件的相对定位,例如所述组件为装置800的显示器和小键盘,传感器组件814还可以检测装置800或装置800一个组件的位置改变,用户与装置800接触的存在或不存在,装置800方位或加速/减速和装置800的温度变化。传感器组件814可以包括接近传感器,被配置用来在没有任何的物理接触时检测附近物体的存在。传感器组件814还可以包括光传感器,如CMOS或CCD图像传感器,用于在成像应用中使用。在一些实施例中,该传感器组件814还可以包括加速度传感器,陀螺仪传感器,磁传感器,压力传感器或温度传感器。
通信组件816被配置为便于装置800和其他设备之间有线或无线方式的通信。装置800可以接入基于通信标准的无线网络,如WiFi,2G或3G,或它们的组合。在一个示例性实施例中,通信组件816经由广播信道接收来自外部广播管理系统的广播信号或广播相关信息。在一个示例性实施例中,所述通信组件816还包括近场通信(NFC)模块,以促进短程通信。例如,在NFC模块可基于射频识别(RFID)技术,红外数据协会(IrDA)技术,超宽带(UWB)技术,蓝牙(BT)技术和其他技术来实现。
在示例性实施例中,装置800可以被一个或多个应用专用集成电路(ASIC)、数字信号处理器(DSP)、数字信号处理设备(DSPD)、可编程逻辑器件(PLD)、现场可编程门阵列(FPGA)、控制器、微控制器、微处理器或其他电子元件实现,用于执行上述方法。
在示例性实施例中,还提供了一种非易失性计算机可读存储介质,例如包括计算机程序指令的存储器804,上述计算机程序指令可由装置800的处理器820执行以完成上述方法。
本公开可以是系统、方法和/或计算机程序产品。计算机程序产品可以包括计算机可读存储介质,其上载有用于使处理器实现本公开的各个方面的计算机可读程序指令。
计算机可读存储介质可以是可以保持和存储由指令执行设备使用的指令的有形设备。计算机可读存储介质例如可以是――但不限于――电存储设备、磁存储设备、光存储设备、电磁存储设备、半导体存储设备或者上述的任意合适的组合。计算机可读存储介质的更具体的例子(非穷举的列表)包括:便携式计算机盘、硬盘、随机存取存储器(RAM)、只读存储器(ROM)、可擦式可编程只读存储器(EPROM或闪存)、静态随机存取存储器(SRAM)、便携式压缩盘只读存储器(CD-ROM)、数字多功能盘(DVD)、记忆棒、软盘、机械编码设备、例如其上存储有指令的打孔卡或凹槽内凸起结构、以及上述的任意合适的组合。这里所使用的计算机可读存储介质不被解释为瞬时信号本身,诸如无线电波或者其他自由传播的电磁波、通过波导或其他传输媒介传播的电磁波(例如,通过光纤电缆的光脉冲)、或者通过电线传输的电信号。
这里所描述的计算机可读程序指令可以从计算机可读存储介质下载到各个计算/处理设备,或者通过网络、例如因特网、局域网、广域网和/或无线网下载到外部计算机或外部存储设备。网络可以包括铜传输电缆、光纤传输、无线传输、路由器、防火墙、交换机、网关计算机和/或边缘服务器。每个计算/处理设备中的网络适配卡或者网络接口从网络接收计算机可读程序指令,并转发该计算机可读程序指令,以供存储在各个计算/处理设备中的计算机可读存储介质中。
用于执行本公开操作的计算机程序指令可以是汇编指令、指令集架构(ISA)指令、机器指令、机器相关指令、微代码、固件指令、状态设置数据、或者以一种或多种编程语言的任意组合编写的源代码或目标代码,所述编程语言包括面向对象的编程语言—诸如Smalltalk、C++等,以及常规的过程式编程语言—诸如“C”语言或类似的编程语言。计算机可读程序指令可以完全地在用户计算机上执行、部分地在用户计算机上执行、作为一个独立的软件包执行、部分在用户计算机上部分在远程计算机上执行、或者完全在远程计算机或服务器上执行。在涉及远程计算机的情形中,远程计算机可以通过任意种类的网络—包括局域网(LAN)或广域网(WAN)—连接到用户计算机,或者,可以连接到外部计算机(例如利用因特网服务提供商来通过因特网连接)。在一些实施例中,通过利用计算机可读程序指令的状态信息来个性化定制电子电路,例如可编程逻辑电路、现场可编程门阵列(FPGA)或可编程逻辑阵列(PLA),该电子电路可以执行计算机可读程序指令,从而实现本公开的各个方面。
这里参照根据本公开实施例的方法、装置(系统)和计算机程序产品的流程图和/或框图描述了本公开的各个方面。应当理解,流程图和/或框图的每个方框以及流程图和/或框图中各方框的组合,都可以由计算机可读程序指令实现。
这些计算机可读程序指令可以提供给通用计算机、专用计算机或其它可编程数据处理装置的处理器,从而生产出一种机器,使得这些指令在通过计算机或其它可编程数据处理装置的处理器执行时,产生了实现流程图和/或框图中的一个或多个方框中规定的功能/动作的装置。也可以把这些计算机可读程序指令存储在计算机可读存储介质中,这些指令使得计算机、可编程数据处理装置和/或其他设备以特定方式工作,从而,存储有指令的计算机可读介质则包括一个制造品,其包括实现流程图和/或框图中的一个或多个方框中规定的功能/动作的各个方面的指令。
也可以把计算机可读程序指令加载到计算机、其它可编程数据处理装置、或其它设备上,使得在计算机、其它可编程数据处理装置或其它设备上执行一系列操作步骤,以产生计算机实现的过程,从而使得在计算机、其它可编程数据处理装置、或其它设备上执行的指令实现流程图和/或框图中的一个或多个方框中规定的功能/动作。
附图中的流程图和框图显示了根据本公开的多个实施例的系统、方法和计算机程序产品的可能实现的体系架构、功能和操作。在这点上,流程图或框图中的每个方框可以代表一个模块、程序段或指令的一部分,所述模块、程序段或指令的一部分包含一个或多个用于实现规定的逻辑功能的可执行指令。在有些作为替换的实现中,方框中所标注的功能也可以以不同于附图中所标注的顺序发生。例如,两个连续的方框实际上可以基本并行地执行,它们有时也可以按相反的顺序执行,这依所涉及的功能而定。也要注意的是,框图和/或流程图中的每个方框、以及框图和/或流程图中的方框的组合,可以用执行规定的功能或动作的专用的基于硬件的系统来实现,或者可以用专用硬件与计算机指令的组合来实现。
以上已经描述了本公开的各实施例,上述说明是示例性的,并非穷尽性的,并且也不限于所披露的各实施例。在不偏离所说明的各实施例的范围和精神的情况下,对于本技术领域的普通技术人员来说许多修改和变更都是显而易见的。本文中所用术语的选择,旨在最好地解释各实施例的原理、实际应用或对市场中的技术的技术改进,或者使本技术领域的其它普通技术人员能理解本文披露的各实施例。
Claims (20)
1.一种动态图像的生成方法,其特征在于,包括:
在浏览器中接收到针对指定视频的视频帧获取请求时,获取所述指定视频的视频帧;
通过所述浏览器的canvas元素的应用程序编程接口将获取的视频帧绘制在所述canvas元素的画布中;
通过所述canvas元素的应用程序编程接口将所述canvas元素的画布中的视频帧添加至帧列表;
根据所述帧列表中的视频帧生成动态图像。
2.根据权利要求1所述的方法,其特征在于,通过所述canvas元素的应用程序编程接口将所述canvas元素的画布中的视频帧添加至帧列表,包括:
将所述canvas元素的画布中的视频帧编码为base64数据格式;
通过所述canvas元素的应用程序编程接口将所述canvas元素的画布中base64数据格式的视频帧传输至帧列表;
在所述帧列表中对base64数据格式的视频帧进行解码。
3.根据权利要求1所述的方法,其特征在于,根据所述帧列表中的视频帧生成动态图像,包括:
将所述帧列表中的视频帧编码为动态图像格式的base64数据;
将所述动态图像格式的base64数据提交给服务器,以指示所述服务器生成所述帧列表中的视频帧对应的动态图像。
4.根据权利要求1所述的方法,其特征在于,根据所述帧列表中的视频帧生成动态图像,包括:
将所述帧列表中的各个视频帧分别编码为base64数据格式;
将所述帧列表中base64数据格式的视频帧提交给服务器,以指示所述服务器生成所述帧列表中的视频帧对应的动态图像。
5.根据权利要求1所述的方法,其特征在于,根据所述帧列表中的视频帧生成动态图像,包括:
根据编辑指令,对所述帧列表中的视频帧进行编辑;
根据编辑后的帧列表中的视频帧生成动态图像。
6.根据权利要求1所述的方法,其特征在于,在浏览器中接收到针对指定视频的视频帧获取请求时,获取所述指定视频的视频帧,包括:
在浏览器中接收到针对指定视频的视频帧获取请求时,按照指定帧率获取所述视频的视频帧,直至满足停止获取条件。
7.根据权利要求6所述的方法,其特征在于,所述停止获取条件包括以下至少一项:
获取的视频帧的数量达到第一阈值;
获取视频帧的持续时长达到第二阈值;
接收到针对所述指定视频的视频帧停止获取请求。
8.根据权利要求1所述的方法,其特征在于,在获取所述指定视频的视频帧之前,所述方法还包括:
在所述浏览器中设置允许访问的网站的域名。
9.根据权利要求1或8所述的方法,其特征在于,在浏览器中接收到针对指定视频的视频帧获取请求时,获取所述指定视频的视频帧,包括:
在浏览器中接收到针对指定视频的视频帧获取请求时,若所述指定视频对应的域名为允许访问的网站的域名,则获取所述指定视频的视频帧。
10.一种动态图像的生成装置,其特征在于,包括:
获取模块,用于在浏览器中接收到针对指定视频的视频帧获取请求时,获取所述指定视频的视频帧;
绘制模块,用于通过所述浏览器的canvas元素的应用程序编程接口将获取的视频帧绘制在所述canvas元素的画布中;
添加模块,用于通过所述canvas元素的应用程序编程接口将所述canvas元素的画布中的视频帧添加至帧列表;
生成模块,用于根据所述帧列表中的视频帧生成动态图像。
11.根据权利要求10所述的装置,其特征在于,所述添加模块包括:
第一编码子模块,用于将所述canvas元素的画布中的视频帧编码为base64数据格式;
传输子模块,用于通过所述canvas元素的应用程序编程接口将所述canvas元素的画布中base64数据格式的视频帧传输至帧列表;
解码子模块,用于在所述帧列表中对base64数据格式的视频帧进行解码。
12.根据权利要求10所述的装置,其特征在于,所述生成模块包括:
第二编码子模块,用于将所述帧列表中的视频帧编码为动态图像格式的base64数据;
第一提交子模块,用于将所述动态图像格式的base64数据提交给服务器,以指示所述服务器生成所述帧列表中的视频帧对应的动态图像。
13.根据权利要求10所述的装置,其特征在于,所述生成模块包括:
第三编码子模块,用于将所述帧列表中的各个视频帧分别编码为base64数据格式;
第二提交子模块,用于将所述帧列表中base64数据格式的视频帧提交给服务器,以指示所述服务器生成所述帧列表中的视频帧对应的动态图像。
14.根据权利要求10所述的装置,其特征在于,所述生成模块包括:
编辑子模块,用于根据编辑指令,对所述帧列表中的视频帧进行编辑;
生成子模块,用于根据编辑后的帧列表中的视频帧生成动态图像。
15.根据权利要求10所述的装置,其特征在于,所述获取模块用于:
在浏览器中接收到针对指定视频的视频帧获取请求时,按照指定帧率获取所述视频的视频帧,直至满足停止获取条件。
16.根据权利要求15所述的装置,其特征在于,所述停止获取条件包括以下至少一项:
获取的视频帧的数量达到第一阈值;
获取视频帧的持续时长达到第二阈值;
接收到针对所述指定视频的视频帧停止获取请求。
17.根据权利要求10所述的装置,其特征在于,所述装置还包括:
设置模块,用于在所述浏览器中设置允许访问的网站的域名。
18.根据权利要求10或17所述的装置,其特征在于,所述获取模块用于:
在浏览器中接收到针对指定视频的视频帧获取请求时,若所述指定视频对应的域名为允许访问的网站的域名,则获取所述指定视频的视频帧。
19.一种动态图像的生成装置,其特征在于,包括:
处理器;
用于存储处理器可执行指令的存储器;
其中,所述处理器被配置为执行权利要求1至9中任意一项所述的方法。
20.一种非易失性计算机可读存储介质,其上存储有计算机程序指令,其特征在于,所述计算机程序指令被处理器执行时实现权利要求1至9中任意一项所述的方法。
Priority Applications (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN201810257035.1A CN110322532A (zh) | 2018-03-27 | 2018-03-27 | 动态图像的生成方法及装置 |
Applications Claiming Priority (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN201810257035.1A CN110322532A (zh) | 2018-03-27 | 2018-03-27 | 动态图像的生成方法及装置 |
Publications (1)
Publication Number | Publication Date |
---|---|
CN110322532A true CN110322532A (zh) | 2019-10-11 |
Family
ID=68109530
Family Applications (1)
Application Number | Title | Priority Date | Filing Date |
---|---|---|---|
CN201810257035.1A Pending CN110322532A (zh) | 2018-03-27 | 2018-03-27 | 动态图像的生成方法及装置 |
Country Status (1)
Country | Link |
---|---|
CN (1) | CN110322532A (zh) |
Cited By (6)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN111163358A (zh) * | 2020-01-07 | 2020-05-15 | 广州虎牙科技有限公司 | Gif图像生成方法、装置、服务器及存储介质 |
CN113409426A (zh) * | 2021-06-29 | 2021-09-17 | 平安养老保险股份有限公司 | 动态图像播放方法、装置、计算机设备和可读存储介质 |
CN113516740A (zh) * | 2020-04-10 | 2021-10-19 | 阿里巴巴集团控股有限公司 | 添加静态元素的方法、装置及电子设备 |
CN113676677A (zh) * | 2021-10-22 | 2021-11-19 | 深圳市明源云空间电子商务有限公司 | 动态图片合成方法、装置、电子设备及可读存储介质 |
CN113938619A (zh) * | 2021-10-28 | 2022-01-14 | 稿定(厦门)科技有限公司 | 一种基于浏览器的视频合成方法、系统、储存装置 |
WO2022151688A1 (zh) * | 2021-01-18 | 2022-07-21 | 稿定(厦门)科技有限公司 | 视频预览播放方法及装置 |
Citations (5)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
US20120256928A1 (en) * | 2011-04-07 | 2012-10-11 | Adobe Systems Incorporated | Methods and Systems for Representing Complex Animation Using Scripting Capabilities of Rendering Applications |
CN104598902A (zh) * | 2015-01-29 | 2015-05-06 | 百度在线网络技术(北京)有限公司 | 一种用于识别截图的方法、装置和浏览器 |
CN105204853A (zh) * | 2015-09-14 | 2015-12-30 | 新浪网技术(中国)有限公司 | 一种网页浏览器的Canvas绘图方法及装置 |
CN107610207A (zh) * | 2017-10-23 | 2018-01-19 | 北京奇艺世纪科技有限公司 | 一种生成gif图片的方法、装置及系统 |
WO2018050003A1 (zh) * | 2016-09-14 | 2018-03-22 | 阿里巴巴集团控股有限公司 | 3D canvas网页元素的渲染方法、装置及电子设备 |
-
2018
- 2018-03-27 CN CN201810257035.1A patent/CN110322532A/zh active Pending
Patent Citations (5)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
US20120256928A1 (en) * | 2011-04-07 | 2012-10-11 | Adobe Systems Incorporated | Methods and Systems for Representing Complex Animation Using Scripting Capabilities of Rendering Applications |
CN104598902A (zh) * | 2015-01-29 | 2015-05-06 | 百度在线网络技术(北京)有限公司 | 一种用于识别截图的方法、装置和浏览器 |
CN105204853A (zh) * | 2015-09-14 | 2015-12-30 | 新浪网技术(中国)有限公司 | 一种网页浏览器的Canvas绘图方法及装置 |
WO2018050003A1 (zh) * | 2016-09-14 | 2018-03-22 | 阿里巴巴集团控股有限公司 | 3D canvas网页元素的渲染方法、装置及电子设备 |
CN107610207A (zh) * | 2017-10-23 | 2018-01-19 | 北京奇艺世纪科技有限公司 | 一种生成gif图片的方法、装置及系统 |
Non-Patent Citations (1)
Title |
---|
姜永生: "《多媒体技术与应用》", 28 February 2017 * |
Cited By (6)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN111163358A (zh) * | 2020-01-07 | 2020-05-15 | 广州虎牙科技有限公司 | Gif图像生成方法、装置、服务器及存储介质 |
CN113516740A (zh) * | 2020-04-10 | 2021-10-19 | 阿里巴巴集团控股有限公司 | 添加静态元素的方法、装置及电子设备 |
WO2022151688A1 (zh) * | 2021-01-18 | 2022-07-21 | 稿定(厦门)科技有限公司 | 视频预览播放方法及装置 |
CN113409426A (zh) * | 2021-06-29 | 2021-09-17 | 平安养老保险股份有限公司 | 动态图像播放方法、装置、计算机设备和可读存储介质 |
CN113676677A (zh) * | 2021-10-22 | 2021-11-19 | 深圳市明源云空间电子商务有限公司 | 动态图片合成方法、装置、电子设备及可读存储介质 |
CN113938619A (zh) * | 2021-10-28 | 2022-01-14 | 稿定(厦门)科技有限公司 | 一种基于浏览器的视频合成方法、系统、储存装置 |
Similar Documents
Publication | Publication Date | Title |
---|---|---|
CN110322532A (zh) | 动态图像的生成方法及装置 | |
CN106126420B (zh) | 应用程序调试方法及装置 | |
CN109963166A (zh) | 在线视频编辑方法和装置 | |
CN109257645A (zh) | 视频封面生成方法及装置 | |
CN108833939A (zh) | 生成视频的海报的方法及装置 | |
CN108259991A (zh) | 视频处理方法及装置 | |
CN109963200A (zh) | 视频播放方法及装置 | |
CN109887515A (zh) | 音频处理方法及装置、电子设备和存储介质 | |
CN108737891A (zh) | 视频素材处理方法及装置 | |
CN110519655A (zh) | 视频剪辑方法及装置 | |
CN109407944A (zh) | 多媒体资源播放调节方法及装置 | |
CN106658215A (zh) | 推送直播文件的方法及装置 | |
CN110121106A (zh) | 视频播放方法及装置 | |
CN108881952A (zh) | 视频生成方法及装置、电子设备和存储介质 | |
CN109803158A (zh) | 视频播放方法及装置 | |
CN109963168A (zh) | 视频预览方法及装置 | |
CN110234030A (zh) | 弹幕信息的显示方法及装置 | |
CN109359218A (zh) | 多媒体资源展示方法及装置 | |
CN115273831A (zh) | 语音转换模型训练方法、语音转换方法和装置 | |
CN109446346A (zh) | 多媒体资源编辑方法及装置 | |
CN108986117A (zh) | 视频图像分割方法及装置 | |
CN109992754A (zh) | 文档处理方法及装置 | |
CN109962958A (zh) | 文档处理方法及装置 | |
CN109756783A (zh) | 海报的生成方法及装置 | |
CN108469991A (zh) | 多媒体数据处理方法及装置 |
Legal Events
Date | Code | Title | Description |
---|---|---|---|
PB01 | Publication | ||
PB01 | Publication | ||
SE01 | Entry into force of request for substantive examination | ||
SE01 | Entry into force of request for substantive examination | ||
TA01 | Transfer of patent application right |
Effective date of registration: 20200506 Address after: 310052 room 508, floor 5, building 4, No. 699, Wangshang Road, Changhe street, Binjiang District, Hangzhou City, Zhejiang Province Applicant after: Alibaba (China) Co.,Ltd. Address before: 100080 Beijing Haidian District city Haidian street A Sinosteel International Plaza No. 8 block 5 layer A, C Applicant before: Youku network technology (Beijing) Co.,Ltd. |
|
TA01 | Transfer of patent application right | ||
RJ01 | Rejection of invention patent application after publication |
Application publication date: 20191011 |
|
RJ01 | Rejection of invention patent application after publication |