CN109874048B - 视频窗口组件半透明显示方法、装置以及计算机设备 - Google Patents

Abstract

本发明公开了一种视频窗口组件半透明显示方法，该方法包括：获取视频窗口组件的尺寸，以及终端设备的屏幕分辨率；根据所述视频窗口组件的尺寸以及所述屏幕分辨率将原始背景图像编辑为DIV图层；将所述DIV图层导入到canvas元素，然后进行半透明显示设置；将半透明设置后的canvas元素填充到所述视频窗口组件。本发明还提供一种视频窗口组件半透明显示装置、服务器及计算机可读存储介质。本发明提供的视频窗口组件半透明显示方法、装置、计算机设备及计算机可读存储介质能够实现基于视频网页页面自身元素的视频窗口组件半透明化，从而不需要额外加载ActiveX控件，而且适应性更强，应用效果更好。

Description

视频窗口组件半透明显示方法、装置以及计算机设备

技术领域

本发明涉及UI设计技术领域，尤其涉及一种视频窗口组件半透明显示方法、装置、计算机设备及计算机可读存储介质。

背景技术

随着HTML技术的发展，在终端的浏览器页面上进行视频播放的功能越来越简易方便。在实际应用中，往往会在视频播放的窗口部分区域设置悬浮的半透明组件，用于显示菜单栏位或者其他功能模块，这样使得用户同时观看全屏视频以及进行菜单功能选择和操作。然而，现有的半透明组件一般都是利用加载ActiveX控件的方式将RGB(Red、Green、Blue，红、绿、蓝)三原色值定义出的半透明图像整合到视频播放窗口组件，因此需要额外加载ActiveX控件。另外，ActiveX控件并不能与所有运行环境完美兼容，以加载ActiveX控件的方式形成的半透明组件在缩放大小时显示出来的效果并不完全与页面同步。因此，有必要提供一种新的视频窗口组件半透明显示方法。

发明内容

有鉴于此，本发明提出一种视频窗口组件半透明显示方法、装置、计算机设备及计算机可读存储介质，能够获取视频窗口组件的尺寸以及运行该视频页面的终端设备的屏幕分辨率；然后编辑视频窗口背景图像形成DIV图层；接着将DIV图层导入canvas元素，并进行半透明设置，最后再将半透明canvas元素填充到视频窗口组件，从而实现基于视频网页页面自身元素的视频窗口组件半透明化。其中，DIV图层，全称为DIVision，在HTML中用于为显示的内容提供结构和背景的元素；canvas元素在HTML中用于提供图形绘制的元素，相当于一块画布，可以通过Javascript脚本语言直接在canvas元素上绘制图形，或者将已绘制好的图像或者元素直接导入canvas元素。通过以上方式，不需要额外加载ActiveX控件，而且适应性更强，应用效果更好。

首先，为实现上述目的，本发明提供一种视频窗口组件半透明显示方法，该方法应用于终端设备的网页页面，所述方法包括：

获取视频窗口组件的尺寸，以及终端设备的屏幕分辨率；将视频窗口组件的原始背景图像导入DIV图层模板得到对应所述视频窗口组件的尺寸以及所述终端设备的屏幕分辨率的DIV图层；将DIV图层导入到canvas元素，再对所述canvas元素进行半透明显示设置；将半透明显示设置后的canvas元素填充到所述视频窗口组件。

可选地，所述“获取视频窗口组件的尺寸，以及终端设备的屏幕分辨率”的步骤，包括：通过查询所述视频页面的API从而获得视频窗口组件的尺寸；通过查询终端系统配置信息从而获得终端设备的屏幕分辨率。

可选地，所述“将视频窗口组件的原始背景图像导入DIV图层模板得到对应所述视频窗口组件的尺寸以及所述终端设备的屏幕分辨率的DIV图层”的步骤包括：根据所述视频窗口组件的尺寸建立DIV图层模板；根据所述屏幕分辨率和所述视频窗口组件的尺寸将原始背景图像进行相应的尺寸和分辨率的调整；将调整后的背景图像导入到所述DIV图层模板得到DIV图层。

可选地，所述“将DIV图层导入到canvas元素，再对所述canvas元素进行半透明显示设置”的步骤包括：将所述DIV图层导入到canvas元素模板；根据预先设置的半透明配置参数将所述canvas元素进行半透明设置。

此外，为实现上述目的，本发明还提供一种视频窗口组件半透明显示装置，所述装置包括：

获取模块，用于获取视频窗口组件的尺寸，以及终端设备的屏幕分辨率；编辑模块，用于将视频窗口组件的原始背景图像导入DIV图层模板得到对应所述视频窗口组件的尺寸以及所述终端设备的屏幕分辨率的DIV图层；设置模块，用于将DIV图层导入到canvas元素，再对所述canvas元素进行半透明显示设置；填充模块，用于将半透明显示设置后的canvas元素填充到所述视频窗口组件。

可选地，所述获取模块，还用于：通过查询所述视频页面的API从而获得视频窗口组件的尺寸；通过查询终端系统配置信息从而获得终端设备的屏幕分辨率。

可选地，所述编辑模块，还用于：根据所述视频窗口组件的尺寸建立DIV图层模板；根据所述屏幕分辨率和所述视频窗口组件的尺寸将原始背景图像进行相应的尺寸和分辨率的调整；将调整后的背景图像导入到所述DIV图层模板得到DIV图层。

可选地，所述设置模块还用于：将所述DIV图层导入到canvas元素模板；根据预先设置的半透明配置参数将所述canvas元素进行半透明设置。

进一步地，本发明还提出一种计算机设备，所述计算机设备包括存储器、处理器，所述存储器上存储有可在所述处理器上运行的计算机程序，所述计算机程序被所述处理器执行时实现如上述的视频窗口组件半透明显示方法的步骤。

进一步地，为实现上述目的，本发明还提供一种计算机可读存储介质，所述计算机可读存储介质存储有计算机程序，所述计算机程序可被至少一个处理器执行，以使所述至少一个处理器执行如上述的视频窗口组件半透明显示方法的步骤。

相较于现有技术，本发明所提出的视频窗口组件半透明显示方法、装置、计算机设备及计算机可读存储介质，能够获取视频窗口组件的尺寸以及运行该视频页面的终端设备的屏幕分辨率；然后编辑视频窗口背景图像形成DIV图层；接着将DIV图层导入canvas元素，并进行半透明设置，最后再将半透明canvas元素填充到视频窗口组件，从而实现基于视频网页页面自身元素的视频窗口组件半透明化。通过以上方式，不需要额外加载ActiveX控件，而且适应性更强，应用效果更好。

附图说明

图1是本发明计算机设备一可选的硬件架构的示意图；

图2是本发明视频窗口组件半透明显示装置一实施例的程序模块示意图；

图3是本发明视频窗口组件半透明显示方法一实施例的流程示意图。

附图标记：

计算机设备	1
		存储器	11
处理器	12
		网络接口	13
视频窗口组件半透明显示装置	200
		获取模块	201
编辑模块	202
		设置模块	203
填充模块	204

本发明目的实现、功能特点及优点将结合实施例，参照附图做进一步说明。

具体实施方式

为了使本发明的目的、技术方案及优点更加清楚明白，以下结合附图及实施例，对本发明进行进一步详细说明。应当理解，此处所描述的具体实施例仅用以解释本发明，并不用于限定本发明。基于本发明中的实施例，本领域普通技术人员在没有做出创造性劳动前提下所获得的所有其他实施例，都属于本发明保护的范围。

需要说明的是，在本发明中涉及“第一”、“第二”等的描述仅用于描述目的，而不能理解为指示或暗示其相对重要性或者隐含指明所指示的技术特征的数量。由此，限定有“第一”、“第二”的特征可以明示或者隐含地包括至少一个该特征。另外，各个实施例之间的技术方案可以相互结合，但是必须是以本领域普通技术人员能够实现为基础，当技术方案的结合出现相互矛盾或无法实现时应当认为这种技术方案的结合不存在，也不在本发明要求的保护范围之内。

参阅图1所示，是本发明计算机设备1一可选的硬件架构的示意图。

本实施例中，所述计算机设备1可包括，但不仅限于，可通过系统总线相互通信连接存储器11、处理器12、网络接口13。

所述计算机设备1通过网络接口13连接网络(图1未标出)，通过网络连接到其他终端设备如移动终端和PC端等。所述网络可以是企业内部网(Intranet)、互联网(Internet)、全球移动通讯系统(Global System of Mobile communication，GSM)、宽带码分多址(Wideband Code Division Multiple Access，WCDMA)、4G网络、5G网络、蓝牙(Bluetooth)、Wi-Fi、通话网络等无线或有线网络。

需要指出的是，图1仅示出了具有组件11-13的计算机设备1，但是应理解的是，并不要求实施所有示出的组件，可以替代的实施更多或者更少的组件。

其中，所述存储器11至少包括一种类型的可读存储介质，所述可读存储介质包括闪存、硬盘、多媒体卡、卡型存储器(例如，SD或DX存储器等)、随机访问存储器(RAM)、静态随机访问存储器(SRAM)、只读存储器(ROM)、电可擦除可编程只读存储器(EEPROM)、可编程只读存储器(PROM)、磁性存储器、磁盘、光盘等。在一些实施例中，所述存储器11可以是所述计算机设备1的内部存储单元，例如该计算机设备1的硬盘或内存。在另一些实施例中，所述存储器11也可以是所述计算机设备1的外部存储设备，例如该计算机设备1配备的插接式硬盘，智能存储卡(Smart Media Card,SMC)，安全数字(Secure Digital,SD)卡，闪存卡(Flash Card)等。当然，所述存储器11还可以既包括所述计算机设备1的内部存储单元也包括其外部存储设备。本实施例中，所述存储器11通常用于存储安装于所述计算机设备1的操作系统和各类应用软件，例如视频窗口组件半透明显示装置200的程序代码等。此外，所述存储器11还可以用于暂时地存储已经输出或者将要输出的各类数据。

所述处理器12在一些实施例中可以是中央处理器(Central Processing Unit，CPU)、控制器、微控制器、微处理器、或其他数据处理芯片。该处理器12通常用于控制所述计算机设备1的总体操作，例如执行数据交互或者通信相关的控制和处理等。本实施例中，所述处理器12用于运行所述存储器11中存储的程序代码或者处理数据，例如运行所述视频窗口组件半透明显示装置200等。

所述网络接口13可包括无线网络接口或有线网络接口，该网络接口13通常用于在所述计算机设备1与以上所述的其他终端设备如移动终端和PC端等建立通信连接。

本实施例中，所述计算机设备1内安装并运行有视频窗口组件半透明显示装置200时，当所述视频窗口组件半透明显示装置200运行时，能够获取视频窗口组件的尺寸以及运行该视频页面的终端设备的屏幕分辨率；然后编辑视频窗口背景图像形成DIV图层；接着将DIV图层导入canvas元素，并进行半透明设置，最后再将半透明canvas元素填充到视频窗口组件，从而实现基于视频网页页面自身元素的视频窗口组件半透明化。通过以上方式，不需要额外加载ActiveX控件，而且适应性更强，应用效果更好。

至此，己经详细介绍了本发明各个实施例的应用环境和相关设备的硬件结构和功能。下面，将基于上述应用环境和相关设备，提出本发明的各个实施例。

首先，本发明提出一种视频窗口组件半透明显示装置200。

参阅图2所示，是本发明视频窗口组件半透明显示装置200一实施例的程序模块图。

本实施例中，所述视频窗口组件半透明显示装置200包括一系列的存储于存储器11上的计算机程序指令，当该计算机程序指令被处理器12执行时，可以实现本发明各实施例的视频窗口组件半透明显示功能。在一些实施例中，基于该计算机程序指令各部分所实现的特定的操作，视频窗口组件半透明显示装置200可以被划分为一个或多个模块。例如，在图2中，所述视频窗口组件半透明显示装置200可以被分割成获取模块201、编辑模块202、设置模块203和填充模块204。其中：

所述获取模块201，用于获取视频窗口组件的尺寸，以及终端设备的屏幕分辨率。

具体地，摄像机的摄像头具有固定的镜片大小，镜片聚焦参数等硬件参数，因此拍摄出来的视频数据也将包括一定的帧尺寸和视频分辨率。所述计算机设备1在接收其他设备发送的或者摄像头拍摄视频数据后，在播放之前，都会根据自身的尺寸和分辨率信息对所述视频数据进行转换，从而使得该视频数据播放出来的效果能够最优化地完全在显示计算机终端1的显示窗口范围内。在本实施例中，当所述计算机设备1通过HTML网页页面播放视频，为了最佳的播放效果，所述视频则一般是与所述计算机设备1的屏幕分辨率同步的。因此，为了将所述视频播放窗口的组件也能够与所述视频的显示效果同步，所述获取模块201则会获取视频窗口组件的尺寸，以及所述计算机设备1的屏幕分辨率。在本实施例中，所述获取模块201通过查询所述视频页面的API从而获得视频窗口组件的尺寸；通过查询终端系统配置信息从而获得终端设备的屏幕分辨率。具体的，所述HTML页面的视频播放窗口可以根据所述HTML页面的应用API进行参数查询；而所述计算机设备1的屏幕分辨率也可以通过所述计算机设备1的系统配置信息获取。

所述编辑模块202，用于将视频窗口组件的原始背景图像导入DIV图层模板得到对应所述视频窗口组件的尺寸以及所述终端设备的屏幕分辨率的DIV图层。

具体地，所述编辑模块202首先根据所述视频窗口组件的尺寸建立DIV图层模板，然后再根据所述屏幕分辨率和所述视频窗口组件的尺寸将原始背景图像进行相应的尺寸和分辨率的调整，最后将调整后的背景图像导入到所述DIV图层模板得到DIV图层。在本实施例中，DIV图层在HTML页面中通常是用于为HTML页面的部分内容提供结构和背景的元素，可以用于在视频播放页面设置一悬浮的图层结构以作为该页面的菜单或者工具栏等具有操作功能的视频窗口组件。例如，所述计算机设备1获取到对方的视频流数据后，将该视频流数据进行格式转换以适合终端的屏幕尺寸播放；由于在HTML页面视频播放窗口进行视频播放的过程中，为了保证全屏页面显示，故而可以在所述HTML页面视频播放窗口设置DIV图层以作为播放控制的菜单或工具栏，或者是对该视频内容进行其他功能操作的界面。在本实施例中，所述编辑模块202先建立DIV图层模板，然后将依据所述视频窗口组件的尺寸以及所述计算机设备1的屏幕分辨率进行设置的背景图像导入所述DIV图层模板形成DIV图层，因此，所述DIV图层能够与所述视频播放页面的窗口保持相对一致的位置，且能够在显示效果上与所述视频画面相一致。当所述视频播放页面放大或者缩小时，所述DIV图层也同样进行同等比例的放大或者缩小，使得DIV图层与所述视频播放页面的相对稳定的位置，而且从分辨率看也是同步的。

所述设置模块203，用于将DIV图层导入到canvas元素，再对所述canvas元素进行半透明显示设置。

具体地，所述设置模块203先将所述DIV图层导入到canvas元素模板，然后再根据预先设置的半透明配置参数将所述canvas元素进行半透明设置。

在本实施例中，canvas元素用于在HTML网页上绘制图形，canvas元素可以直接在HTML上进行图形操作，canvas元素自身没有改变尺寸大小或者绘制图形的能力，需要通过Javascript编程语言对所述canvas元素进行定义，比如透明度。因此，当所述编辑模块202在设置好DIV图层后，为了能够将所述DIV图层导入canvas元素然后再填充到所述视频窗口组件中，所述设置模块203需要对所述canvas元素进行DIV图层导入，以及半透明化设置。在本实施例中，所述canvas元素是作为HTML中用于提供自定义画布设置的元素，因此，可以直接将符合所述视频窗口组件的样式要求的所述DIV图层作为图片导入到所述canvas元素中，然后再对所述canvas元素的画布或者图片进行颜色配置，以达到半透明的效果。在本实施例中，对HTML页面中的canvas元素进行半透明化设置可以通过Javascript源程序进行透明化设置，例如，所述设置模块203可以调用预先设置的Javascript源程序段直接对所述canvas元素执行半透明化设置，所述Javascript源程序段包括对所述canvas元素进行半透明化设置的配置参数。

所述填充模块204，用于将半透明显示设置后的canvas元素填充到所述视频窗口组件。

具体地，所述设置模块203将所述canvas元素设置为半透明图像之后，所述填充模块204则将所述半透明化的canvas元素填充到所述视频窗口组件中，从而实现所述视频窗口组件的背景图像的半透明化。在本实施例中，由于原始的视频窗口组件跟所述视频窗口样式相同，而在所述canvas元素填充到所述视频窗口组件之后，则所述视频窗口组件由所述canvas元素所替代，因此，所述视频窗口组件的样式也变成了所述canvas元素的背景图像半透明化样式。

从上文可知，所述计算机设备1能够获取视频窗口组件的尺寸以及运行该视频页面的终端设备的屏幕分辨率；然后编辑视频窗口背景图像形成DIV图层；接着将DIV图层导入canvas元素，并进行半透明设置，最后再将半透明canvas元素填充到视频窗口组件，从而实现基于视频网页页面自身元素的视频窗口组件半透明化。通过以上方式，不需要额外加载ActiveX控件，而且适应性更强，应用效果更好。

此外，本发明还提出一种视频窗口组件半透明显示方法，所述方法应用于计算机设备。

参阅图3所示，是本发明视频窗口组件半透明显示方法一实施例的流程示意图。在本实施例中，根据不同的需求，图3所示的流程图中的步骤的执行顺序可以改变，某些步骤可以省略。

步骤S500，获取视频窗口组件的尺寸，以及终端设备的屏幕分辨率。

具体地，摄像机的摄像头具有固定的镜片大小，镜片聚焦参数等硬件参数，因此拍摄出来的视频数据也将包括一定的帧尺寸和视频分辨率。所述计算机设备在接收其他设备发送的或者摄像头拍摄视频数据后，在播放之前，都会根据自身的尺寸和分辨率信息对所述视频数据进行转换，从而使得该视频数据播放出来的效果能够最优化地完全在显示计算机终端的显示窗口范围内。在本实施例中，当所述计算机设备通过HTML网页页面播放视频，为了最佳的播放效果，所述视频则一般是与所述计算机设备的屏幕分辨率同步的。因此，为了将所述视频播放窗口的组件也能够与所述视频的显示效果同步，所述计算机设备则会获取视频窗口组件的尺寸，以及自身的屏幕分辨率。在本实施例中，所述计算机设备通过查询所述视频页面的API从而获得视频窗口组件的尺寸；通过查询终端系统配置信息从而获得终端设备的屏幕分辨率。具体的，所述HTML页面的视频播放窗口可以根据所述HTML页面的应用API进行参数查询；而所述计算机设备的屏幕分辨率也可以通过所述计算机设备的系统配置信息获取。

步骤S502，将视频窗口组件的原始背景图像导入DIV图层模板得到对应所述视频窗口组件的尺寸以及所述终端设备的屏幕分辨率的DIV图层。

具体地，所述计算机设备首先根据所述视频窗口组件的尺寸建立DIV图层模板，然后再根据所述屏幕分辨率和所述视频窗口组件的尺寸将原始背景图像进行相应的尺寸和分辨率的调整，最后将调整后的背景图像导入到所述DIV图层模板得到DIV图层。在本实施例中，DIV图层在HTML页面中通常是用于为HTML页面的部分内容提供结构和背景的元素，可以用于在视频播放页面设置一悬浮的图层结构以作为该页面的菜单或者工具栏等具有操作功能的视频窗口组件。例如，所述计算机设备获取到对方的视频流数据后，将该视频流数据进行格式转换以适合终端的屏幕尺寸播放；由于在HTML页面视频播放窗口进行视频播放的过程中，为了保证全屏页面显示，故而可以在所述HTML页面视频播放窗口设置DIV图层以作为播放控制的菜单或工具栏，或者是对该视频内容进行其他功能操作的界面。在本实施例中，所述计算机设备先建立DIV图层模板，然后将依据所述视频窗口组件的尺寸以及所述计算机设备的屏幕分辨率进行设置的背景图像导入所述DIV图层模板形成DIV图层，因此，所述DIV图层能够与所述视频播放页面的窗口保持相对一致的位置，且能够在显示效果上与所述视频画面相一致。当所述视频播放页面放大或者缩小时，所述DIV图层也同样进行同等比例的放大或者缩小，使得DIV图层与所述视频播放页面的相对稳定的位置，而且从分辨率看也是同步的。

步骤S504，将DIV图层导入到canvas元素，再对所述canvas元素进行半透明显示设置。

具体地，所述计算机设备先将所述DIV图层导入到canvas元素模板，然后再根据预先设置的半透明配置参数将所述canvas元素进行半透明设置。

在本实施例中，canvas元素用于在HTML网页上绘制图形，canvas元素可以直接在HTML上进行图形操作，canvas元素自身没有改变尺寸大小或者绘制图形的能力，需要通过Javascript编程语言对所述canvas元素进行定义，比如透明度。因此，当所述计算机设备在设置好DIV图层后，为了能够将所述DIV图层导入canvas元素然后再填充到所述视频窗口组件中，所述计算机设备需要对所述canvas元素进行DIV图层导入，以及半透明化设置。在本实施例中，所述canvas元素是作为HTML中用于提供自定义画布设置的元素，因此，可以直接将符合所述视频窗口组件的样式要求的所述DIV图层作为图片导入到所述canvas元素中，然后再对所述canvas元素的画布或者图片进行颜色配置，以达到半透明的效果。在本实施例中，对HTML页面中的canvas元素进行半透明化设置可以通过Javascript源程序进行透明化设置，例如，所述计算机设备可以调用预先设置的Javascript源程序段直接对所述canvas元素执行半透明化设置，所述Javascript源程序段包括对所述canvas元素进行半透明化设置的配置参数。

步骤S506，将半透明显示设置后的canvas元素填充到所述视频窗口组件。

具体地，所述计算机设备将所述canvas元素设置为半透明图像之后，则进一步将所述半透明化的canvas元素填充到所述视频窗口组件中，从而实现所述视频窗口组件的背景图像的半透明化。在本实施例中，由于原始的视频窗口组件跟所述视频窗口样式相同，而在所述canvas元素填充到所述视频窗口组件之后，则所述视频窗口组件由所述canvas元素所替代，因此，所述视频窗口组件的样式也变成了所述canvas元素的背景图像半透明化样式。

本实施例所提出的视频窗口组件半透明显示方法，能够获取视频窗口组件的尺寸以及运行该视频页面的终端设备的屏幕分辨率；然后编辑视频窗口背景图像形成DIV图层；接着将DIV图层导入canvas元素，并进行半透明设置，最后再将半透明canvas元素填充到视频窗口组件，从而实现基于视频网页页面自身元素的视频窗口组件半透明化。通过以上方式，不需要额外加载ActiveX控件，而且适应性更强，应用效果更好。

上述本发明实施例序号仅仅为了描述，不代表实施例的优劣。

通过以上的实施方式的描述，本领域的技术人员可以清楚地了解到上述实施例方法可借助软件加必需的通用硬件平台的方式来实现，当然也可以通过硬件，但很多情况下前者是更佳的实施方式。基于这样的理解，本发明的技术方案本质上或者说对现有技术做出贡献的部分可以以软件产品的形式体现出来，该计算机软件产品存储在一个存储介质(如ROM/RAM、磁碟、光盘)中，包括若干指令用以使得一台终端设备(可以是手机，计算机，服务器，空调器，或者网络设备等)执行本发明各个实施例所述的方法。

以上仅为本发明的优选实施例，并非因此限制本发明的专利范围，凡是利用本发明说明书及附图内容所作的等效结构或等效流程变换，或直接或间接运用在其他相关的技术领域，均同理包括在本发明的专利保护范围内。

Claims (10)

1.一种视频窗口组件半透明显示方法，应用于终端设备的网页页面，其特征在于，所述方法包括步骤：

获取视频窗口组件的尺寸，以及终端设备的屏幕分辨率；

将视频窗口组件的原始背景图像导入DIV图层模板得到对应所述视频窗口组件的尺寸以及所述终端设备的屏幕分辨率的DIV图层；

将DIV图层导入到canvas元素，再对所述canvas元素进行半透明显示设置；

将半透明显示设置后的canvas元素填充到所述视频窗口组件。

2.如权利要求1所述的视频窗口组件半透明显示方法，其特征在于，所述“获取视频窗口组件的尺寸，以及终端设备的屏幕分辨率”的步骤，包括：

通过查询视频页面的API从而获得视频窗口组件的尺寸；

通过查询终端系统配置信息从而获得终端设备的屏幕分辨率。

3.如权利要求1所述的视频窗口组件半透明显示方法，其特征在于，所述“将视频窗口组件的原始背景图像导入DIV图层模板得到对应所述视频窗口组件的尺寸以及所述终端设备的屏幕分辨率的DIV图层”的步骤包括：

根据所述视频窗口组件的尺寸建立DIV图层模板；

根据所述屏幕分辨率和所述视频窗口组件的尺寸将原始背景图像进行相应的尺寸和分辨率的调整；

将调整后的背景图像导入到所述DIV图层模板得到DIV图层。

4.如权利要求1所述的视频窗口组件半透明显示方法，其特征在于，所述“将DIV图层导入到canvas元素，再对所述canvas元素进行半透明显示设置”的步骤包括：

将所述DIV图层导入到canvas元素模板；

根据预先设置的半透明配置参数将所述canvas元素进行半透明设置。

5.一种视频窗口组件半透明显示装置，其特征在于，所述装置包括：

获取模块，用于获取视频窗口组件的尺寸，以及终端设备的屏幕分辨率；

编辑模块，用于将视频窗口组件的原始背景图像导入DIV图层模板得到对应所述视频窗口组件的尺寸以及所述终端设备的屏幕分辨率的DIV图层；

设置模块，用于将DIV图层导入到canvas元素，再对所述canvas元素进行半透明显示设置；

填充模块，用于将半透明显示设置后的canvas元素填充到所述视频窗口组件。

6.如权利要求5所述的视频窗口组件半透明显示装置，其特征在于，所述获取模块，还用于：

通过查询视频页面的API从而获得视频窗口组件的尺寸；

通过查询终端系统配置信息从而获得终端设备的屏幕分辨率。

7.如权利要求5所述的视频窗口组件半透明显示装置，其特征在于，所述编辑模块，还用于：

根据所述视频窗口组件的尺寸建立DIV图层模板；

根据所述屏幕分辨率和所述视频窗口组件的尺寸将原始背景图像进行相应的尺寸和分辨率的调整；

将调整后的背景图像导入到所述DIV图层模板得到DIV图层。

8.如权利要求5所述的视频窗口组件半透明显示装置，其特征在于，所述设置模块还用于：

将所述DIV图层导入到canvas元素模板；

根据预先设置的半透明配置参数将所述canvas元素进行半透明设置。

9.一种计算机设备，其特征在于，所述计算机设备包括存储器、处理器，所述存储器上存储有可在所述处理器上运行的计算机程序，所述计算机程序被所述处理器执行时实现如权利要求1-4任一项所述的视频窗口组件半透明显示方法的步骤。

10.一种计算机可读存储介质，其特征在于，所述计算机可读存储介质存储有计算机程序，所述计算机程序可被至少一个处理器执行，以使所述至少一个处理器执行如权利要求1-4中任一项所述的视频窗口组件半透明显示方法的步骤。

Images