著录项信息
专利名称 | 一种无阻塞全屏观看视频影像的交互方法及交互装置 |
申请号 | CN201510982195.9 | 申请日期 | 2015-12-22 |
法律状态 | 授权 | 申报国家 | 中国 |
公开/公告日 | 2016-05-18 | 公开/公告号 | CN105589696A |
优先权 | 暂无 | 优先权号 | 暂无 |
主分类号 | G06F9/451 | IPC分类号 | G;0;6;F;9;/;4;5;1;;;G;0;6;F;3;/;0;4;8;1查看分类表>
|
申请人 | 武汉斗鱼网络科技有限公司 | 申请人地址 | 湖北省武汉市东湖开发区华工科技园创新企业基地2栋A单元2层
变更
专利地址、主体等相关变化,请及时变更,防止失效 |
权利人 | 武汉斗鱼网络科技有限公司 | 当前权利人 | 武汉斗鱼网络科技有限公司 |
发明人 | 曹明浩;杜伟 |
代理机构 | 武汉科皓知识产权代理事务所(特殊普通合伙) | 代理人 | 鲁力 |
摘要
本发明涉及一种无阻塞全屏观看视频影像的交互方法及交互装置,通过生成一个flash容器,并在flash容器下调用当前场景系统嵌入的flash,设置flash容器的宽高等于flash容器的宽高,并记录该flash容器的宽高;然后生成一个基于js函数的page_scrn脚本并触发获取设定当前需要全屏的区域尺寸,并缓存flash容器的当前宽高,最后设定flash容器的当前宽高为设定的需要全屏的区域尺寸的宽高。交互装置包括:启动无阻塞全屏观看的虚拟键、flash初始化模块、脚本初始化模块等。本发明能够降低播放器在原生全屏下的内存、CPU消耗;并且充分利用网站资源和系统资源。
1.一种无阻塞全屏观看视频影像的交互方法,其特征在于,包括:
步骤1,启动无阻塞全屏观看,具体是通过一个虚拟模块启动无阻塞全屏观看,并触发系统进行初始化;
步骤2,系统进行初始化,包括flash初始化和脚本初始化,其中,
flash初始化的具体方法是生成一个flash容器,所述flash容器的宽高为用户自定义,并在flash容器下调用当前场景系统嵌入的flash,设置flash容器的宽高为100%适应于flash容器的宽高,也就是等于flash容器的宽高,并记录该flash容器的宽高;
脚本初始化的具体方法是生成一个基于js函数的page_scrn脚本;
步骤3,自定义全屏区域,具体是设定当前需要全屏的区域尺寸,由page_scrn脚本触发获取设定当前需要全屏的区域尺寸,并缓存flash容器的当前宽高,然后设定flash容器的当前宽高为设定的需要全屏的区域尺寸的宽高。
2.根据权利要求1所述的一种无阻塞全屏观看视频影像的交互方法,其特征在于,还包括:
步骤4,退出无阻塞全屏观看,具体是通过虚拟键退出无阻塞全屏观看,启动后,触发page_scrn脚本,调用flash初始化时记录的flash容器的宽高,并设置当前flash容器的宽高为初始化时flash容器的宽高。
3.根据权利要求1所述的一种无阻塞全屏观看视频影像的交互方法,其特征在于,所述步骤3中,设定当前需要全屏的区域尺寸为用户所在当前场景的浏览器可操作区域宽高。
4.一种无阻塞全屏观看视频影像的交互装置,其特征在于,包括:
启动无阻塞全屏观看的虚拟模块:通过该虚拟模块启动无阻塞全屏观看,并触发系统进行初始化;
flash初始化模块:该flash初始化模块生成一个flash容器,并在flash容器下调用当前场景系统嵌入的flash,设置flash容器的宽高为100%适应于flash容器的宽高,也就是等于flash容器的宽高,并记录该flash容器的宽高;
脚本初始化模块:该脚本初始化模块生成一个page_scrn脚本;
自定义全屏区域模块:由自定义全屏区域模块设定当前需要全屏的区域尺寸,由page_scrn脚本触发获取设定当前需要全屏的区域尺寸,并缓存flash容器的当前宽高,然后设定flash容器的当前宽高为设定的需要全屏的区域尺寸的宽高。
5.根据权利要求4所述的一种无阻塞全屏观看视频影像的交互装置,其特征在于,还包括:
退出无阻塞全屏观看的虚拟模块:通过该虚拟模块退出无阻塞全屏观看,启动后,触发page_scrn脚本,调用flash初始化时记录的flash容器的宽高,并设置当前flash容器的宽高为初始化时flash容器的宽高。
6.根据权利要求4所述的一种无阻塞全屏观看视频影像的交互装置,其特征在于,自定义全屏区域模块进行自定义全屏区域时,默认设定当前需要全屏的区域尺寸为用户所在当前场景的浏览器可操作区域宽高。
一种无阻塞全屏观看视频影像的交互方法及交互装置\n技术领域\n[0001] 本发明属于在互联网产品中实现无阻塞全屏观看视频的交互模式,主要应用于浏览器端(IE/Chrome/FireFox/Opera/Safari)的前端技术,尤其是涉及一种无阻塞全屏观看视频影像的交互方法及交互装置。\n背景技术\n[0002] 目前观看视频的播放器有:Flash、H5-video等等。开发者在使用这些播放器的时候,直接使用了播放器自带的全屏功能,当用户切换至全屏模式的时候,播放器直接占用当前显示器窗口,阻塞了用户的其他操作行为,降低了用户的观看体验。\n[0003] 当用户观看并且希望放大视屏,只能点击全屏播放,此时视频占用了整个显示器窗口,而且加大了电脑内存、CPU资源的消耗,用户无法使用当前网站或者应用下的其它功能,也不能对当前系统进行操作或查看。\n发明内容\n[0004] 本发明主要是解决现有技术所存在的技术问题;提供了一种降低播放器在原生全屏下的内存、CPU消耗的无阻塞全屏观看视频影像的交互方法及交互装置。\n[0005] 本发明还有一目的是解决现有技术所存在的技术问题;提供了一种充分利用网站资源和系统资源的无阻塞全屏观看视频影像的交互方法及交互装置。\n[0006] 本发明再有一目的是解决现有技术所存在的技术问题;提供了一种移植显示器窗口全屏的效果于网页中来,为获取更多的交互体验提供空间的无阻塞全屏观看视频影像的交互方法及交互装置。\n[0007] 本发明的上述技术问题主要是通过下述技术方案得以解决的:\n[0008] 一种无阻塞全屏观看视频影像的交互方法,其特征在于,包括:\n[0009] 步骤1,启动无阻塞全屏观看,具体是通过一个虚拟模块启动无阻塞全屏观看,并触发系统进行初始化;\n[0010] 步骤2,系统进行初始化,包括flash 初始化和脚本初始化,其中,\n[0011] flash 初始化的具体方法是生成一个flash容器,所述flash容器的宽高为用户自定义,并在flash容器下调用当前场景系统嵌入的flash,设置flash容器的宽高为 100%适应于flash容器的宽高,也就是等于flash容器的宽高,并记录该flash容器的宽高;\n[0012] 脚本初始化的具体方法是生成一个基于js函数的page_scrn脚本;\n[0013] 步骤3,自定义全屏区域,具体是设定当前需要全屏的区域尺寸,由page_scrn脚本触发获取设定当前需要全屏的区域尺寸,并缓存flash容器的当前宽高,然后设定flash容器的当前宽高为设定的需要全屏的区域尺寸的宽高。\n[0014] 在上述的一种无阻塞全屏观看视频影像的交互方法,还包括:\n[0015] 步骤4,退出无阻塞全屏观看,具体是通过虚拟键退出无阻塞全屏观看,启动后,触发page_scrn脚本,调用flash初始化时记录的flash容器的宽高,并设置当前flash容器的宽高为初始化时flash容器的宽高。\n[0016] 在上述的一种无阻塞全屏观看视频影像的交互方法,所述步骤3中,设定当前需要全屏的区域尺寸为用户所在当前场景的浏览器可操作区域宽高。\n[0017] 一种无阻塞全屏观看视频影像的交互装置,其特征在于,包括:\n[0018] 启动无阻塞全屏观看的虚拟模块:通过该虚拟模块启动无阻塞全屏观看,并触发系统进行初始化;\n[0019] flash 初始化模块:该flash 初始化模块生成一个flash容器,并在flash容器下调用当前场景系统嵌入的flash,设置flash容器的宽高为 100%适应于flash容器的宽高,也就是等于flash容器的宽高,并记录该flash容器的宽高;\n[0020] 脚本初始化模块:该脚本初始化模块生成一个page_scrn脚本;\n[0021] 自定义全屏区域模块:由自定义全屏区域模块设定当前需要全屏的区域尺寸,由page_scrn脚本触发获取设定当前需要全屏的区域尺寸,并缓存flash容器的当前宽高,然后设定flash容器的当前宽高为设定的需要全屏的区域尺寸的宽高。\n[0022] 在上述的一种无阻塞全屏观看视频影像的交互装置,还包括:\n[0023] 退出无阻塞全屏观看的虚拟模块:通过该虚拟模块退出无阻塞全屏观看,启动后,触发page_scrn脚本,调用flash初始化时记录的flash容器的宽高,并设置当前flash容器的宽高为初始化时flash容器的宽高。\n[0024] 在上述的一种无阻塞全屏观看视频影像的交互装置,自定义全屏区域模块进行自定义全屏区域时,默认设定当前需要全屏的区域尺寸为用户所在当前场景的浏览器可操作区域宽高。\n[0025] 因此,本发明具有如下优点:1、降低播放器在原生全屏下的内存、CPU消耗;2、用户能够自定义视频播放时的全屏区域,并能够在全屏时,不阻碍用户进行其他操作行为,充分利用了网站资源和系统资源 ;3、移植显示器窗口全屏的效果于网页中来,为获取更多的交互体验提供空间。\n附图说明\n[0026] 图1 为现有技术中播放器全屏模式的示意图。\n[0027] 图2 为采用本发明后再本发明的自定义全屏模式和播放器全屏模式的示意图。\n[0028] 图3为本发明涉及的交互方法中自定义全屏模式的原理示意图。\n[0029] 图4为本发明涉及的交互方法中自定义全屏模式中page_scrn函数操作步骤原理示意图。\n[0030] 图5为本发明涉及的交互方法中退出自定义全屏模式的原理示意图。\n[0031] 图6 为本发明涉及的交互装置的结构示意图。\n具体实施方式\n[0032] 下面通过实施例,并结合附图,对本发明的技术方案作进一步具体的说明。\n[0033] 实施例:\n[0034] 一、首先介绍一下本发明的交互方法,本发明中提到的无阻塞全屏观看视频,顾名思义就是不阻碍用户行为的视频全屏模式,在本发明中也可以称为“网页全屏”,“网页全屏”是在当前父容器下面进行放大填充,用户可以进行其它操作;而传统的“全屏”是调用播放器原生的功能,视频将会填充全部显示器且不能进行其它操作。视频无阻塞全屏(网页全屏)不是播放器原生的功能(也不可能被播放器支持),而是由播放器和脚本合作实现,本发明所涉及的网页全屏具体包括以下步骤:\n[0035] 步骤1,启动无阻塞全屏观看,具体是通过一个虚拟键(可以在系统中中增加自定义为一个flash UI全屏按钮,该按钮的位置可以是自定义的,通畅可以放在右下角的任务栏或者播放器的右下角)启动无阻塞全屏观看,并触发系统进行初始化;\n[0036] 步骤2,系统进行初始化,包括flash 初始化和脚本初始化,其中,\n[0037] flash 初始化的具体方法是生成一个flash容器,该flash容器的宽高为用户自定义,并在flash容器下调用当前场景系统嵌入的flash,设置flash容器的宽高为 100%适应于flash容器的宽高,也就是等于flash容器的宽高,并记录该flash容器的宽高;\n[0038] 脚本初始化的具体方法是生成一个基于js函数的page_scrn脚本;\n[0039] 步骤3,自定义全屏区域,具体是设定当前需要全屏的区域尺寸,由page_scrn脚本触发获取设定当前需要全屏的区域尺寸,并缓存flash容器的当前宽高,然后设定flash容器的当前宽高为设定的需要全屏的区域尺寸的宽高,在本实施例中,个人电脑上浏览直播平台的的直播间或者视频播放时,就会看到在播放器或者直播间中的flash UI全屏按钮(“网页全屏“按钮),点击该“网页全屏“按钮,播放器的控制栏会切换成另一种状态,即“退出网页全屏”按钮的视图,同时触发js函数“page_scrn”,该“page_scrn”的具体执行就是本步骤前述描述的具体过程。\n[0040] 在本步骤中,用户可以自行设定需要全屏的区域尺寸的宽高,比如,可以设定为除浏览器和任务栏的其他区域为需要全屏的区域尺寸的宽高,这样在全屏模式下,用户仍然可以进行其他操作,这种全屏模式在网络直播或视频直播及播放时更能够体现高效性,相比原生全屏下,本发明涉及的全屏模式无轮是内存、CPU消耗,还是用户体验上,都有更好的优越性。\n[0041] 步骤4,退出无阻塞全屏观看,具体是通过虚拟模块(就是步骤3中描述的“退出网页全屏”的按钮)退出无阻塞全屏观看,启动后,触发page_scrn脚本,调用flash初始化时记录的flash容器的宽高,并设置当前flash容器的宽高为初始化时flash容器的宽高。\n[0042] 二、下面是涉及到本发明的交互装置,包括:\n[0043] 启动无阻塞全屏观看的虚拟模块:通过该虚拟模块启动无阻塞全屏观看,并触发系统进行初始化;\n[0044] flash 初始化模块:该flash 初始化模块生成一个flash容器,并在容器下调用当前场景系统嵌入的flash,设置flash容器的宽高为 100%适应于flash容器的宽高,也就是等于flash容器的宽高,并记录该flash容器的宽高;\n[0045] 一个脚本初始化模块:该脚本初始化模块生成一个page_scrn脚本;\n[0046] 一个自定义全屏区域模块:由自定义全屏区域模块设定当前需要全屏的区域尺寸,由page_scrn脚本触发获取设定当前需要全屏的区域尺寸,并缓存flash容器的当前宽高,然后设定flash容器的当前宽高为设定的需要全屏的区域尺寸的宽高。\n[0047] 一个退出无阻塞全屏观看的虚拟键:通过该虚拟键退出无阻塞全屏观看,启动后,触发page_scrn脚本,调用flash初始化时记录的flash容器的宽高,并设置当前flash容器的宽高为初始化时flash容器的宽高。\n[0048] 在本装置的阐述中,有关具体的实施部分,如:启动无阻塞全屏观看的虚拟模块可以是在系统中中增加自定义为一个flash UI全屏按钮,该按钮的位置可以是自定义的,通畅可以放在右下角的任务栏或者播放器的右下角,已经在方法部分的描述清楚,在本装置的描述中,为了避免过于重复,在此不在赘述。\n[0049] 本文中所描述的具体实施例仅仅是对本发明精神作举例说明。本发明所属技术领域的技术人员可以对所描述的具体实施例做各种各样的修改或补充或采用类似的方式替代,但并不会偏离本发明的精神或者超越所附权利要求书所定义的范围。
法律信息
- 2019-06-04
- 2016-06-15
实质审查的生效
IPC(主分类): G06F 9/44
专利申请号: 201510982195.9
申请日: 2015.12.22
- 2016-05-18
引用专利(该专利引用了哪些专利)
序号 | 公开(公告)号 | 公开(公告)日 | 申请日 | 专利名称 | 申请人 |
1
| |
2013-01-30
|
2012-10-12
| | |
2
| |
2012-07-11
|
2011-11-01
| | |
3
| |
2014-12-24
|
2013-06-14
| | |
4
| |
2011-02-02
|
2010-09-27
| | |
被引用专利(该专利被哪些专利引用)
序号 | 公开(公告)号 | 公开(公告)日 | 申请日 | 专利名称 | 申请人 | 该专利没有被任何外部专利所引用! |