CN108989869A - 视频画面播放方法、装置、设备及计算机可读存储介质 - Google Patents
视频画面播放方法、装置、设备及计算机可读存储介质 Download PDFInfo
- Publication number
- CN108989869A CN108989869A CN201710398543.7A CN201710398543A CN108989869A CN 108989869 A CN108989869 A CN 108989869A CN 201710398543 A CN201710398543 A CN 201710398543A CN 108989869 A CN108989869 A CN 108989869A
- Authority
- CN
- China
- Prior art keywords
- video
- picture
- virtual canvas
- height
- width
- 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.)
- Granted
Links
Classifications
-
- H—ELECTRICITY
- H04—ELECTRIC COMMUNICATION TECHNIQUE
- H04N—PICTORIAL COMMUNICATION, e.g. TELEVISION
- H04N21/00—Selective content distribution, e.g. interactive television or video on demand [VOD]
- H04N21/40—Client devices specifically adapted for the reception of or interaction with content, e.g. set-top-box [STB]; Operations thereof
- H04N21/43—Processing of content or additional data, e.g. demultiplexing additional data from a digital video stream; Elementary client operations, e.g. monitoring of home network or synchronising decoder's clock; Client middleware
- H04N21/431—Generation of visual interfaces for content selection or interaction; Content or additional data rendering
- H04N21/4318—Generation of visual interfaces for content selection or interaction; Content or additional data rendering by altering the content in the rendering process, e.g. blanking, blurring or masking an image region
-
- H—ELECTRICITY
- H04—ELECTRIC COMMUNICATION TECHNIQUE
- H04N—PICTORIAL COMMUNICATION, e.g. TELEVISION
- H04N21/00—Selective content distribution, e.g. interactive television or video on demand [VOD]
- H04N21/40—Client devices specifically adapted for the reception of or interaction with content, e.g. set-top-box [STB]; Operations thereof
- H04N21/47—End-user applications
- H04N21/485—End-user interface for client configuration
- H04N21/4858—End-user interface for client configuration for modifying screen layout parameters, e.g. fonts, size of the windows
Landscapes
- Engineering & Computer Science (AREA)
- Multimedia (AREA)
- Signal Processing (AREA)
- Human Computer Interaction (AREA)
- Controls And Circuits For Display Device (AREA)
Abstract
本发明公开了一种视频画面播放方法、装置、设备及计算机可读存储介质,属于多媒体数据处理领域。所述方法包括:根据当前页面中的显示区域创建虚拟画布,所述虚拟画布的位置与所述显示区域的位置相匹配,所述虚拟画布的宽度等于所述显示区域的宽度,所述虚拟画布的高度等于所述显示区域的高度;对于视频中的每帧画面,从所述视频中提取所述画面,并在所述虚拟画布中绘制所述画面,以实现视频画面的播放,且播放的画面高度等于所述虚拟画布的高度,宽度等于所述虚拟画布的宽度。本发明能够实现视频播放的效果,无论是在水平方向和竖直方向上均不会出现空白区域或者溢出显示区域的情况,提高了画面的播放效果,保证视频能够正常播放。
Description
技术领域
本发明涉及多媒体数据处理领域,特别涉及一种视频画面播放方法、装置、设备及计算机可读存储介质。
背景技术
随着数据处理技术的发展和多媒体数据的普及,视频以其内容丰富、直观生动和趣味性强等诸多特性,得到了广泛的应用和传播,在终端上播放视频已成为用户常用的功能,而播放视频时需要播放视频画面。
相关技术中,视频包括多帧画面,播放视频时会在终端的显示区域内依次播放每帧画面,且每帧画面的宽高比固定。为了在显示区域内充分地播放每帧画面,可以根据画面的尺寸和宽高比以及显示区域的尺寸,对画面的高度和宽度进行等比例缩放,以使缩放之后画面的高度与显示区域的高度相等,或者,使缩放之后画面的宽度与显示区域的宽度相等。
在显示区域的宽高比与视频画面的宽高比不相等的情况下,对画面进行等比例缩放后,若使画面的高度与显示区域的高度相等,会导致画面在水平方向上出现空白区域或者溢出显示区域。同理地,若使画面的宽度与显示区域的宽度相等,会导致画面在竖直方向上出现空白区域或者溢出显示区域。而上述出现空白区域或者溢出显示区域的现象会影响画面的播放效果,进而影响视频的正常播放。
例如,原始的画面如图1A所示,若使画面的宽度与显示区域的宽度相等,缩放后的画面如图1B所示,画面在竖直方向上出现了空白区域。若使画面的高度与显示区域的高度相等,缩放后的画面如图1C所示,画面在水平方向上溢出显示区域。
发明内容
为了解决相关技术的问题,本发明实施例提供了一种视频画面播放方法、装置、设备及计算机可读存储介质。所述技术方案如下:
第一方面,提供了一种视频画面播放方法,所述方法包括:
根据当前页面中的显示区域创建虚拟画布,所述虚拟画布的位置与所述显示区域的位置相匹配,所述虚拟画布的宽度等于所述显示区域的宽度,所述虚拟画布的高度等于所述显示区域的高度;
对于视频中的每帧画面,从所述视频中提取所述画面,并在所述虚拟画布中绘制所述画面,以实现视频画面的播放,且播放的画面高度等于所述虚拟画布的高度,宽度等于所述虚拟画布的宽度。
第二方面,提供了一种视频画面播放装置,所述装置包括:
创建模块,用于根据当前页面中的显示区域创建虚拟画布,所述虚拟画布的位置与所述显示区域的位置相匹配,所述虚拟画布的宽度等于所述显示区域的宽度,所述虚拟画布的高度等于所述显示区域的高度;
提取模块,用于对于视频中的每帧画面,从所述视频中提取所述画面;
绘制模块,用于在所述虚拟画布中绘制所述画面,以实现视频画面的播放,且播放的画面高度等于所述虚拟画布的高度,宽度等于所述虚拟画布的宽度。
第三方面,提供了一种视频画面播放设备,所述视频画面播放设备包括处理器和存储器,所述存储器中存储有至少一条指令,所述指令由所述处理器加载并执行以实现如第一方面所述的视频画面播放方法所执行的操作。
第四方面,提供了一种计算机可读存储介质,其特征在于,所述计算机可读存储介质中存储有至少一条指令,所述指令由处理器加载并执行以实现如第一方面所述的视频画面播放方法所执行的操作。
本发明实施例提供的技术方案带来的有益效果是:
本发明实施例提供的方法、装置、设备及计算机可读存储介质,通过在虚拟画布中依次绘制每帧画面,能够实现视频播放的效果,由于绘制的画面的高度等于显示区域的高度,宽度等于显示区域的宽度,即画面始终与显示区域匹配,无论是在水平方向和竖直方向上均不会出现空白区域或者溢出显示区域的情况,提高了画面的播放效果,保证视频能够正常播放。
附图说明
为了更清楚地说明本发明实施例中的技术方案,下面将对实施例描述中所需要使用的附图作简单地介绍,显而易见地,下面描述中的附图仅仅是本发明的一些实施例,对于本领域普通技术人员来讲,在不付出创造性劳动的前提下,还可以根据这些附图获得其他的附图。
图1A是一帧原始画面的示意图;
图1B是相关技术提供的基于图1A所示的原始画面显示的画面示意图;
图1C是相关技术提供的基于图1A所示的原始画面显示的另一画面示意图;
图2A是本发明实施例提供的一种视频画面播放方法的流程图;
图2B是本发明实施例提供的基于图1A所示的原始画面显示的画面示意图;
图2C是本发明实施例提供的播放视频过程中的操作流程图;
图2D是本发明实施例提供的播放视频过程中的操作流程图;
图3是本发明实施例提供的一种视频画面播放装置的结构示意图;
图4是本发明实施例提供的一种终端的结构示意图。
具体实施方式
下面将结合本发明实施例中的附图,对本发明实施例中的技术方案进行清楚、完整地描述,显然,所描述的实施例是本发明一部分实施例,而不是全部的实施例。基于本发明中的实施例,本领域普通技术人员在没有做出创造性劳动前提下所获得的所有其他实施例,都属于本发明保护的范围。
视频(video)是一种包括多帧画面和音频的多媒体数据,通过连续显示多帧画面并同步播放音频可以实现视频播放。从视频内容的角度来说,视频可以包括动画、娱乐节目、电影和电视剧等内容的视频,从视频格式的角度来说,视频可以包括AVI(Audio VideoInterleaved,音频视频交错)、MP4(Moving Picture Experts 4,动态图像专家组)和ASF(Advanced Streaming format高级流格式)等格式的视频。
在播放视频时,需要播放视频画面。本发明实施例中,终端可以在当前页面中的显示区域播放视频画面。该终端可以为手机、平板电脑、电视、可穿戴设备或电脑等,该页面可以为新闻页面、直播页面和购物页面等,或者也可以为专门用于播放视频的页面。该页面的类型可以为html5(Hypertext Markup Language5,超文本标记语言5)页面、ASP(ActiveServer Page,动态服务器页面)页面等类型,该页面可以由终端的操作***提供,也可以由终端安装的应用提供,例如Web(World Wide Web,万维网)浏览器应用、新闻应用、微博应用、直播应用、社交应用和购物应用等,或者由终端安装的组件提供,如Webview(网络视图)组件等。当终端处于全屏播放视频的工作模式下,该显示区域为该页面的全部区域,当该终端处于非全屏播放视频的工作模式下,该显示区域为该页面的局部区域,该局部区域可以为以页面中心为中心,指定距离为边长所形成的方形区域等。
本发明实施例提供的视频画面播放方法可以应用于多种场景下,例如当用户浏览公众号推送的页面时,可以在页面中播放推送的视频,又如,当用户浏览联系人的动态信息展示页面时,可以播放联系人发布的视频,或者,当用户和联系人基于社交应用进行会话时,可以在社交应用提供的会话页面中播放联系人发送的视频。
进一步地,在各种场景中播放视频时,可以采用在页面中内联播放视频的形式。内联播放视频是指在播放视频的过程中,页面中除了视频以外的其他内容仍然正常显示,而不会被视频所覆盖,从而保证用户能够同时观看视频并浏览页面中除了视频以外的其他内容。
图2A是本发明实施例提供的一种视频画面播放方法的流程图,该发明实施例的执行主体为终端,参见图2A,该方法包括:
201、终端根据当前页面中的显示区域创建虚拟画布。
本发明实施例中,终端会在虚拟画布中播放视频,该虚拟画布的位置与页面中显示区域的位置相匹配,该虚拟画布的宽度等于该显示区域的宽度,该虚拟画布的高度等于该显示区域的高度。由于虚拟画布的位置和尺寸均和显示区域匹配,因此,在虚拟画布中播放视频即可实现在显示区域播放视频的效果。
其中,终端可以获取显示区域的宽度、高度和位置,调用虚拟画布创建函数,根据该显示区域的宽度、高度和位置执行创建虚拟画布的步骤。
关于获取显示区域的宽度、高度和位置的过程,终端可以通过javascript对显示区域进行提取宽度、高度和位置的操作。具体地,终端可以调用宽度提取函数,通过宽度提取函数提取页面中的显示区域的宽度,该宽度提取函数可以为document.documentElement.clientWidth。同理地,终端可以调用高度提取函数,通过高度提取函数提取页面中的显示区域的高度,该高度提取函数可以为document.documentElement.clientHeight。同理地,终端可以调用位置提取函数,通过位置提取函数提取页面中的显示区域的位置,该位置提取函数可以为window.screenTop和window.screenLeft等。
关于调用虚拟画布创建函数的过程,该虚拟画布创建函数具有创建虚拟画布的功能,当终端获取显示区域的宽度、高度和位置,调用虚拟画布创建函数时,虚拟画布创建函数就可以根据该显示区域的宽度、高度和位置,创建一个与该显示区域的宽度、高度和位置匹配的虚拟画布。其中,该虚拟画布创建函数可以为canvas标签或者其他函数。
202、终端调用视频播放函数,根据指定画面高度、指定画面宽度和该视频的视频标识创建视频的视频对象。
该视频播放函数具有创建视频的视频对象和播放视频的功能,可以为video标签或者其他函数。然而在该视频播放函数播放视频的过程中,显示每帧画面时只能够按照画面的宽高比对画面的高度和宽度进行等比例缩放,从而导致出现空白区域或者溢出显示区域的情况。
因此,本发明实施例中由视频播放函数播放音频,并将该视频播放函数播放的画面隐藏起来,而将该视频播放函数创建的视频对象传递给绘制函数,由绘制函数绘制视频的画面。该视频对象指用于指代视频的信息,包括视频的标识、视频中的画面和音频、指定画面高度、指定画面宽度以及音频的音量等,绘制函数获取到视频对象后,即可提取视频中的画面。
其中,终端会调用视频播放函数,根据指定画面高度、指定画面宽度和该视频的视频标识创建视频对象,该指定画面高度为该视频播放函数播放视频时显示画面的高度,该指定画面宽度为该视频播放函数播放视频时显示画面的宽度,该视频标识可以为视频的名称、URL(Uniform Resoure Locator,统一资源***)等,终端会将该指定画面高度和指定画面宽度均设置为0,那么,该视频播放函数基于该视频标识获取该视频后,根据该视频对象播放该视频时会实现隐藏视频画面的效果。
通过调用视频播放函数,能够为绘制函数提供视频对象,以便绘制函数能够利用视频播放函数所提供的视频对象提取画面并绘制画面,提高了绘制画面的效率。并且,视频播放函数还能够同步播放音频,保证了视频的正常播放,以便用户在观看绘制函数绘制的画面时,收听到视频中的音频。
203、终端根据该视频对象、第一像素数量和第二像素数量,调用绘制函数。
该第一像素数量为该虚拟画布在水平方向上的像素数量,该第二像素数量为该虚拟画布在竖直方向上的像素数量。当终端根据视频对象、第一像素数量和第二像素数量调用绘制函数后,绘制函数即可以根据视频对象,查找到对应的视频,提取视频中的画面,并在虚拟画布中按照第一像素数量在水平方向上绘制画面,并按照第二像素数量在竖直方向上绘制画面,该绘制函数可以为DrawImage函数或者其他函数。
关于确定第一像素数量和第二像素数量的过程,终端可以计算虚拟画布的宽度与单位像素个数的乘积,作为第一像素数量,并计算该虚拟画布的高度与该单位像素个数的乘积,作为第二像素数量。其中,该单位像素个数是指该虚拟画布在单位尺寸区域内可以容纳的像素个数,该单位尺寸区域是指由单位宽度和单位高度确定的区域。
终端可以调用虚拟画布的context(上下文)对象,并通过该context对象提取虚拟画布的Backing Store Pixel Ratio(后备存储像素比),该Backing Store Pixel Ratio即为单位像素个数。或者,终端也可以获取屏幕分辨率,根据屏幕分辨率确定单位像素个数。
204、终端在调用视频播放函数,根据视频对象播放视频的同时,调用绘制函数,根据视频对象、第一像素数量和第二像素数量,从视频中提取画面并在虚拟画布中绘制该画面。
对于视频中的每帧画面,绘制函数会根据视频对象从该视频中提取该画面后,根据第一像素数量和第二像素数量,在该虚拟画布中绘制该画面,以实现视频画面的播放,且播放的画面高度等于该虚拟画布的高度,宽度等于该虚拟画布的宽度。其中,当画面的原始高度小于虚拟画布的高度时,绘制函数可以计算虚拟画布的高度与原始高度之间的比例,并基于图像放大算法按照该比例在竖直方向上放大图像,以使放大后的图像的高度等于虚拟画布的高度,再绘制放大后的图像。同理地,当画面的原始高度大于虚拟画布的高度时,绘制函数可以计算虚拟画布的高度与原始高度之间的比例,并基于图像缩小算法按照该比例在竖直方向上缩小图像,再绘制缩小后的图像。同理地,绘制函数还可以按照虚拟画布的宽度,对画面宽度进行缩放,以使缩放后的画面宽度为虚拟画布的宽度。
由于绘制的画面在高度和宽度上始终和虚拟画布相匹配,即始终和显示区域相匹配,那么,在显示区域中显示每帧画面时,无论在水平方向上还是竖直方向上均不会出现空白区域,保证显示区域能够被合理利用,避免对显示区域的浪费。并且,无论在水平方向上还是竖直方向上均不会出现画面溢出显示区域的现象,保证每帧画面能够充分地显示。例如,针对如图1A所示的原始画面,绘制的画面可以如图2B所示,可以直观地确定并未发生出现空白区域和溢出显示区域的情况。
本发明实施例中,在终端播放视频时,视频播放函数用于隐藏显示视频的画面,而绘制函数用于同步绘制出与该视频播放函数当前所隐藏的画面相同的画面,即绘制函数绘制画面的过程和视频播放函数隐藏显示画面的过程保持同步,两个函数在运行过程中协同作用来实现播放视频画面的效果。
需要说明的第一点是,视频中的每一帧画面都与一段音频对应,视频播放函数在播放视频的过程中,在隐藏显示每一帧画面时,会同步播放该画面对应的音频,同时,绘制函数会同步绘制出与该视频播放函数当前所隐藏的画面相同的画面,从而保证播放的每帧画面与对应的音频同步播放,保证了用户能够观看该画面并听到该画面对应的音频。
例如,视频中可以包括一个时间轴,视频播放函数会按照该时间轴,逐一显示每个时间点的画面并播放该时间点对应的音频,从而保证视频中的画面和音频同步播放。而由于绘制函数绘制画面的过程和视频播放函数隐藏显示画面的过程保持同步,因此绘制函数绘制画面的过程和视频播放函数播放音频的过程也能保持同步。
需要说明的第二点是,为了保证播放视频的连续性和流畅性,终端可以调用画面绘制控制函数,在运行该画面绘制控制函数的过程中,从视频中提取画面并绘制画面。
例如,对于视频中相邻的第一画面和第二画面来说,在运行画面绘制控制函数的过程中,终端会从视频中提取第一画面,并在虚拟画布中绘制该第一画面,从该视频中提取第二画面,并在该虚拟画布中绘制该第二画面,该第二画面为该第一画面的下一帧画面。以此类推,终端可以依次提取并绘制视频中的每帧画面,直到提取并绘制视频中的最后一帧画面,结束播放视频为止。
其中,该画面绘制控制函数可以为RequestAnimationFrame函数,在运行RequestAnimationFrame函数时,在结束绘制上一帧画面后,才会绘制下一帧画面,因此,在播放视频画面的过程中可以实现播放的画面流畅、平滑而均匀的效果,避免了视频播放较为卡顿的问题。
实际上,在播放视频的过程中,视频播放函数会基于该画面绘制控制函数的控制隐藏显示画面并播放对应的音频,绘制函数也会基于该画面绘制控制函数的控制在虚拟画布上绘制画面,既实现了画面和音频的同步播放,也能够实现播放的画面流畅、平滑而均匀的效果,避免了视频播放较为卡顿的问题。
本发明实施例中的视频画面播放方法,实际上可以由虚拟画布创建函数、绘制函数、视频播放函数、宽度提取函数、高度提取函数和位置提取函数之间的交互实现,各个函数的操作流程可以参见图2C:
1、宽度提取函数、高度提取函数和位置提取函数分别获取显示区域的宽度、高度和位置,传入到虚拟画布创建函数中;
2、虚拟画布创建函数创建画布;
3、视频播放函数创建视频对象,将视频对象传入绘制函数;
4、绘制函数提取视频中的每帧画面,在虚拟画布上绘制提取的画面。
在一种可能实现方式中,以虚拟画布创建函数为canvas标签,视频播放函数为video标签,绘制函数为DrawImage函数,时间间隔控制函数为RequestAnimationFrame函数为例,各个函数的操作流程可以具体如图2D所示:
A、在html页面上创建video标签和canvas标签。
B、通过javascript读取用户浏览器或者Webview组件的显示区域的宽度和高度,将显示区域的宽度和高度传入canvas标签,从而创建一个虚拟画布,该虚拟画布能达到拉伸到全屏的效果。
C、通过javascript读取canvas的context对象的backingStorePixelRatio属性,从而计算第一像素数量和第二像素数量。
E、调用video标签播放视频,然后通过requestAnimationFrame的方式调用canvas标签的context对象的DrawImage方法,将正在播放的视频的每一帧画面绘制到创建好的虚拟画布上,直到播放结束,从而在虚拟画布上播放视频。
在实际应用中,可以将本发明实施例提供的方法封装为一个指定函数,向页面中添加该指定函数,则终端打开页面时,会自动运行该指定函数,从而按照本发明实施例提供的视频画面播放方法播放视频。其中,该指定函数可以为html格式、javascript格式、C语言格式或python格式,当然也可以为其他格式,指定函数具体可以如下:
本发明实施例提供的方法,通过在虚拟画布中依次绘制每帧画面,能够实现视频播放的效果,由于绘制的画面的高度等于显示区域的高度,宽度等于显示区域的宽度,即画面始终与显示区域匹配,无论是在水平方向和竖直方向上均不会出现空白区域或者溢出显示区域的情况,提高了画面的播放效果,保证视频能够正常播放。
考虑到对于屏幕尺寸不同的终端来说,显示区域的尺寸也不同,本发明实施例中提供了一种适用于在各种屏幕尺寸的终端的显示区域上播放视频的方法,保证各种屏幕尺寸的终端播放视频时均不会出现空白区域或者溢出屏幕的现象,提高了灵活性,无需开发人员解决屏幕显示异常的问题,因此提高了开发人员的工作效率,同时保证了视频播放的效果。
在相关技术中,Web浏览器或者Webview组件对于video标签的渲染原理是不同于img标签的,因此video标签在内联播放时无法根据屏幕尺寸全屏拉伸适配,这种传统的全屏适配方案会有“空白区域”或“溢出屏幕”等体验问题,而本发明实施例解决了video标签在内联播放时不能全屏拉伸适配的问题,让video标签在各类尺寸的屏幕上都可以做到全屏拉伸适配,让开发人员不用再关注屏幕适配异常,专注于视觉的还原、交互和业务逻辑实现,提高工作效率,提升用户体验。
图3是本发明实施例提供的一种视频画面播放装置的结构示意图。参见图3,该装置包括:创建模块301、提取模块302和绘制模块303。
创建模块301,用于执行上述图2A所示实施例中的步骤201;
提取模块302,用于执行图2A所示实施例中的提取视频中画面的步骤;
绘制模块302,用于执行图2A所示实施例中的在虚拟画布中绘制画面的步骤。
可选地,该创建模块301,包括:
获取子模块,用于获取显示区域的宽度、高度和位置;
调用子模块,用于执行创建虚拟画布的步骤。
可选地,该装置还包括:
调用模块,用于调用视频播放函数;
可选地,该装置还包括:
计算模块,用于计算第一像素数量和第二像素数量。
上述所有可选技术方案,可以采用任意结合形成本公开的可选实施例,在此不再一一赘述。
需要说明的是:上述实施例提供的视频画面播放装置在播放视频时,仅以上述各功能模块的划分进行举例说明,实际应用中,可以根据需要而将上述功能分配由不同的功能模块完成,即将终端的内部结构划分成不同的功能模块,以完成以上描述的全部或者部分功能。另外,上述实施例提供的视频画面播放装置与视频画面播放方法实施例属于同一构思,其具体实现过程详见方法实施例,这里不再赘述。
图4是本发明实施例提供的一种终端的结构示意图。该终端可以用于实施上述实施例所示出的视频画面播放方法中的终端所执行的功能。具体来讲:
终端400可以包括RF(Radio Frequency,射频)电路110、包括有一个或一个以上计算机可读存储介质的存储器120、输入单元130、显示单元140、传感器150、音频电路160、传输模块170、包括有一个或者一个以上处理核心的处理器180、以及电源190等部件。本领域技术人员可以理解,图4中示出的终端结构并不构成对终端的限定,可以包括比图示更多或更少的部件,或者组合某些部件,或者不同的部件布置。其中:
RF电路110可用于收发信息或通话过程中,信号的接收和发送,特别地,将基站的下行信息接收后,交由一个或者一个以上处理器180处理;另外,将涉及上行的数据发送给基站。通常,RF电路110包括但不限于天线、至少一个放大器、调谐器、一个或多个振荡器、用户身份模块(SIM)卡、收发信机、耦合器、LNA(Low Noise Amplifier,低噪声放大器)、双工器等。此外,RF电路110还可以通过无线通信与网络和其他终端通信。所述无线通信可以使用任一通信标准或协议,包括但不限于GSM(Global System of Mobile communication,全球移动通讯***)、GPRS(General Packet Radio Service,通用分组无线服务)、CDMA(CodeDivision Multiple Access,码分多址)、WCDMA(Wideband Code Division MultipleAccess,宽带码分多址)、LTE(Long Term Evolution,长期演进)、电子邮件、SMS(ShortMessaging Service,短消息服务)等。
存储器120可用于存储软件程序以及模块,如上述示例性实施例所示出的终端所对应的软件程序以及模块,处理器180通过运行存储在存储器120的软件程序以及模块,从而执行各种功能应用以及数据处理,如实现基于视频的交互等。存储器120可主要包括存储程序区和存储数据区,其中,存储程序区可存储操作***、至少一个功能所需的应用程序(比如声音播放功能、图像播放功能等)等;存储数据区可存储根据终端400的使用所创建的数据(比如音频数据、电话本等)等。此外,存储器120可以包括高速随机存取存储器,还可以包括非易失性存储器,例如至少一个磁盘存储器件、闪存器件、或其他易失性固态存储器件。相应地,存储器120还可以包括存储器控制器,以提供处理器180和输入单元130对存储器120的访问。
输入单元130可用于接收输入的数字或字符信息,以及产生与用户设置以及功能控制有关的键盘、鼠标、操作杆、光学或者轨迹球信号输入。具体地,输入单元130可包括触敏表面131以及其他输入终端132。触敏表面131,也称为触摸显示屏或者触控板,可收集用户在其上或附近的触摸操作(比如用户使用手指、触笔等任何适合的物体或附件在触敏表面131上或在触敏表面131附近的操作),并根据预先设定的程式驱动相应的链接装置。可选的,触敏表面131可包括触摸检测装置和触摸控制器两个部分。其中,触摸检测装置检测用户的触摸方位,并检测触摸操作带来的信号,将信号传送给触摸控制器;触摸控制器从触摸检测装置上接收触摸信息,并将它转换成触点坐标,再送给处理器180,并能接收处理器180发来的命令并加以执行。此外,可以采用电阻式、电容式、红外线以及表面声波等多种类型实现触敏表面131。除了触敏表面131,输入单元130还可以包括其他输入终端132。具体地,其他输入终端132可以包括但不限于物理键盘、功能键(比如音量控制按键、开关按键等)、轨迹球、鼠标、操作杆等中的一种或多种。
显示单元140可用于显示由用户输入的信息或提供给用户的信息以及终端400的各种图形用户接口,这些图形用户接口可以由图形、文本、图标、视频和其任意组合来构成。显示单元140可包括显示面板141,可选的,可以采用LCD(Liquid Crystal Display,液晶显示器)、OLED(Organic Light-Emitting Diode,有机发光二极管)等形式来配置显示面板141。进一步的,触敏表面131可覆盖显示面板141,当触敏表面131检测到在其上或附近的触摸操作后,传送给处理器180以确定触摸事件的类型,随后处理器180根据触摸事件的类型在显示面板141上提供相应的视觉输出。虽然在图4中,触敏表面131与显示面板141是作为两个独立的部件来实现输入和输入功能,但是在某些实施例中,可以将触敏表面131与显示面板141集成而实现输入和输出功能。
终端400还可包括至少一种传感器150,比如光传感器、运动传感器以及其他传感器。具体地,光传感器可包括环境光传感器及接近传感器,其中,环境光传感器可根据环境光线的明暗来调节显示面板141的亮度,接近传感器可在终端400移动到耳边时,关闭显示面板141和/或背光。作为运动传感器的一种,重力加速度传感器可检测各个方向上(一般为三轴)加速度的大小,静止时可检测出重力的大小及方向,可用于识别手机姿态的应用(比如横竖屏切换、相关游戏、磁力计姿态校准)、振动识别相关功能(比如计步器、敲击)等;至于终端400还可配置的陀螺仪、气压计、湿度计、温度计、红外线传感器等其他传感器,在此不再赘述。
音频电路160、扬声器161,传声器162可提供用户与终端400之间的音频接口。音频电路160可将接收到的音频数据转换后的电信号,传输到扬声器161,由扬声器161转换为声音信号输出;另一方面,传声器162将收集的声音信号转换为电信号,由音频电路160接收后转换为音频数据,再将音频数据输出处理器180处理后,经RF电路110以发送给比如另一终端,或者将音频数据输出至存储器120以便进一步处理。音频电路160还可能包括耳塞插孔,以提供外设耳机与终端400的通信。
终端400通过传输模块170可以帮助用户收发电子邮件、浏览网页和访问流式媒体等,它为用户提供了无线或有线的宽带互联网访问。虽然图4示出了传输模块170,但是可以理解的是,其并不属于终端400的必须构成,完全可以根据需要在不改变发明的本质的范围内而省略。
处理器180是终端400的控制中心,利用各种接口和线路链接整个手机的各个部分,通过运行或执行存储在存储器120内的软件程序和/或模块,以及调用存储在存储器120内的数据,执行终端400的各种功能和处理数据,从而对手机进行整体监控。可选的,处理器180可包括一个或多个处理核心;优选的,处理器180可集成应用处理器和调制解调处理器,其中,应用处理器主要处理操作***、用户界面和应用程序等,调制解调处理器主要处理无线通信。可以理解的是,上述调制解调处理器也可以不集成到处理器180中。
终端400还包括给各个部件供电的电源190(比如电池),优选的,电源可以通过电源管理***与处理器180逻辑相连,从而通过电源管理***实现管理充电、放电、以及功耗管理等功能。电源190还可以包括一个或一个以上的直流或交流电源、再充电***、电源故障检测电路、电源转换器或者逆变器、电源状态指示器等任意组件。
尽管未示出,终端400还可以包括摄像头、蓝牙模块等,在此不再赘述。具体在本实施例中,终端400的显示单元是触摸屏显示器,终端400还包括有存储器,以及一个或者一个以上的程序,其中一个或者一个以上程序存储于存储器中,且经配置以由一个或者一个以上处理器执行上述一个或者一个以上程序包含用于实施上述实施例中终端所执行操作的指令。
本发明实施例还提供了一种视频画面播放设备,该视频画面播放设备包括处理器和存储器,该存储器中存储有至少一条指令,该指令由该处理器加载并执行以实现上述实施例所述的视频画面播放方法所执行的操作。
本发明实施例还提供了一种计算机可读存储介质,该计算机可读存储介质中存储有至少一条指令,该指令由处理器加载并执行以实现上述实施例所述的视频画面播放方法所执行的操作。
本领域普通技术人员可以理解实现上述实施例的全部或部分步骤可以通过硬件来完成,也可以通过程序来指令相关的硬件完成,所述的程序可以存储于一种计算机可读存储介质中,上述提到的存储介质可以是只读存储器,磁盘或光盘等。
以上所述仅为本发明的较佳实施例,并不用以限制本发明,凡在本发明的精神和原则之内,所作的任何修改、等同替换、改进等,均应包含在本发明的保护范围之内。
Claims (12)
1.一种视频画面播放方法,其特征在于,所述方法包括:
根据当前页面中的显示区域创建虚拟画布,所述虚拟画布的位置与所述显示区域的位置相匹配,所述虚拟画布的宽度等于所述显示区域的宽度,所述虚拟画布的高度等于所述显示区域的高度;
对于视频中的每帧画面,从所述视频中提取所述画面,并在所述虚拟画布中绘制所述画面,以实现视频画面的播放,且播放的画面高度等于所述虚拟画布的高度,宽度等于所述虚拟画布的宽度。
2.根据权利要求1所述的方法,其特征在于,所述根据当前页面中的显示区域创建虚拟画布,包括:
获取所述显示区域的宽度、高度和位置;
调用虚拟画布创建函数,根据所述显示区域的宽度、高度和位置执行所述创建虚拟画布的步骤。
3.根据权利要求1或2所述的方法,其特征在于,所述方法还包括:
调用视频播放函数,根据指定画面高度、指定画面宽度和所述视频的视频标识创建所述视频的视频对象;
所述从所述视频中提取所述画面,并在所述虚拟画布中绘制所述画面,包括:
在调用所述视频播放函数,根据所述视频对象播放所述视频的同时,调用绘制函数,根据所述视频对象、第一像素数量和第二像素数量执行所述提取画面和绘制画面的步骤;
其中,所述视频对象中所述指定画面高度和所述指定画面宽度的值为0,以使所述视频播放函数根据所述视频对象播放所述视频时实现隐藏视频画面的效果,所述第一像素数量为所述虚拟画布在水平方向上的像素数量,所述第二像素数量为所述虚拟画布在竖直方向上的像素数量。
4.根据权利要求3所述的方法,其特征在于,所述在调用所述视频播放函数,根据所述视频对象播放所述视频的同时,调用绘制函数,根据所述视频对象、第一像素数量和第二像素数量执行所述提取画面和绘制画面的步骤之前,所述方法还包括:
计算所述虚拟画布的宽度与单位像素个数的乘积,作为所述第一像素数量;
计算所述虚拟画布的高度与所述单位像素个数的乘积,作为所述第二像素数量。
5.根据权利要求1或2所述的方法,其特征在于,所述从所述视频中提取所述画面,并在所述虚拟画布中绘制所述画面,包括:
调用画面绘制控制函数,从所述视频中提取第一画面,并在所述虚拟画布中绘制所述第一画面;
在运行所述画面绘制控制函数的过程中,从所述视频中提取第二画面,并在所述虚拟画布中绘制所述第二画面,所述第二画面为所述第一画面的下一帧画面。
6.一种视频画面播放装置,其特征在于,所述装置包括:
创建模块,用于根据当前页面中的显示区域创建虚拟画布,所述虚拟画布的位置与所述显示区域的位置相匹配,所述虚拟画布的宽度等于所述显示区域的宽度,所述虚拟画布的高度等于所述显示区域的高度;
提取模块,用于对于视频中的每帧画面,从所述视频中提取所述画面;
绘制模块,用于在所述虚拟画布中绘制所述画面,以实现视频画面的播放,且播放的画面高度等于所述虚拟画布的高度,宽度等于所述虚拟画布的宽度。
7.根据权利要求6所述的装置,其特征在于,所述创建模块,包括:
获取子模块,用于获取所述显示区域的宽度、高度和位置;
调用子模块,用于调用虚拟画布创建函数,根据所述显示区域的宽度、高度和位置执行所述创建虚拟画布的步骤。
8.根据权利要求6或7所述的装置,其特征在于,所述装置还包括:
调用模块,用于调用视频播放函数,根据指定画面高度、指定画面宽度和所述视频的视频标识创建所述视频的视频对象;
所述提取模块,还用于在调用所述视频播放函数,根据所述视频对象播放所述视频的同时,调用绘制函数,根据所述视频对象、第一像素数量和第二像素数量执行所述提取画面的步骤;
所述绘制模块,还用于在调用所述视频播放函数,根据所述视频对象播放所述视频的同时,调用绘制函数,根据所述视频对象、所述第一像素数量和所述第二像素数量执行所述绘制画面的步骤。
其中,所述视频对象中所述指定画面高度和所述指定画面宽度的值为0,以使所述视频播放函数根据所述视频对象播放所述视频时实现隐藏视频画面的效果,所述第一像素数量为所述虚拟画布在水平方向上的像素数量,所述第二像素数量为所述虚拟画布在竖直方向上的像素数量。
9.根据权利要求8所述的装置,其特征在于,所述装置还包括:
计算模块,用于计算所述虚拟画布的宽度与单位像素个数的乘积,作为所述第一像素数量;
所述计算模块,还用于计算所述虚拟画布的高度与所述单位像素个数的乘积,作为所述第二像素数量。
10.根据权利要求6或7所述的装置,其特征在于,所述提取模块,还用于调用画面绘制控制函数,从所述视频中提取第一画面;
所述绘制模块,用于在所述虚拟画布中绘制所述第一画面;
所述提取模块,还用于在运行所述画面绘制控制函数的过程中,从所述视频中提取第二画面;
所述绘制模块,用于在所述虚拟画布中绘制所述第二画面,所述第二画面为所述第一画面的下一帧画面。
11.一种视频画面播放设备,其特征在于,所述视频画面播放设备包括处理器和存储器,所述存储器中存储有至少一条指令,所述指令由所述处理器加载并执行以实现如权利要求1至权利要求5任一项所述的视频画面播放方法所执行的操作。
12.一种计算机可读存储介质,其特征在于,所述计算机可读存储介质中存储有至少一条指令,所述指令由处理器加载并执行以实现如权利要求1至权利要求5任一项所述的视频画面播放方法所执行的操作。
Priority Applications (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN201710398543.7A CN108989869B (zh) | 2017-05-31 | 2017-05-31 | 视频画面播放方法、装置、设备及计算机可读存储介质 |
Applications Claiming Priority (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN201710398543.7A CN108989869B (zh) | 2017-05-31 | 2017-05-31 | 视频画面播放方法、装置、设备及计算机可读存储介质 |
Publications (2)
Publication Number | Publication Date |
---|---|
CN108989869A true CN108989869A (zh) | 2018-12-11 |
CN108989869B CN108989869B (zh) | 2020-12-11 |
Family
ID=64502005
Family Applications (1)
Application Number | Title | Priority Date | Filing Date |
---|---|---|---|
CN201710398543.7A Active CN108989869B (zh) | 2017-05-31 | 2017-05-31 | 视频画面播放方法、装置、设备及计算机可读存储介质 |
Country Status (1)
Country | Link |
---|---|
CN (1) | CN108989869B (zh) |
Cited By (6)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN109925715A (zh) * | 2019-01-29 | 2019-06-25 | 腾讯科技(深圳)有限公司 | 一种虚拟水域生成方法、装置及终端 |
CN112584219A (zh) * | 2019-09-29 | 2021-03-30 | 上海幻电信息科技有限公司 | 视频播放方法、装置以及计算机设备 |
CN113014976A (zh) * | 2019-12-20 | 2021-06-22 | 西安诺瓦星云科技股份有限公司 | 媒体处理和播控方法、装置及显示*** |
CN114390353A (zh) * | 2020-10-21 | 2022-04-22 | 西安诺瓦星云科技股份有限公司 | 节目播放方法、装置和***及计算机可读存储介质 |
CN114979761A (zh) * | 2022-03-25 | 2022-08-30 | 深圳盛显科技有限公司 | 一种基于通用soc的视频播放器的显示方法及*** |
CN115706819A (zh) * | 2021-08-17 | 2023-02-17 | 鸿富锦精密工业(深圳)有限公司 | 网页视频播放方法、装置、电子设备及存储介质 |
Citations (6)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN101068333A (zh) * | 2006-05-04 | 2007-11-07 | 新泰辉煌公司 | 缩放和裁剪用于电视显示的图像的方法 |
US20100156965A1 (en) * | 2008-12-18 | 2010-06-24 | Kim Kiduk | Liquid crystal display device |
CN102243858A (zh) * | 2011-08-16 | 2011-11-16 | 青岛海信信芯科技有限公司 | 显示方法和显示装置 |
CN103546715A (zh) * | 2013-10-30 | 2014-01-29 | 乐视致新电子科技(天津)有限公司 | 一种智能电视的画面比例调节方法及装置 |
US20140192207A1 (en) * | 2013-01-07 | 2014-07-10 | Jinsong Ji | Method and apparatus to measure video characteristics locally or remotely |
CN106604118A (zh) * | 2015-10-16 | 2017-04-26 | 惠州Tcl移动通信有限公司 | 一种播放设备及方法 |
-
2017
- 2017-05-31 CN CN201710398543.7A patent/CN108989869B/zh active Active
Patent Citations (6)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN101068333A (zh) * | 2006-05-04 | 2007-11-07 | 新泰辉煌公司 | 缩放和裁剪用于电视显示的图像的方法 |
US20100156965A1 (en) * | 2008-12-18 | 2010-06-24 | Kim Kiduk | Liquid crystal display device |
CN102243858A (zh) * | 2011-08-16 | 2011-11-16 | 青岛海信信芯科技有限公司 | 显示方法和显示装置 |
US20140192207A1 (en) * | 2013-01-07 | 2014-07-10 | Jinsong Ji | Method and apparatus to measure video characteristics locally or remotely |
CN103546715A (zh) * | 2013-10-30 | 2014-01-29 | 乐视致新电子科技(天津)有限公司 | 一种智能电视的画面比例调节方法及装置 |
CN106604118A (zh) * | 2015-10-16 | 2017-04-26 | 惠州Tcl移动通信有限公司 | 一种播放设备及方法 |
Non-Patent Citations (5)
Title |
---|
CSDN 全力付出: "canvas像素化video", 《HTTP://BLOG.CSDN.NET/ZHENGYONG15984285623/ARTICLE/DETAILS/8835784》 * |
CSDN 十里夜: "canvas-视频绘制", 《HTTP://BLOG.CSDN.NET/HGYU_962464/ARTICLE/DETAILS/54893201》 * |
博客园 SUPERSTAR: "HTML5 Canvas绘图详解 drawImage() 方法 有图有真相!", 《HTTP://WWW.CNBLOG.COM/SUPERSTAR/P/5118683.HTML》 * |
博客园 WAYNE ZHU: "HTML5中video标签与canvas绘图的使用", 《HTTP://WWW.CNBLOG.COM/ZHUZHENWEI918/P/6822834.HTML》 * |
简书,IRIS_MAO: "Audio和Video API", 《HTTPS://WWW.JIANSHU.COM/P/23B98D3C3D78》 * |
Cited By (7)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN109925715A (zh) * | 2019-01-29 | 2019-06-25 | 腾讯科技(深圳)有限公司 | 一种虚拟水域生成方法、装置及终端 |
CN112584219A (zh) * | 2019-09-29 | 2021-03-30 | 上海幻电信息科技有限公司 | 视频播放方法、装置以及计算机设备 |
CN113014976A (zh) * | 2019-12-20 | 2021-06-22 | 西安诺瓦星云科技股份有限公司 | 媒体处理和播控方法、装置及显示*** |
CN114390353A (zh) * | 2020-10-21 | 2022-04-22 | 西安诺瓦星云科技股份有限公司 | 节目播放方法、装置和***及计算机可读存储介质 |
CN114390353B (zh) * | 2020-10-21 | 2024-05-10 | 西安诺瓦星云科技股份有限公司 | 节目播放方法、装置和***及计算机可读存储介质 |
CN115706819A (zh) * | 2021-08-17 | 2023-02-17 | 鸿富锦精密工业(深圳)有限公司 | 网页视频播放方法、装置、电子设备及存储介质 |
CN114979761A (zh) * | 2022-03-25 | 2022-08-30 | 深圳盛显科技有限公司 | 一种基于通用soc的视频播放器的显示方法及*** |
Also Published As
Publication number | Publication date |
---|---|
CN108989869B (zh) | 2020-12-11 |
Similar Documents
Publication | Publication Date | Title |
---|---|---|
CN108989869A (zh) | 视频画面播放方法、装置、设备及计算机可读存储介质 | |
CN105681872B (zh) | 直播过程中信息交互方法及装置 | |
CN109905754B (zh) | 虚拟礼物收取方法、装置及存储设备 | |
JP6522164B2 (ja) | 情報取得方法およびデバイス | |
CN105792006B (zh) | 互动信息显示方法及装置 | |
CN104965843B (zh) | 一种获取评论信息的方法及装置 | |
CN104102419B (zh) | 页面显示方法、装置和终端设备 | |
US20150199109A1 (en) | Display device and method for controlling the same | |
US20150082231A1 (en) | Method and terminal for displaying desktop | |
CN105183296B (zh) | 交互界面显示方法及装置 | |
CN108235086A (zh) | 视频播放控制方法、装置及相应的终端 | |
CN105808060B (zh) | 一种播放动画的方法和装置 | |
CN104519404B (zh) | 图像互换格式文件的播放方法及装置 | |
CN109547644A (zh) | 一种信息显示方法及终端 | |
WO2015043203A1 (en) | Method,apparatus and terminal for processing documents | |
CN104036536B (zh) | 一种定格动画的生成方法和装置 | |
CN109002243A (zh) | 一种图像参数调节方法及终端设备 | |
CN106127829B (zh) | 一种增强现实的处理方法、装置及终端 | |
CN106993227A (zh) | 一种进行信息展示的方法和装置 | |
CN106504303B (zh) | 一种播放帧动画的方法和装置 | |
CN109756767A (zh) | 预览数据播放方法、装置及存储介质 | |
CN107885512B (zh) | 一种应用程序安装方法、移动终端 | |
CN111222063A (zh) | 富文本渲染方法、装置、电子设备及存储介质 | |
CN104007887B (zh) | 浮层显示的方法和终端 | |
CN110099296A (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 | ||
GR01 | Patent grant | ||
GR01 | Patent grant |