WO2017096893A1 - 在网页中配置视频播放器的方法和装置 - Google Patents

在网页中配置视频播放器的方法和装置 Download PDF

Info

Publication number
WO2017096893A1
WO2017096893A1 PCT/CN2016/089510 CN2016089510W WO2017096893A1 WO 2017096893 A1 WO2017096893 A1 WO 2017096893A1 CN 2016089510 W CN2016089510 W CN 2016089510W WO 2017096893 A1 WO2017096893 A1 WO 2017096893A1
Authority
WO
WIPO (PCT)
Prior art keywords
player
width
height
browser
screen
Prior art date
Application number
PCT/CN2016/089510
Other languages
English (en)
French (fr)
Inventor
杨凯旋
Original Assignee
乐视控股(北京)有限公司
乐视网信息技术(北京)股份有限公司
Priority date (The priority date 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 date listed.)
Filing date
Publication date
Application filed by 乐视控股(北京)有限公司, 乐视网信息技术(北京)股份有限公司 filed Critical 乐视控股(北京)有限公司
Priority to US15/243,330 priority Critical patent/US20170161232A1/en
Publication of WO2017096893A1 publication Critical patent/WO2017096893A1/zh

Links

Images

Classifications

    • HELECTRICITY
    • H04ELECTRIC COMMUNICATION TECHNIQUE
    • H04NPICTORIAL COMMUNICATION, e.g. TELEVISION
    • H04N21/00Selective content distribution, e.g. interactive television or video on demand [VOD]
    • H04N21/40Client devices specifically adapted for the reception of or interaction with content, e.g. set-top-box [STB]; Operations thereof
    • H04N21/43Processing 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/431Generation of visual interfaces for content selection or interaction; Content or additional data rendering
    • HELECTRICITY
    • H04ELECTRIC COMMUNICATION TECHNIQUE
    • H04NPICTORIAL COMMUNICATION, e.g. TELEVISION
    • H04N21/00Selective content distribution, e.g. interactive television or video on demand [VOD]
    • H04N21/40Client devices specifically adapted for the reception of or interaction with content, e.g. set-top-box [STB]; Operations thereof
    • H04N21/43Processing 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/431Generation of visual interfaces for content selection or interaction; Content or additional data rendering
    • H04N21/4312Generation of visual interfaces for content selection or interaction; Content or additional data rendering involving specific graphical features, e.g. screen layout, special fonts or colors, blinking icons, highlights or animations
    • H04N21/4314Generation of visual interfaces for content selection or interaction; Content or additional data rendering involving specific graphical features, e.g. screen layout, special fonts or colors, blinking icons, highlights or animations for fitting data in a restricted space on the screen, e.g. EPG data in a rectangular grid
    • HELECTRICITY
    • H04ELECTRIC COMMUNICATION TECHNIQUE
    • H04NPICTORIAL COMMUNICATION, e.g. TELEVISION
    • H04N21/00Selective content distribution, e.g. interactive television or video on demand [VOD]
    • H04N21/40Client devices specifically adapted for the reception of or interaction with content, e.g. set-top-box [STB]; Operations thereof
    • H04N21/47End-user applications
    • H04N21/478Supplemental services, e.g. displaying phone caller identification, shopping application
    • H04N21/4782Web browsing, e.g. WebTV
    • HELECTRICITY
    • H04ELECTRIC COMMUNICATION TECHNIQUE
    • H04NPICTORIAL COMMUNICATION, e.g. TELEVISION
    • H04N21/00Selective content distribution, e.g. interactive television or video on demand [VOD]
    • H04N21/40Client devices specifically adapted for the reception of or interaction with content, e.g. set-top-box [STB]; Operations thereof
    • H04N21/47End-user applications
    • H04N21/485End-user interface for client configuration
    • H04N21/4858End-user interface for client configuration for modifying screen layout parameters, e.g. fonts, size of the windows

Definitions

  • the present patent application relates to information processing technologies, and in particular, to a method and apparatus for configuring a video player in a webpage.
  • the size of the display screen of the user's computer monitor is different, and the height of the toolbar of the browser used is different, which makes the size of the first screen different.
  • the user opens the video player on the first screen of the browser, and the first screen of the browser is not full-screen, or the user stretches the browser page to any size, the player is often cut, that is, the entire original is displayed. Part of the screen of the player screen, which has a bad influence on the user's experience of watching the video.
  • Some embodiments of the present invention provide a method and apparatus for configuring a video player in a webpage, so that the player displayed in the browser's first screen can be adaptively changed according to the size of the browser page, so that the user always watches. Go to the full player screen.
  • an embodiment of the present invention provides a method for configuring a video player in a webpage, the method comprising: acquiring a browser first in real time in response to an operation of displaying a video player playing a video in a webpage. Screen size; set the size of the player according to the size of the browser's first screen, so that the player is all displayed in the browser's first screen page.
  • the first screen of the browser includes: a title navigation area and an interaction field; the size of the player is set according to the size of the first screen of the browser, so that the player is all displayed on the first screen of the browser.
  • the method includes: setting a width of the player according to a width of the first screen of the browser; setting a height of the player according to a width of the player, a height of the browser, a height of the title navigation area, and a height of the interactive column area.
  • setting the width of the player according to the width of the first screen of the browser comprises: identifying a preset width interval to which the first screen width of the browser belongs, and determining a player width threshold corresponding to the corresponding width interval as the current The width of the player, where each of the preset widths The degree interval corresponds to one of the player width thresholds, and the larger the width value of the preset width interval, the larger the corresponding player width threshold.
  • the setting the height of the player according to the width of the player and the height of the title navigation area and the interactive column area comprises: calculating a height of the browser minus the title navigation area and the interaction bar a difference in height of the area; if the height difference is less than or equal to the first threshold, determining that the first threshold is a height of the player; if the height difference is greater than the first threshold and less than a second threshold, determining that the height difference is the height of the player; if the height difference is greater than or equal to the second threshold, determining that the second threshold is a height of the player;
  • the second threshold is a ratio of the width of the player to the ratio of the source of the video played by the player.
  • the method further comprises: dynamically adjusting the size of the video playing screen in the player, so that the video playing screen is displayed in the player in the maximum screen size according to the ratio of the source of the video.
  • An embodiment of the present invention further provides an apparatus for configuring a video player in a webpage, the apparatus comprising: a size acquisition module, configured to acquire a browser in real time in response to an operation of displaying a video player playing a video in a webpage.
  • the first screen size; the size adjustment module is used to set the size of the player according to the size of the browser's first screen, so that the player is all displayed in the browser's first screen page.
  • the first screen of the browser includes: a title navigation area and an interaction field;
  • the size adjustment module includes: a width setting unit, configured to set a width of the player according to a width of the first screen of the browser; and a height setting unit And for setting the height of the player according to the width of the player, the height of the browser, the title navigation area, and the height of the interactive column area.
  • the width setting unit is specifically configured to identify a preset width interval to which the first screen width of the browser belongs, and determine a player width threshold corresponding to the corresponding width interval as a current player width, where Each of the preset width intervals corresponds to one of the player width thresholds, and the larger the width value of the preset width interval, the larger the corresponding player width threshold.
  • the height setting unit includes: a calculation subunit, configured to calculate a difference between a height of the browser minus a height of the title navigation area and the interaction column area; a height determination subunit, configured to If the height difference is less than or equal to the first threshold, determining that the first threshold is the height of the player; if the height difference is greater than the first threshold and less than the first a second threshold, determining that the height difference is the height of the player; if the height difference is greater than or equal to the second threshold, determining that the second threshold is a height of the player;
  • the second threshold is a ratio of the width of the player to the ratio of the source of the video played by the player.
  • the device further includes: a video picture adjustment module, configured to dynamically adjust a size of the video play picture in the player after the size of the player is set, so that the video play picture is played according to a video source ratio The device is displayed in the largest screen size.
  • a video picture adjustment module configured to dynamically adjust a size of the video play picture in the player after the size of the player is set, so that the video play picture is played according to a video source ratio The device is displayed in the largest screen size.
  • the method and device for configuring a video player in a webpage provided by some embodiments of the present invention can be obtained by first opening a player to play a video through a browser or adjusting a webpage size of a browser on a browser page of a player. The size of the browser, and then adjust the size of the player according to the size of the browser, so that the player is always displayed in the browser's first screen.
  • FIG. 1 is a flowchart of a method for configuring a video player in a webpage according to an embodiment of the present invention
  • FIG. 2 is a flowchart of a method for configuring a video player in a webpage according to another embodiment of the present invention
  • FIG. 3 is a diagram showing a relationship between a player and a screen in a player according to an embodiment of the present invention
  • FIG. 4 is a diagram showing a screen play effect of a player provided in an embodiment of the present invention.
  • FIG. 5 is a schematic structural diagram of an apparatus for configuring a video player in a webpage according to an embodiment of the present invention
  • FIG. 6 is a schematic structural diagram of an apparatus for configuring a video player in a webpage according to another embodiment of the present invention.
  • the basic inventive idea of some embodiments of the present invention is that when the player is used to open the player to play the video, the size of the player is always adapted to the size of the browser, so that the player is always displayed in the first screen of the browser. .
  • the first screen page of the browsing is the first screen page that is automatically displayed after the browser is opened.
  • FIG. 1 is a flow chart of a method for configuring a video player in a webpage according to an embodiment of the present invention.
  • the executable body of the method may be a browser device applied to various PCs or a device integrated in these browser devices. In this scenario, the browser is used as the execution subject.
  • step S110 in response to an operation of displaying a video player playing a video in a webpage, the first screen size of the browser is acquired in real time.
  • the size of the first screen of the browser refers to the pixel size of the first screen page in the page of the player opened by the browser.
  • the existing processing method for displaying the player in the browser is displayed according to a fixed player screen ratio, and when the user drags and pulls the browser, the corresponding player always maintains a fixed screen size for display. This will cause the player page not to be fully displayed in the browser when the size of the first screen is adjusted to a smaller size by the user.
  • the first screen size of the browser is obtained in real time, and the adaptability of the player size is determined according to the actual size of the current browser page. Adjustment.
  • step S120 the size of the player is set according to the size of the first screen of the browser, so that the player is all displayed in the first screen of the browser.
  • the browser can adjust the player according to the actual size of the first page.
  • the actual size so that the player always appears full screen on the current first screen page.
  • the ratio of the source of the played video can be adjusted in proportion to the appropriate size, or the size of the player can be adaptively oriented in the horizontal or vertical direction on the original source ratio. Dimensional stretching, or select the largest of all source ratios as the most suitable player size.
  • the manner of adjusting the size of the player is not limited, as long as the adjusted player size is always displayed in full screen on the current first screen page.
  • the method for configuring a video player in a webpage improves the size of the player by real-time checking the size of the first screen of the browser, and ensures that the player is all displayed on the first screen of the browser, thereby satisfying the user. The need to watch the full video footage.
  • FIG. 2 is a flowchart of a method for configuring a video player in a webpage according to another embodiment of the present invention, which is a specific implementation manner of the method embodiment shown in FIG.
  • step S210 in response to displaying the video player playback view in the webpage Frequency operation, real-time access to the browser's first screen size.
  • S210 is similar to the content of S110.
  • the first screen of the browser containing the player includes a title navigation area above the player and an interactive bar area below the player, and the height dimensions of the two areas are fixed.
  • step S220 the size of the player is set according to the size of the first screen of the browser, so that the player is all displayed in the first screen of the browser.
  • S220 is similar to the content of S120.
  • this embodiment Based on the width of the first screen of the browser and the height of the title navigation area and the interactive field in the first screen, this embodiment provides a specific implementation manner for setting the size of the player, including S221 to S222.
  • the width of the player can be adaptively adjusted according to the size of the page given by the browser. For example, multiple width gears can be set according to different width ranges, each gear corresponding to a suitable player width value.
  • this embodiment sets three width gear positions for the page width of the browser, and each gear position corresponds to a browser width size and a corresponding player width threshold; wherein each width interval corresponds to A player width threshold, the larger the width value of the width interval, the larger the corresponding player width threshold.
  • Gear position Browser width Player width threshold 1024 Less than or equal to 1024 948 1280 Greater than 1024 and less than 1440 1164 1440 Greater than or equal to 1440 1324
  • the embodiment sets the minimum size of the player height, that is, the first threshold and the highest size of the player height, that is, the second threshold.
  • the first threshold is a constant value such as a pixel size 474;
  • the specific way to determine the height of the player is as follows:
  • the second threshold is determined to be the height of the player.
  • FIG. 3 is a diagram showing a relationship between a player and a screen in the player given in the embodiment.
  • the screen in the player presents two playback effects.
  • A is the full-screen playback of the playback screen in the player (ie, the aspect ratio of the player is the same as the ratio of the source of the video), and B is free on the width of the player (ie, the aspect ratio of the player is larger than the source of the video) proportion).
  • the embodiment further adjusts the size of the picture played in the player.
  • the size of the video playback screen in the player is dynamically adjusted so that the video playback screen is displayed in the player at the maximum screen size in proportion to the source of the video.
  • the size of the play screen can be adaptively adjusted to enlarge the play screen size when the video playlist is collapsed, and the play screen is reduced when the video playlist is expanded. Size, where the source ratio does not change when zoomed in and out.
  • the method for configuring a video player in a webpage provides a method for adjusting the width of the player by the width of the browser, and the title of the browser through the width of the browser, based on the embodiment shown in FIG.
  • the navigation area and the height of the interactive bar area determine the specific implementation of the player height, so that the player adapts to the change of the size of the browser's first screen, giving the user more optimal viewing of the video.
  • FIG. 5 is a schematic structural diagram of an apparatus for configuring a video player in a webpage according to an embodiment of the present invention.
  • the apparatus shown in Figure 5 can be used to perform the method steps of the embodiment shown in Figure 1.
  • the device for configuring a video player in a webpage specifically includes a size obtaining module 510 and a size adjusting module 520.
  • the size obtaining module 510 is configured to acquire the first screen size of the browser in real time in response to the operation of displaying the video player in the webpage, and the size adjustment module 520 is configured to set the size of the player according to the size of the first screen of the browser. So that the player is all displayed in the browser's first screen page.
  • the first screen of the browser includes: a title navigation area and an interaction field.
  • the resizing module 520 may include: a width setting unit 521 for setting the width of the player according to the width of the first screen of the browser; and a height setting unit 522 for using the width of the player. , the height of the browser, the height of the title navigation area, and the height of the interactive bar area set the height of the player.
  • the width setting unit 521 is specifically configured to identify a preset width interval to which the first screen width of the browser belongs, and determine a player width threshold corresponding to the corresponding width interval as a current player width, where each The preset width interval corresponds to a player width threshold, and the larger the width value of the preset width interval, the larger the corresponding player width threshold.
  • the height setting unit 522 may include: a calculation subunit, configured to calculate a difference between a height of the browser minus a height of the title navigation area and the interaction column area; and a height determination subunit for the height If the difference is less than or equal to the first threshold, determining that the first threshold is the height of the player; if the height difference is greater than the first threshold and less than the second threshold, determining that the height difference is the height of the player; if the height difference is greater than Or equal to the second threshold, determining that the second threshold is the height of the player; wherein the second threshold is a ratio of the width of the player to the ratio of the source of the video played by the player.
  • the device for configuring the video player in the webpage may further include: a video screen adjustment module 530, configured to dynamically adjust a size of the video playback screen in the player after setting the size of the player, so that The video playback screen is displayed in the player at the maximum screen size in proportion to the video source.
  • a video screen adjustment module 530 configured to dynamically adjust a size of the video playback screen in the player after setting the size of the player, so that The video playback screen is displayed in the player at the maximum screen size in proportion to the video source.
  • the method embodiment shown in FIG. 2 can be performed by the apparatus for configuring a video player in a webpage as shown in FIG. 6, and the principle of the steps is not described herein.
  • the device for configuring a video player in a webpage provided by the embodiment adjusts the size of the player by real-time checking the size of the first screen of the browser, and ensures that the player is all displayed on the first screen of the browser, thereby satisfying the user. The need to watch the full video footage.
  • the player width is adjusted by the browser width, and the specific implementation manner of the player height is determined by the player width, the title navigation area in the browser, and the height of the interactive column area, so that the player is played.
  • the device adapts to changes in the size of the browser's first screen, giving the user a more optimized view of the video.
  • the above method and apparatus may be implemented in hardware, firmware, or as software or computer code that may be stored in a recording medium such as a CD ROM, RAM, floppy disk, hard disk, or magneto-optical disk, or Computer code downloaded from a network that is originally stored in a remote recording medium or non-transitory machine readable medium and stored in a local recording medium, such that the methods described herein can be stored using a general purpose computer, a dedicated processor Such software processing on a recording medium of programmable or dedicated hardware such as an ASIC or an FPGA.
  • a recording medium such as a CD ROM, RAM, floppy disk, hard disk, or magneto-optical disk
  • Computer code downloaded from a network that is originally stored in a remote recording medium or non-transitory machine readable medium and stored in a local recording medium, such that the methods described herein can be stored using a general purpose computer, a dedicated processor
  • Such software processing on a recording medium of programmable or dedicated hardware such as an ASIC or an FPGA.
  • a computer, processor, microprocessor controller or programmable hardware includes storage components (eg, RAM, ROM, flash memory, etc.) that can store or receive software or computer code, when the software or computer code is The processing methods described herein are implemented when the processor or hardware is accessed and executed. Moreover, when a general purpose computer accesses code for implementing the processing shown herein, the execution of the code converts the general purpose computer into a special purpose computer for performing the processing shown herein.

Landscapes

  • Engineering & Computer Science (AREA)
  • Multimedia (AREA)
  • Signal Processing (AREA)
  • Human Computer Interaction (AREA)
  • User Interface Of Digital Computer (AREA)
  • Information Transfer Between Computers (AREA)

Abstract

提供了一种在网页中配置视频播放器的方法和装置,所述方法包括:响应于在网页中展现视频播放器播放视频的操作,实时获取浏览器的首屏尺寸;依据浏览器的首屏尺寸,设置播放器的尺寸,以使得播放器全部展示在浏览器的首屏页面中。使浏览器首屏中展现的播放器随着浏览器页面的尺寸变化而适应性变化,使用户始终观看到完整的播放器画面。

Description

在网页中配置视频播放器的方法和装置
本申请要求于2015年12月08日提交中国专利局、申请号为201510900283.X的中国专利申请的优先权,其全部内容通过引用结合在本申请中。
技术领域
本专利申请涉及信息处理技术,尤其涉及一种在网页中配置视频播放器的方法和装置。
背景技术
目前,用户的电脑显示器的显示屏尺寸大小不同,所使用的浏览器的工具栏高度不一,这就使得首屏的面积不一。当用户在浏览器的首屏页面打开视频播放器,且浏览器的首屏页面非全屏状态,或是用户拉伸浏览器页面为任意尺寸状态时,播放器常常被切屏,即显示整个原始播放器画面的部分画面,这给用户观看视频的体验带来了不好的影响。
发明内容
本发明的部分实施例提供了一种在网页中配置视频播放器的方法和装置,可使浏览器首屏中展现的播放器随着浏览器页面的尺寸变化而适应性变化,使用户始终观看到完整的播放器画面。
为达到上述目的,本发明的一个实施例提供了一种在网页中配置视频播放器的方法,所述方法包括:响应于在网页中展现视频播放器播放视频的操作,实时获取浏览器的首屏尺寸;依据浏览器的首屏尺寸,设置播放器的尺寸,以使得播放器全部展示在浏览器的首屏页面中。
进一步地,所述浏览器的首屏中包括:标题导航区和互动栏区;所述依据浏览器的首屏尺寸,设置播放器的尺寸,以使得播放器全部展示在浏览器的首屏页面中包括:根据浏览器的首屏宽度设置播放器的宽度;根据播放器的宽度、浏览器高度、所述标题导航区和所述互动栏区的高度设置播放器的高度。
进一步地,所述据浏览器的首屏宽度设置播放器的宽度包括:识别所述浏览器的首屏宽度所属的预设的宽度区间,并将相应宽度区间对应的播放器宽度阈值确定为当前播放器的宽度,其中,每个所述预设的宽 度区间对应一个所述播放器宽度阈值,所述预设的宽度区间的宽度值越大,对应的所述播放器宽度阈值越大。
进一步地,所述根据播放器的宽度以及所述标题导航区和所述互动栏区的高度设置播放器的高度包括:计算所述浏览器的高度减去所述标题导航区和所述互动栏区的高度的差值;若所述高度差值小于或等于第一阈值,则确定所述第一阈值为所述播放器的高度;若所述高度差值大于所述第一阈值且小于第二阈值,则确定所述高度差值为所述播放器的高度;若所述高度差值大于或等于所述第二阈值,则确定所述第二阈值为所述播放器的高度;其中,所述第二阈值为所述播放器的宽度与播放器所播放视频的片源比例的比值。
可选地,在设置完成播放器的尺寸之后还包括:动态调整播放器中视频播放画面的大小,以使得视频播放画面按视频的片源比例在播放器中以最大画面尺寸展示。
本发明的一个实施例还提供了一种在网页中配置视频播放器的装置,所述装置包括:尺寸获取模块,用于响应于在网页中展现视频播放器播放视频的操作,实时获取浏览器的首屏尺寸;尺寸调整模块,用于依据浏览器的首屏尺寸,设置播放器的尺寸,以使得播放器全部展示在浏览器的首屏页面中。
进一步地,所述浏览器的首屏中包括:标题导航区和互动栏区;所述尺寸调整模块包括:宽度设置单元,用于根据浏览器的首屏宽度设置播放器的宽度;高度设置单元,用于根据播放器的宽度、浏览器高度、所述标题导航区和所述互动栏区的高度设置播放器的高度。
进一步地,所述宽度设置单元具体用于,识别所述浏览器的首屏宽度所属的预设的宽度区间,并将相应宽度区间对应的播放器宽度阈值确定为当前播放器的宽度,其中,每个所述预设的宽度区间对应一个所述播放器宽度阈值,且所述预设的宽度区间的宽度值越大,对应的所述播放器宽度阈值越大。
进一步地,所述高度设置单元包括:计算子单元,用于计算所述浏览器的高度减去所述标题导航区和所述互动栏区的高度的差值;高度确定子单元,用于若所述高度差值小于或等于第一阈值,则确定所述第一阈值为所述播放器的高度;若所述高度差值大于所述第一阈值且小于第 二阈值,则确定所述高度差值为所述播放器的高度;若所述高度差值大于或等于所述第二阈值,则确定所述第二阈值为所述播放器的高度;其中,所述第二阈值为所述播放器的宽度与播放器所播放视频的片源比例的比值。
可选地,所述装置还包括:视频画面调整模块,用于在设置完成播放器的尺寸之后,动态调整播放器中视频播放画面的大小,以使得视频播放画面按视频的片源比例在播放器中以最大画面尺寸展示。
本发明部分实施例提供的在网页中配置视频播放器的方法和装置,在每次通过浏览器打开播放器播放视频或在有播放器的浏览器页面调整浏览器的网页大小时,可先获取浏览器的尺寸,然后根据浏览器的尺寸来调整设置播放器的尺寸,以使得播放器始终全部展示在浏览器的首屏页面中。
附图说明
图1为本发明一个实施例中提供的在网页中配置视频播放器的方法流程图;
图2为本发明另一个实施例中提供的在网页中配置视频播放器的方法流程图;
图3为本发明一个实施例中提供的播放器以及播放器内画面的关系样例图;
图4为本发明一个实施例中提供的播放器内画面播放效果样例图;
图5为本发明一个实施例中提供的在网页中配置视频播放器的装置的结构示意图;
图6为本发明另一个实施例中提供的在网页中配置视频播放器的装置的结构示意图。
具体实施方式
本发明部分实施例的基本发明构思是,在利用浏览器打开播放器播放视频时,始终适应浏览器的大小,调整播放器的大小,以使得播放器始终全部展示在浏览器的首屏页面中。其中,浏览的首屏页面为浏览器打开后自动展示的第一屏页面。
实施例一
图1为本发明一个实施例中提供的在网页中配置视频播放器的方法流 程图,该方法的执行主体可以为应用在各种PC上的浏览器设备,或集成在这些浏览器设备中的装置。本方案中以浏览器作为执行主体进行说明。
参照图1,在步骤S110,响应于在网页中展现视频播放器播放视频的操作,实时获取浏览器的首屏尺寸。
本实施例中,所述的浏览器首屏的尺寸是指通过浏览器打开播放器的页面中第一屏页面的像素尺寸。现有在浏览器中展现播放器的处理方法,是按照固定的播放器画面比例进行展现,并且在用户对浏览器进行拖拽拉伸时,相应的播放器始终维持固定画面大小来展示。这样就会造成,当首屏页面尺寸被用户调整到较少尺寸时,播放器页面无法全部在浏览器中展现。为了弥补现有技术的缺陷,本实施例中,在通过浏览器页面展现播放器时,实时的获取浏览器的首屏页面尺寸,并依据当前浏览器页面的实际尺寸进行播放器尺寸的适应性调整。
步骤S120,依据浏览器的首屏尺寸,设置播放器的尺寸,以使得播放器全部展示在浏览器的首屏页面中。
在获取到浏览器刚刚打开播放器时的首屏页面大小,或是用户有对浏览器的页面大小进行调整导致的首屏尺寸发生变化时,浏览可根据首屏页面的实际尺寸调整播放器的实际尺寸,从而使播放器始终全屏展现于当前首屏页面中。
具体地,在调整播放器的尺寸时,可根据播放视频的片源比例进行等比例调整直至调整到合适尺寸,也可在原有片源比例上对播放器尺寸进行适应性的横向或纵向上的尺寸拉伸,又或者选取所有片源比例中尺寸最大的作为最合适的播放器的尺寸。本实施例对于调整播放器的尺寸的方式不做限定,只要调整后的播放器尺寸始终全屏展现于当前首屏页面中。
本实施例提供的在网页中配置视频播放器的方法,通过实时检查获取浏览器的首屏尺寸,来调整播放器的尺寸,保证播放器全部展示在浏览器的首屏页面中,从而满足用户观看完整视频画面的需求。
实施例二
图2为本发明另一个实施例中提供的在网页中配置视频播放器的方法流程图,是图1所示方法实施例的一种具体实现方式。
如图2所示,在步骤S210,响应于在网页中展现视频播放器播放视 频的操作,实时获取浏览器的首屏尺寸。S210与S110的内容相似。
通常,在包含播放器的浏览器的首屏中包括:位于播放器上方的标题导航区和位于播放器下方的互动栏区,且这两个区域的高度尺寸是固定不变的。
步骤S220,依据浏览器的首屏尺寸,设置播放器的尺寸,以使得播放器全部展示在浏览器的首屏页面中。S220与S120的内容相似。
基于浏览器首屏的宽度以及首屏中标题导航区和互动栏区的高度尺寸,本实施例给出了设置播放器的尺寸的具体实现方式,包括S221~S222。
S221,根据浏览器的首屏宽度设置播放器的宽度。
在获取到浏览器的宽度后,可根据浏览器给予的页面展现尺寸,适应性调整播放器的宽度。例如,可根据不同宽度范围设置多个宽度档位,每个档位对应一个合适的播放器宽度值。
例如,如表1所示,本实施例对浏览器的页面宽度设置了三个宽度档位,每个档位对应一个浏览器宽度尺寸和相应的播放器宽度阈值;其中,每个宽度区间对应一个播放器宽度阈值,宽度区间的宽度值越大,对应的播放器宽度阈值越大。在获取到当前浏览器的首屏宽度尺寸后,可识别浏览器的首屏宽度所属于表1中哪个预设的宽度区间,并将相应宽度区间对应的播放器宽度阈值确定为当前播放器的宽度。
表1播放器宽度配置表
档位 浏览器宽度 播放器宽度阈值
1024 小于或等于1024 948
1280 大于1024且小于1440 1164
1440 大于或等于1440 1324
S222,根据播放器的宽度、浏览器高度、标题导航区和互动栏区的高度设置播放器的高度。
在设置播放器的高度时,既要考虑到当前浏览器首屏给予播放器的可用高度,又要考虑播放器宽度,保证播放画面具有较合适的长宽比,给予用户合适的观看效果。
例如,先计算浏览器的高度减去标题导航区和互动栏区的高度的差值;该差值可理解为当前浏览器首屏给予播放器的可用高度。同时,为 了保证播放画质,本实施例预先设置了播放器高度的最低尺寸,即第一阈值以及播放器高度的最高尺寸,即第二阈值。其中第一阈值为恒定值如像素尺寸474;第二阈值为与播放器宽度具有比例关系的尺寸,如为播放器的宽度与播放器所播放视频的片源比例的比值。例如,当播放器的宽度为W,视频的片源比例为a,则播放器的高度=W/a。
基于浏览器的高度减去标题导航区和互动栏区的高度的差值,以及预设的第一阈值和第二阈值,下面给出确定播放器高度的具体方式为:
若高度差值小于或等于第一阈值,则确定第一阈值为播放器的高度;若高度差值大于第一阈值且小于第二阈值,则确定高度差值为播放器的高度;若高度差值大于或等于第二阈值,则确定第二阈值为播放器的高度。
如图3所示,为本实施例中给出的播放器以及播放器内画面的关系样例图。本实施例中,当片源比例a确定后,如图4所示,播放器内画面就会呈现出两种播放效果。图4中,A为播放画面在播放器中全屏播放(即播放器长宽比例与视频的片源比例相同),B为播放器宽度上有空余(即播放器长宽比例大于视频的片源比例)。
在确定播放器的尺寸后,为了使得播放器播放的视频画面效果更优,本实施例还对播放器中播放的画面尺寸进行了进一步调整。例如,动态调整播放器中视频播放画面的大小,以使得视频播放画面按视频的片源比例在播放器中以最大画面尺寸展示。例如,在用户收起或展开位于播放器中的视频播放列表时,可适应性调整播放画面的大小,以使在视频播放列表收起时放大播放画面尺寸,在视频播放列表展开时缩小播放画面尺寸,其中,放大和缩小时,片源比例不变。
本实施例提供的在网页中配置视频播放器的方法,在图1所示实施例的基础上,进一步给出了通过浏览器宽度来调整播放器宽度,以及通过播放器宽度,浏览器中标题导航区以及互动栏区高度确定播放器高度的具体实现方式,使得播放器自适应于浏览器首屏尺寸的变化而变化,给予用户更优化的观看视频的效果。
实施例二
图5为本发明一个实施例提供的在网页中配置视频播放器的装置结构示意图。图5所示装置可用于执行如图1所示实施例的方法步骤。
参照图5,该在网页中配置视频播放器的装置具体包括尺寸获取模块510和尺寸调整模块520。
尺寸获取模块510,用于响应于在网页中展现视频播放器播放视频的操作,实时获取浏览器的首屏尺寸;尺寸调整模块520,用于依据浏览器的首屏尺寸,设置播放器的尺寸,以使得播放器全部展示在浏览器的首屏页面中。
进一步地,上述浏览器的首屏中包括:标题导航区和互动栏区。在此基础上,如图6所示,尺寸调整模块520可包括:宽度设置单元521,用于根据浏览器的首屏宽度设置播放器的宽度;高度设置单元522,用于根据播放器的宽度、浏览器高度、标题导航区和互动栏区的高度设置播放器的高度。
进一步地,上述宽度设置单元521具体用于,识别浏览器的首屏宽度所属的预设的宽度区间,并将相应宽度区间对应的播放器宽度阈值确定为当前播放器的宽度,其中,每个预设的宽度区间对应一个播放器宽度阈值,且预设的宽度区间的宽度值越大,对应的播放器宽度阈值越大。
进一步地,上述高度设置单元522可包括:计算子单元,用于计算浏览器的高度减去所述标题导航区和所述互动栏区的高度的差值;高度确定子单元,用于若高度差值小于或等于第一阈值,则确定第一阈值为播放器的高度;若高度差值大于第一阈值且小于第二阈值,则确定高度差值为播放器的高度;若高度差值大于或等于第二阈值,则确定第二阈值为播放器的高度;其中,第二阈值为播放器的宽度与播放器所播放视频的片源比例的比值。
可选地,上述在网页中配置视频播放器的装置中,还可包括:视频画面调整模块530,用于在设置完成播放器的尺寸之后,动态调整播放器中视频播放画面的大小,以使得视频播放画面按视频的片源比例在播放器中以最大画面尺寸展示。
图2所示方法实施例可通过图6所示的在网页中配置视频播放器的装置执行完成,在此对其步骤原理不做赘述。
本实施例提供的在网页中配置视频播放器的装置,通过实时检查获取浏览器的首屏尺寸,来调整播放器的尺寸,保证播放器全部展示在浏览器的首屏页面中,从而满足用户观看完整视频画面的需求。
进一步地,图6所示装置实施例中,通过浏览器宽度来调整播放器宽度,以及通过播放器宽度,浏览器中标题导航区以及互动栏区高度确定播放器高度的具体实现方式,使得播放器自适应于浏览器首屏尺寸的变化而变化,给予用户更优化的观看视频的效果。
上述根据本发明部分实施例的方法和装置可在硬件、固件中实现,或者被实现为可存储在记录介质(诸如CD ROM、RAM、软盘、硬盘或磁光盘)中的软件或计算机代码,或者被实现通过网络下载的原始存储在远程记录介质或非暂时机器可读介质中并将被存储在本地记录介质中的计算机代码,从而在此描述的方法可被存储在使用通用计算机、专用处理器或者可编程或专用硬件(诸如ASIC或FPGA)的记录介质上的这样的软件处理。可以理解,计算机、处理器、微处理器控制器或可编程硬件包括可存储或接收软件或计算机代码的存储组件(例如,RAM、ROM、闪存等),当所述软件或计算机代码被计算机、处理器或硬件访问且执行时,实现在此描述的处理方法。此外,当通用计算机访问用于实现在此示出的处理的代码时,代码的执行将通用计算机转换为用于执行在此示出的处理的专用计算机。
以上所述,仅为本发明部分实施例的具体实施方式,但本发明的保护范围并不局限于此,任何熟悉本技术领域的技术人员在本发明揭露的技术范围内,可轻易想到变化或替换,都应涵盖在本发明的保护范围之内。因此,本发明的保护范围应以所述权利要求的保护范围为准。

Claims (10)

  1. 一种在网页中配置视频播放器的方法,包括:
    响应于在网页中展现视频播放器播放视频的操作,实时获取浏览器的首屏尺寸;
    依据浏览器的首屏尺寸,设置播放器的尺寸,以使得播放器全部展示在浏览器的首屏页面中。
  2. 根据权利要求1所述的方法,其中,所述浏览器的首屏中包括:标题导航区和互动栏区;
    所述依据浏览器的首屏尺寸,设置播放器的尺寸,以使得播放器全部展示在浏览器的首屏页面中包括:
    根据浏览器的首屏宽度设置播放器的宽度;
    根据播放器的宽度、浏览器高度、所述标题导航区和所述互动栏区的高度设置播放器的高度。
  3. 根据权利要求2所述的方法,其中,所述据浏览器的首屏宽度设置播放器的宽度包括:
    识别所述浏览器的首屏宽度所属的预设的宽度区间,并将相应宽度区间对应的播放器宽度阈值确定为当前播放器的宽度,其中,每个所述预设的宽度区间对应一个所述播放器宽度阈值,所述预设的宽度区间的宽度值越大,对应的所述播放器宽度阈值越大。
  4. 根据权利要求2或3所述的方法,其中,所述根据播放器的宽度以及所述标题导航区和所述互动栏区的高度设置播放器的高度包括:
    计算所述浏览器的高度减去所述标题导航区和所述互动栏区的高度的差值;
    若所述高度差值小于或等于第一阈值,则确定所述第一阈值为所述播放器的高度;
    若所述高度差值大于所述第一阈值且小于第二阈值,则确定所述高度差值为所述播放器的高度;
    若所述高度差值大于或等于所述第二阈值,则确定所述第二阈值为所述播放器的高度;
    其中,所述第二阈值为所述播放器的宽度与播放器所播放视频的片源比例的比值。
  5. 根据权利要求1-4中任一项所述的方法,其中,在设置完成播放 器的尺寸之后还包括:
    动态调整播放器中视频播放画面的大小,以使得视频播放画面按视频的片源比例在播放器中以最大画面尺寸展示。
  6. 一种在网页中配置视频播放器的装置,其中,所述装置包括:
    尺寸获取模块,用于响应于在网页中展现视频播放器播放视频的操作,实时获取浏览器的首屏尺寸;
    尺寸调整模块,用于依据浏览器的首屏尺寸,设置播放器的尺寸,以使得播放器全部展示在浏览器的首屏页面中。
  7. 根据权利要求6所述的装置,其中,所述浏览器的首屏中包括:标题导航区和互动栏区;所述尺寸调整模块包括:
    宽度设置单元,用于根据浏览器的首屏宽度设置播放器的宽度;
    高度设置单元,用于根据播放器的宽度、浏览器高度、所述标题导航区和所述互动栏区的高度设置播放器的高度。
  8. 根据权利要求7所述的装置,其中,所述宽度设置单元具体用于,识别所述浏览器的首屏宽度所属的预设的宽度区间,并将相应宽度区间对应的播放器宽度阈值确定为当前播放器的宽度,其中,每个所述预设的宽度区间对应一个所述播放器宽度阈值,且所述预设的宽度区间的宽度值越大,对应的所述播放器宽度阈值越大。
  9. 根据权利要求7或8所述的装置,其中,所述高度设置单元包括:
    计算子单元,用于计算所述浏览器的高度减去所述标题导航区和所述互动栏区的高度的差值;
    高度确定子单元,用于若所述高度差值小于或等于第一阈值,则确定所述第一阈值为所述播放器的高度;若所述高度差值大于所述第一阈值且小于第二阈值,则确定所述高度差值为所述播放器的高度;若所述高度差值大于或等于所述第二阈值,则确定所述第二阈值为所述播放器的高度;其中,所述第二阈值为所述播放器的宽度与播放器所播放视频的片源比例的比值。
  10. 根据权利要求6-9中任一项所述的装置,其中,所述装置还包括:
    视频画面调整模块,用于在设置完成播放器的尺寸之后,动态调整播放器中视频播放画面的大小,以使得视频播放画面按视频的片源比例 在播放器中以最大画面尺寸展示。
PCT/CN2016/089510 2015-12-08 2016-07-10 在网页中配置视频播放器的方法和装置 WO2017096893A1 (zh)

Priority Applications (1)

Application Number Priority Date Filing Date Title
US15/243,330 US20170161232A1 (en) 2015-12-08 2016-08-22 Method and electronic device for configuring a video player in a web page

Applications Claiming Priority (2)

Application Number Priority Date Filing Date Title
CN201510900283.XA CN105898510A (zh) 2015-12-08 2015-12-08 在网页中配置视频播放器的方法和装置
CN201510900283.X 2015-12-08

Related Child Applications (1)

Application Number Title Priority Date Filing Date
US15/243,330 Continuation US20170161232A1 (en) 2015-12-08 2016-08-22 Method and electronic device for configuring a video player in a web page

Publications (1)

Publication Number Publication Date
WO2017096893A1 true WO2017096893A1 (zh) 2017-06-15

Family

ID=57002159

Family Applications (1)

Application Number Title Priority Date Filing Date
PCT/CN2016/089510 WO2017096893A1 (zh) 2015-12-08 2016-07-10 在网页中配置视频播放器的方法和装置

Country Status (2)

Country Link
CN (1) CN105898510A (zh)
WO (1) WO2017096893A1 (zh)

Cited By (4)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN111770381A (zh) * 2020-06-04 2020-10-13 北京达佳互联信息技术有限公司 视频编辑的提示方法、装置以及电子设备
CN112819536A (zh) * 2021-02-01 2021-05-18 北京奇艺世纪科技有限公司 效果广告展示方法、装置、计算机设备和存储介质
CN113438533A (zh) * 2021-05-31 2021-09-24 北京达佳互联信息技术有限公司 一种视频展示方法、装置、电子设备及存储介质
CN114697726A (zh) * 2022-03-15 2022-07-01 青岛海信宽带多媒体技术有限公司 一种带有视频窗口的页面显示方法和智能机顶盒

Families Citing this family (2)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN106791180A (zh) * 2017-01-19 2017-05-31 努比亚技术有限公司 移动终端的应用的视频窗口的调整方法及调整装置
CN113055747A (zh) * 2021-03-29 2021-06-29 重庆锐明信息技术有限公司 基于视频客户端跨浏览器集成系统

Citations (6)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN102073650A (zh) * 2009-11-25 2011-05-25 阿里巴巴集团控股有限公司 一种网页自适应调节的方法和设备
CN102314502A (zh) * 2011-09-01 2012-01-11 百度在线网络技术(北京)有限公司 一种用于在移动终端上显示网页主体内容的方法和设备
US8621422B1 (en) * 2013-05-07 2013-12-31 Axure Software Solutions, Inc. Environment for responsive graphical designs
CN103699657A (zh) * 2013-12-26 2014-04-02 乐视网信息技术(北京)股份有限公司 一种网页多媒体播放处理方法及装置
CN104267887A (zh) * 2014-09-13 2015-01-07 重庆市科学技术研究院 基于应用窗口尺寸参数的应用页面自适应排版显示方法
WO2015048154A1 (en) * 2013-09-30 2015-04-02 Google Inc. Automatically determining a size for a content item for a web page

Patent Citations (6)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN102073650A (zh) * 2009-11-25 2011-05-25 阿里巴巴集团控股有限公司 一种网页自适应调节的方法和设备
CN102314502A (zh) * 2011-09-01 2012-01-11 百度在线网络技术(北京)有限公司 一种用于在移动终端上显示网页主体内容的方法和设备
US8621422B1 (en) * 2013-05-07 2013-12-31 Axure Software Solutions, Inc. Environment for responsive graphical designs
WO2015048154A1 (en) * 2013-09-30 2015-04-02 Google Inc. Automatically determining a size for a content item for a web page
CN103699657A (zh) * 2013-12-26 2014-04-02 乐视网信息技术(北京)股份有限公司 一种网页多媒体播放处理方法及装置
CN104267887A (zh) * 2014-09-13 2015-01-07 重庆市科学技术研究院 基于应用窗口尺寸参数的应用页面自适应排版显示方法

Cited By (7)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN111770381A (zh) * 2020-06-04 2020-10-13 北京达佳互联信息技术有限公司 视频编辑的提示方法、装置以及电子设备
CN111770381B (zh) * 2020-06-04 2022-08-05 北京达佳互联信息技术有限公司 视频编辑的提示方法、装置以及电子设备
CN112819536A (zh) * 2021-02-01 2021-05-18 北京奇艺世纪科技有限公司 效果广告展示方法、装置、计算机设备和存储介质
CN112819536B (zh) * 2021-02-01 2023-09-01 北京奇艺世纪科技有限公司 效果广告展示方法、装置、计算机设备和存储介质
CN113438533A (zh) * 2021-05-31 2021-09-24 北京达佳互联信息技术有限公司 一种视频展示方法、装置、电子设备及存储介质
CN113438533B (zh) * 2021-05-31 2022-11-22 北京达佳互联信息技术有限公司 一种视频展示方法、装置、电子设备及存储介质
CN114697726A (zh) * 2022-03-15 2022-07-01 青岛海信宽带多媒体技术有限公司 一种带有视频窗口的页面显示方法和智能机顶盒

Also Published As

Publication number Publication date
CN105898510A (zh) 2016-08-24

Similar Documents

Publication Publication Date Title
WO2017096893A1 (zh) 在网页中配置视频播放器的方法和装置
WO2017211250A1 (zh) 图像的叠加显示方法和系统
US8751933B2 (en) Video and audio waveform user interface
WO2016095384A1 (zh) 一种弹幕显示方法及系统
TWI699119B (zh) 用於產生經圖像穩定化之視訊的方法與攝像機
TW200715853A (en) Reproduction device, reproduction method, program, program storage medium, data structure, and recording medium fabrication method
US20160269777A1 (en) Method and device for adjusting video playback interface
WO2017088472A1 (zh) 一种播放视频的处理方法及装置
CN104469178B (zh) 一种图像显示方法及电子设备
CN105100923A (zh) 视频播放方法及装置
WO2017096898A1 (zh) 广告展示方法及装置
WO2011081036A1 (ja) 画像処理装置、画像処理方法及び画像処理プログラム
TW201421344A (zh) 使用者介面產生裝置與相關方法
US11902694B2 (en) Method and apparatus for making ghosting special effect for movie, and electronic device and medium
CN104574491A (zh) 一种基于移动终端平台的多格特效渲染方法及系统
US20170161232A1 (en) Method and electronic device for configuring a video player in a web page
WO2017101414A1 (zh) 基于安卓平台的多媒体播放方法、装置及移动终端设备
RU2018141220A (ru) Устройство и способ аудиообработки, и программа
US10506284B2 (en) Visual utility analytic method and related eye tracking device and system
WO2016014070A1 (en) Adjusting a projection area of a projector
CN105843485B (zh) 页面显示的方法及装置
CN108810513B (zh) 全景视频的画面质量显示方法及装置
WO2017161771A1 (zh) 一种广告数据的展示方法和装置
WO2017096800A1 (zh) 一种视频字幕的调节方法及装置
WO2017113593A1 (zh) 基于智能电视的动画菜单的处理方法及装置

Legal Events

Date Code Title Description
121 Ep: the epo has been informed by wipo that ep was designated in this application

Ref document number: 16872093

Country of ref document: EP

Kind code of ref document: A1

NENP Non-entry into the national phase

Ref country code: DE

122 Ep: pct application non-entry in european phase

Ref document number: 16872093

Country of ref document: EP

Kind code of ref document: A1