CN108282683A - 一种视频界面显示方法及装置 - Google Patents

一种视频界面显示方法及装置 Download PDF

Info

Publication number
CN108282683A
CN108282683A CN201710007619.9A CN201710007619A CN108282683A CN 108282683 A CN108282683 A CN 108282683A CN 201710007619 A CN201710007619 A CN 201710007619A CN 108282683 A CN108282683 A CN 108282683A
Authority
CN
China
Prior art keywords
page
target area
roll value
indicate
value
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
Application number
CN201710007619.9A
Other languages
English (en)
Other versions
CN108282683B (zh
Inventor
何飞
Current Assignee (The listed assignees may be inaccurate. Google has not performed a legal analysis and makes no representation or warranty as to the accuracy of the list.)
Tencent Technology Shenzhen Co Ltd
Original Assignee
Tencent Technology Shenzhen Co Ltd
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 Tencent Technology Shenzhen Co Ltd filed Critical Tencent Technology Shenzhen Co Ltd
Priority to CN201710007619.9A priority Critical patent/CN108282683B/zh
Priority to PCT/CN2017/117638 priority patent/WO2018126899A1/zh
Publication of CN108282683A publication Critical patent/CN108282683A/zh
Priority to US16/375,432 priority patent/US20190230311A1/en
Application granted granted Critical
Publication of CN108282683B publication Critical patent/CN108282683B/zh
Active legal-status Critical Current
Anticipated expiration legal-status Critical

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/41—Structure of client; Structure of client peripherals
    • H04N21/426—Internal components of the client ; Characteristics thereof
    • H04N21/42653—Internal components of the client ; Characteristics thereof for processing graphics
    • 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
    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F16/00—Information retrieval; Database structures therefor; File system structures therefor
    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F16/00—Information retrieval; Database structures therefor; File system structures therefor
    • G06F16/70—Information retrieval; Database structures therefor; File system structures therefor of video data
    • G06F16/74—Browsing; Visualisation therefor
    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F16/00—Information retrieval; Database structures therefor; File system structures therefor
    • G06F16/90—Details of database functions independent of the retrieved data types
    • G06F16/95—Retrieval from the web
    • G06F16/957—Browsing optimisation, e.g. caching or content distillation
    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F3/00—Input arrangements for transferring data to be processed into a form capable of being handled by the computer; Output arrangements for transferring data from processing unit to output unit, e.g. interface arrangements
    • G06F3/01—Input arrangements or combined input and output arrangements for interaction between user and computer
    • G06F3/048—Interaction techniques based on graphical user interfaces [GUI]
    • G06F3/0481—Interaction techniques based on graphical user interfaces [GUI] based on specific properties of the displayed interaction object or a metaphor-based environment, e.g. interaction with desktop elements like windows or icons, or assisted by a cursor's changing behaviour or appearance
    • G06F3/0483—Interaction with page-structured environments, e.g. book metaphor
    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F3/00—Input arrangements for transferring data to be processed into a form capable of being handled by the computer; Output arrangements for transferring data from processing unit to output unit, e.g. interface arrangements
    • G06F3/01—Input arrangements or combined input and output arrangements for interaction between user and computer
    • G06F3/048—Interaction techniques based on graphical user interfaces [GUI]
    • G06F3/0484—Interaction techniques based on graphical user interfaces [GUI] for the control of specific functions or operations, e.g. selecting or manipulating an object, an image or a displayed text element, setting a parameter value or selecting a range
    • G06F3/0485—Scrolling or panning
    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F40/00—Handling natural language data
    • G06F40/10—Text processing
    • G06F40/103—Formatting, i.e. changing of presentation of documents
    • G—PHYSICS
    • G09—EDUCATION; CRYPTOGRAPHY; DISPLAY; ADVERTISING; SEALS
    • G09G—ARRANGEMENTS OR CIRCUITS FOR CONTROL OF INDICATING DEVICES USING STATIC MEANS TO PRESENT VARIABLE INFORMATION
    • G09G5/00—Control arrangements or circuits for visual indicators common to cathode-ray tube indicators and other visual indicators
    • G09G5/34—Control arrangements or circuits for visual indicators common to cathode-ray tube indicators and other visual indicators for rolling or scrolling
    • 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/41—Structure of client; Structure of client peripherals
    • H04N21/426—Internal components of the client ; Characteristics thereof
    • 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
    • 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/4312—Generation 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/4316—Generation 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 displaying supplemental content in a region of the screen, e.g. an advertisement in a separate window
    • 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/472—End-user interface for requesting content, additional data or services; End-user interface for interacting with content, e.g. for content reservation or setting reminders, for requesting event notification, for manipulating displayed content
    • 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/472—End-user interface for requesting content, additional data or services; End-user interface for interacting with content, e.g. for content reservation or setting reminders, for requesting event notification, for manipulating displayed content
    • H04N21/47205—End-user interface for requesting content, additional data or services; End-user interface for interacting with content, e.g. for content reservation or setting reminders, for requesting event notification, for manipulating displayed content for manipulating displayed content, e.g. interacting with MPEG-4 objects, editing locally
    • 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
    • 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

Abstract

本发明实施例公开了一种视频界面显示方法及装置，所述方法包括：获取待显示页面中的目标区域，目标区域包括视频界面和页面元素；确定目标区域在显示屏幕中的待显示区域，并基于待显示区域获取待显示页面的滚动值；基于待显示页面的滚动值，将目标区域移动至待显示区域；在显示屏幕中除待显示区域以外的其他区域填充预设的显示信息。采用本发明实施例，通过在待显示区域显示视频界面和页面元素，可提高播放体验。

Description

一种视频界面显示方法及装置
技术领域
本发明涉及电子技术领域，尤其涉及一种视频界面显示方法及装置。
背景技术
视频播放客户端(例如腾讯视频播放客户端)可以向用户播放视频，以满足用户需求。为了支持页面交互，视频播放客户端可以将视频界面和页面元素(例如广告跳转按钮，跳过广告按钮等)合成渲染在同一个待显示页面，则用户在观看视频的同时可以点击广告跳转按钮进入广告页面，或者点击跳过广告按钮显示非广告内容，以实现页面交互。但是不同视频播放客户端配置有不同的播放控制面板，无法向用户提供统一的视频播放界面，播放体验交差。
发明内容
本发明实施例所要解决的技术问题在于，提供一种视频界面显示方法及装置，通过在待显示区域显示视频界面和页面元素，可提高播放体验。
为了解决上述技术问题，本发明实施例提供了一种视频界面显示方法，所述方法包括：
获取待显示页面中的目标区域，所述目标区域包括视频界面和页面元素；
确定所述目标区域在显示屏幕中的待显示区域，并基于所述待显示区域获取所述待显示页面的滚动值；
基于所述待显示页面的滚动值，将所述目标区域移动至所述待显示区域；
在所述显示屏幕中除所述待显示区域以外的其他区域填充预设的显示信息。
相应地，本发明实施例还提供了一种视频界面显示装置，所述装置包括：
获取单元，用于获取待显示页面中的目标区域，所述目标区域包括视频界面和页面元素；
确定单元，用于确定所述目标区域在显示屏幕中的待显示区域，并基于所述待显示区域获取所述待显示页面的滚动值；
移动单元，用于基于所述待显示页面的滚动值，将所述目标区域移动至所述待显示区域；
填充单元，用于在所述显示屏幕中除所述待显示区域以外的其他区域填充预设的显示信息。
实施本发明实施例，通过获取待显示页面中的目标区域，目标区域包括视频界面和页面元素，确定目标区域在显示屏幕中的待显示区域，并基于待显示区域获取待显示页面的滚动值，基于待显示页面的滚动值，将目标区域移动至待显示区域，在显示屏幕中除待显示区域以外的其他区域填充预设的显示信息，可提高播放体验。
附图说明
为了更清楚地说明本发明实施例或现有技术中的技术方案，下面将对实施例或现有技术描述中所需要使用的附图作简单地介绍，显而易见地，下面描述中的附图仅仅是本发明的一些实施例，对于本领域普通技术人员来讲，在不付出创造性劳动的前提下，还可以根据这些附图获得其他的附图；
图1是本发明实施例中提供的一种视频界面显示方法的流程示意图；
图2是本发明实施例中提供的一种待显示页面的界面示意图；
图3是本发明另一实施例中提供的一种界面示意图；
图4是本发明另一实施例中提供的一种界面示意图；
图5是本发明实施例中提供的一种视频界面显示装置的结构示意图；
图6是本发明实施例中提供的一种终端的结构示意图。
具体实施方式
下面将结合本发明实施例中的附图，对本发明实施例中的技术方案进行清楚、完整地描述，显然，所描述的实施例仅仅是本发明一部分实施例，而不是全部的实施例。基于本发明中的实施例，本领域普通技术人员在没有作出创造性劳动前提下所获得的所有其他实施例，都属于本发明保护的范围。
本发明实施例提供了一种视频界面显示方法，获取待显示页面中的目标区域，目标区域包括视频界面和页面元素，确定目标区域在显示屏幕中的待显示区域，并基于待显示区域获取待显示页面的滚动值，基于待显示页面的滚动值，将目标区域移动至待显示区域，在显示屏幕中除待显示区域以外的其他区域填充预设的显示信息，可提高播放体验。
上述视频界面显示方法可以运行在个人电脑、智能手机(如Android手机、iOS手机等)、平板电脑、掌上电脑、移动互联网设备(MID，Mobile Internet Devices)或穿戴式智能设备等终端运行的客户端中。客户端可以包括视频播放客户端、即时通信客户端或者SNS(Social Networking Services，社会性网络服务)客户端等，该客户端可以显示视频界面，该视频界面用于播放视频。
请参见图1，图1是本发明实施例公开的一种视频界面显示方法的流程示意图。如图1所示，该视频界面显示方法至少可以包括以下步骤：
S101，获取待显示页面中的目标区域，目标区域包括视频界面和页面元素。
终端可以获取待显示页面中的目标区域，其中目标区域可以包括视频界面和页面元素，视频界面可以用于播放视频，页面元素可以用于描述该视频的相关信息，例如广告剩余播放时长、点击进入广告页面或者跳转广告等。具体实现中，终端可以通过用户输入的关键字搜索得到待显示页面，可选的，终端还可以在检测到用户对访问路径或者地址信息等的点击操作时，获取该访问路径或者地址信息对应的待显示页面。
以图2所示的待显示页面的界面示意图为例，待显示页面可以包括菜单栏、视频界面、页面元素以及该视频界面的关联信息。其中，菜单栏可以位于待显示页面的顶端，菜单栏可以包括视频播放客户端的客户端标识、用于指示登录视频播放服务器的登录按钮或者搜索引擎等。视频界面和页面元素可以位于待显示页面的同一区域中，例如视频界面和页面元素位于菜单栏的下方。该视频界面的关联信息可以位于视频界面的下方，关联信息可以包括该视频界面所播放视频的视频名称、当前播放集数或者该视频界面的播放次数总和等。终端获取到待显示页面之后，可以获取待显示页面中包含视频界面和页面元素的区域，并将该区域作为目标区域。
S102，确定目标区域在显示屏幕中的待显示区域，并基于待显示区域获取待显示页面的滚动值。
终端可以确定目标区域在显示屏幕中的待显示区域，并基于待显示区域获取待显示页面的滚动值。其中，滚动值用于指示待显示页面中各个区域的位置，基于待显示区域获取的待显示页面的滚动值可以为更新后的待显示页面的滚动值。
示例性的，在待显示页面的排版中，菜单栏位于待显示页面的顶端，目标区域位于菜单栏的下方，基于待显示页面的初始滚动值，终端在显示屏幕中显示的待显示页面可以如图1所示。待显示页面的高度大于显示屏幕的高度，显示屏幕无法完整显示整个待显示页面，为了提高播放体验，终端可以将目标区域显示在显示屏幕的待显示区域，其中待显示区域可以为终端预先设置的区域，例如待显示区域可以为显示屏幕的中间区域，进一步的，终端可以获取目标区域位于待显示区域时待显示页面的滚动值。
可选的，终端可以基于待显示区域对待显示页面的滚动值进行更新，得到待显示页面更新后的滚动值。
以图3所示的界面示意图为例，第一区域可以表示完整的待显示页面，例如网页；第二区域可以表示目标区域，即包含视频界面和页面元素的区域；第三区域可以表示待显示区域，作为待显示页面显示的视口，位于待显示区域的页面内容可以显示在显示屏幕中。终端可以基于待显示区域对待显示页面的滚动值进行更新，得到待显示页面更新后的滚动值，例如终端可以将待显示页面进行移动，使得目标区域位于待显示区域。
可选的，待显示页面更新后的滚动值可以表示如下：
newScrollyY＝videoY-(webviewHeight-videoHeight)/2
newScrollyX＝videoX-(webviewLength-videoLength)/2
其中，newScrollyY表示待显示页面更新后的滚动值中的Y值，videoY表示目标区域的原Y值，webviewHeight表示显示屏幕的高度，videoHeight表示目标区域的高度；newScrollyX表示待显示页面更新后的滚动值中的X值，videoX表示目标区域的原X值，webviewLength表示显示屏幕的长度，videoLength表示目标区域的长度。
可选的，待显示页面更新后的滚动值可以表示如下：
newScrollyY′＝min(max(0,newScrollyY),webHeight)
newScrollyX′＝min(max(0,newScrollyX),webLength)
其中，newScrolYly表示待显示页面最近更新后的滚动值中的Y值，newScrollyY表示待显示页面上一次更新后的滚动值中的Y值，webHeight表示待显示页面的高度；newScrollyX′表示待显示页面最近更新后的滚动值中的X值，newScrollyX表示待显示页面上一次更新后的滚动值中的X值，webLength表示待显示页面的长度。
本发明实施例通过再次对待显示页面的滚动值进行更新，可确保基于更新后的待显示页面的滚动值，目标区域位于待显示页面中。
可选的，终端基于待显示区域对待显示页面的滚动值进行更新之后，当基于更新后的滚动值确定目标区域位于显示屏幕的其他区域中时，终端可以对目标区域进行移动，使得移动后的目标区域位于显示屏幕的待显示区域中。
以图3所示的界面示意图为例，终端基于更新后的待显示页面的滚动值对图3中处于第一状态的待显示页面进行移动，移动后的待显示页面可以如图3中处于第二状态的待显示页面所示，终端可以确定移动后的待显示页面中第二区域位于显示屏幕的上方，并非位于显示屏幕的中间区域，即第二区域位于显示屏幕的其他区域，则终端可以对第二区域进行移动，使得移动后的第二区域位于显示屏幕的待显示区域中。
可选的，目标区域更新后的滚动值可以表示如下：
int offsetY＝(webviewHeight-videoHeight)/2-videoY+ScrollY
int offsetX＝(webviewLength-videoLength)/2-videoX+ScrollX
其中，int offsetY表示目标区域更新后的滚动值中的Y值，webviewHeight表示显示屏幕的高度，videoHeight表示目标区域的高度，videoY表示目标区域的原Y值，ScrollY表示待显示页面的滚动值中的Y值；int offsetX表示目标区域更新后的滚动值中的X值，webviewLength表示显示屏幕的长度，videoLength表示目标区域的长度，videoX表示目标区域的原X值，ScrollX表示待显示页面的滚动值中的X值。
可选的，终端可以基于待显示区域，对目标区域的滚动值进行更新，得到目标区域更新后的滚动值。具体实现中，终端可以基于待显示区域，对目标区域的滚动值进行更新，使得基于目标区域更新后的滚动值，目标区域可以移动至待显示区域。
可选的，终端基于待显示区域，对目标区域的滚动值进行更新之后，当基于目标区域更新后的滚动值确定目标区域位于显示屏幕的其他区域中时，终端可以对待显示页面的滚动值进行更新，得到待显示页面更新后的滚动值。
需要说明的是，本发明实施例将目标区域移动至待显示区域的方式包含但不局限于：对待显示页面的滚动值进行更新；或者对目标区域相对待显示页面的位置进行更新；或者对待显示页面的滚动值进行更新之后，对目标区域相对待显示页面的位置进行更新；或者对目标区域相对待显示页面的位置进行更新之后，对待显示页面的滚动值进行更新。
S103，基于待显示页面的滚动值，将目标区域移动至待显示区域。
终端可以基于待显示页面的滚动值，将目标区域移动至待显示区域。以图3所示的界面示意图为例，移动至第三区域的第二区域可以如图3中第三状态的待显示页面所示。
S104，在显示屏幕中除待显示区域以外的其他区域填充预设的显示信息。
终端可以在显示屏幕中除待显示区域以外的其他区域填充预设的显示信息。其中，预设的显示信息可以为黑块占位符，例如将显示屏幕中除待显示区域以外的其他区域填充黑色。可选的，预设的显示信息可以为预先设定的图片或者文字等，终端可以在显示屏幕中除待显示区域以外的其他区域填充待显示页面对应的显示信息，例如对于不同待显示页面，可以在显示屏幕中除待显示区域以外的其他区域填充不同的显示信息。
以图4所示的界面示意图为例，终端将目标区域移动至待显示区域，并在显示屏幕中除待显示区域以外的其他区域填充预设的显示信息，填充预设的显示信息的待显示页面可以如图4所示，在视频界面使用同层绘制的方式显示页面元素，使得视频界面和页面元素位于同一区域，实现页面交互，另外将视频界面居中显示，同时隐藏其他区域，可提高播放体验。
本发明实施例中，获取待显示页面中的目标区域，确定目标区域在显示屏幕中的待显示区域，并基于待显示区域获取待显示页面的滚动值，基于待显示页面的滚动值，将目标区域移动至待显示区域，在显示屏幕中除待显示区域以外的其他区域填充预设的显示信息，通过在待显示区域显示视频界面和页面元素，可提高播放体验。
请参见图5，图5是本发明实施例中提供的一种视频界面显示装置的结构示意图，如图所示本实施例中的视频界面显示装置至少可以包括获取单元501、确定单元502、移动单元503以及填充单元504，其中：
获取单元501，用于获取待显示页面中的目标区域，所述目标区域包括视频界面和页面元素。
确定单元502，用于确定所述目标区域在显示屏幕中的待显示区域，并基于所述待显示区域获取所述待显示页面的滚动值。
移动单元503，用于基于所述待显示页面的滚动值，将所述目标区域移动至所述待显示区域。
填充单元504，用于在所述显示屏幕中除所述待显示区域以外的其他区域填充预设的显示信息。
可选的，所述确定单元502基于所述待显示区域获取所述待显示页面的滚动值，具体用于：
基于所述待显示区域对所述待显示页面的滚动值进行更新，得到所述待显示页面更新后的滚动值。
可选的，所述确定单元502，还用于基于所述待显示区域对所述待显示页面的滚动值进行更新之后，当基于所述更新后的滚动值确定所述目标区域位于所述显示屏幕的其他区域中时，对所述目标区域进行移动，使得移动后的目标区域位于所述显示屏幕的待显示区域中。
可选的，所述待显示页面更新后的滚动值表示如下：
newScrollyY＝videoY-(webviewHeight-videoHeight)/2
newScrollyX＝videoX-(webviewLength-videoLength)/2
其中，newScrollyY表示所述待显示页面更新后的滚动值中的Y值，videoY表示所述目标区域的原Y值，webviewHeight表示所述显示屏幕的高度，videoHeight表示所述目标区域的高度；newScrollyX表示所述待显示页面更新后的滚动值中的X值，videoX表示所述目标区域的原X值，webviewLength表示所述显示屏幕的长度，videoLength表示所述目标区域的长度。
可选的，所述待显示页面更新后的滚动值表示如下：
newScrollyY′＝min(max(0,newScrollyY),webHeight)
newScrollyX′＝min(max(0,newScrollyX),webLength)
其中，newScrollyY′表示所述待显示页面最近更新后的滚动值中的Y值，newScrollyY表示所述待显示页面上一次更新后的滚动值中的Y值，webHeight表示所述待显示页面的高度；newScrollyX′表示所述待显示页面最近更新后的滚动值中的X值，newScrollyX表示所述待显示页面上一次更新后的滚动值中的X值，webLength表示所述待显示页面的长度。
可选的，所述确定单元502基于所述待显示区域获取所述待显示页面的滚动值，具体用于：
基于所述待显示区域，对所述目标区域的滚动值进行更新，得到所述目标区域更新后的滚动值。
可选的，所述确定单元502，还用于基于所述待显示区域，对所述目标区域的滚动值进行更新之后，当基于所述目标区域更新后的滚动值确定所述目标区域位于所述显示屏幕的其他区域中时，对所述待显示页面的滚动值进行更新，得到所述待显示页面更新后的滚动值。
可选的，所述目标区域更新后的滚动值表示如下：
int offsetY＝(webviewHeight-videoHeight)/2-videoY+ScrollY
int offsetX＝(webviewLength-videoLength)/2-videoX+ScrollX
其中，int offsetY表示所述目标区域更新后的滚动值中的Y值，webviewHeight表示所述显示屏幕的高度，videoHeight表示所述目标区域的高度，videoY表示所述目标区域的原Y值，ScrollY表示所述待显示页面的滚动值中的Y值；int offsetX表示所述目标区域更新后的滚动值中的X值，webviewLength表示所述显示屏幕的长度，videoLength表示所述目标区域的长度，videoX表示所述目标区域的原X值，ScrollX表示所述待显示页面的滚动值中的X值。
本发明实施例中，获取单元501获取待显示页面中的目标区域，目标区域包括视频界面和页面元素，确定单元502确定目标区域在显示屏幕中的待显示区域，并基于待显示区域获取待显示页面的滚动值，移动单元503基于待显示页面的滚动值，将目标区域移动至待显示区域，填充单元504在显示屏幕中除待显示区域以外的其他区域填充预设的显示信息，可提高播放体验。
请参见图6，图6为本发明实施例提供的一种终端的结构示意图，本发明实施例提供的终端可以用于实施上述图1所示的本发明实施例实现的方法，为了便于说明，仅示出了与本发明实施例相关的部分，具体技术细节未揭示的，请参照图1所示的本发明实施例。
如图6所示，该终端包括：至少一个处理器601，例如CPU，至少一个输入装置603，至少一个输出装置604，存储器605，至少一个通信总线602。其中，通信总线602用于实现这些组件之间的连接通信。其中，输入装置603具体可以为网络接口等，用于获取待显示页面。其中，输出装置604具体可以为显示屏幕等，用于显示视频界面和页面元素。其中，存储器605可能包含高速RAM存储器，也可能还包括非不稳定的存储器，例如至少一个磁盘存储器，具体用于存储待显示页面等。存储器605可选的可以包含至少一个位于远离前述处理器601的存储装置。处理器601可以结合图5所示的视频界面显示装置。存储器605中存储一组程序代码，且处理器601、输入装置603以及输出装置604调用存储器605中存储的程序代码，用于执行以下操作：
处理器601获取待显示页面中的目标区域，所述目标区域包括视频界面和页面元素。
处理器601确定所述目标区域在显示屏幕中的待显示区域，并基于所述待显示区域获取所述待显示页面的滚动值。
处理器601基于所述待显示页面的滚动值，将所述目标区域移动至所述待显示区域。
处理器601在所述显示屏幕中除所述待显示区域以外的其他区域填充预设的显示信息。
可选的，处理器601基于所述待显示区域获取所述待显示页面的滚动值，具体可以为：
基于所述待显示区域对所述待显示页面的滚动值进行更新，得到所述待显示页面更新后的滚动值。
可选的，处理器601基于所述待显示区域对所述待显示页面的滚动值进行更新之后，还可以执行以下操作：
当基于所述更新后的滚动值确定所述目标区域位于所述显示屏幕的其他区域中时，对所述目标区域进行移动，使得移动后的目标区域位于所述显示屏幕的待显示区域中。
可选的，所述待显示页面更新后的滚动值表示如下：
newScrollyY＝videoY-(webviewHeight-videoHeight)/2
newScrollyX＝videoX-(webviewLength-videoLength)/2
其中，newScrollyY表示所述待显示页面更新后的滚动值中的Y值，videoY表示所述目标区域的原Y值，webviewHeight表示所述显示屏幕的高度，videoHeight表示所述目标区域的高度；newScrollyX表示所述待显示页面更新后的滚动值中的X值，videoX表示所述目标区域的原X值，webviewLength表示所述显示屏幕的长度，videoLength表示所述目标区域的长度。
可选的，所述待显示页面更新后的滚动值表示如下：
newScrollyY′＝min(max(0,newScrollyY),webHeight)
newScrollyX′＝min(max(0,newScrollyX),webLength)
其中，newScrollyY′表示所述待显示页面最近更新后的滚动值中的Y值，newScrollyY表示所述待显示页面上一次更新后的滚动值中的Y值，webHeight表示所述待显示页面的高度；newScrollyX′表示所述待显示页面最近更新后的滚动值中的X值，newScrollyX表示所述待显示页面上一次更新后的滚动值中的X值，webLength表示所述待显示页面的长度。
可选的，处理器601基于所述待显示区域获取所述待显示页面的滚动值，具体可以为：
基于所述待显示区域，对所述目标区域的滚动值进行更新，得到所述目标区域更新后的滚动值。
可选的，处理器601基于所述待显示区域，对所述目标区域的滚动值进行更新之后，还可以执行以下操作：
当基于所述目标区域更新后的滚动值确定所述目标区域位于所述显示屏幕的其他区域中时，对所述待显示页面的滚动值进行更新，得到所述待显示页面更新后的滚动值。
可选的，所述目标区域更新后的滚动值表示如下：
int offsetY＝(webviewHeight-videoHeight)/2-videoY+ScrollY
int offsetX＝(webviewLength-videoLength)/2-videoX+ScrollX
其中，int offsetY表示所述目标区域更新后的滚动值中的Y值，webviewHeight表示所述显示屏幕的高度，videoHeight表示所述目标区域的高度，videoY表示所述目标区域的原Y值，ScrollY表示所述待显示页面的滚动值中的Y值；int offsetX表示所述目标区域更新后的滚动值中的X值，webviewLength表示所述显示屏幕的长度，videoLength表示所述目标区域的长度，videoX表示所述目标区域的原X值，ScrollX表示所述待显示页面的滚动值中的X值。
具体的，本发明实施例中介绍的终端可以用以实施本发明结合图1介绍的方法实施例中的部分或全部流程。
本领域普通技术人员可以理解实现上述实施例方法中的全部或部分流程，是可以通过计算机程序来指令相关的硬件来完成，所述的程序可存储于计算机可读取存储介质中，该程序在执行时，可包括如上述各方法的实施例的流程。其中，所述的存储介质可为磁碟、光盘、只读存储记忆体(Read-Only Memory，ROM)或随机存储记忆体(Random AccessMemory，RAM)等。
以上所揭露的仅为本发明较佳实施例而已，当然不能以此来限定本发明之权利范围，因此依本发明权利要求所作的等同变化，仍属本发明所涵盖的范围。

Claims (16)

1.一种视频界面显示方法，其特征在于，所述方法包括：
获取待显示页面中的目标区域，所述目标区域包括视频界面和页面元素；
确定所述目标区域在显示屏幕中的待显示区域，并基于所述待显示区域获取所述待显示页面的滚动值；
基于所述待显示页面的滚动值，将所述目标区域移动至所述待显示区域；
在所述显示屏幕中除所述待显示区域以外的其他区域填充预设的显示信息。
2.如权利要求1所述的方法，其特征在于，所述基于所述待显示区域获取所述待显示页面的滚动值，包括：
基于所述待显示区域对所述待显示页面的滚动值进行更新，得到所述待显示页面更新后的滚动值。
3.如权利要求2所述的方法，其特征在于，所述基于所述待显示区域对所述待显示页面的滚动值进行更新之后，还包括：
当基于所述更新后的滚动值确定所述目标区域位于所述显示屏幕的其他区域中时，对所述目标区域进行移动，使得移动后的目标区域位于所述显示屏幕的待显示区域中。
4.如权利要求2所述的方法，其特征在于，所述待显示页面更新后的滚动值表示如下：
newScrollyY＝videoY-(webviewHeight-videoHeight)/2
newScrollyX＝videoX-(webviewLength-videoLength)/2
其中，newScrollyY表示所述待显示页面更新后的滚动值中的Y值，videoY表示所述目标区域的原Y值，webviewHeight表示所述显示屏幕的高度，videoHeight表示所述目标区域的高度；newScrollyX表示所述待显示页面更新后的滚动值中的X值，videoX表示所述目标区域的原X值，webviewLength表示所述显示屏幕的长度，videoLength表示所述目标区域的长度。
5.如权利要求4所述的方法，其特征在于，所述待显示页面更新后的滚动值表示如下：
newScrollyY′＝min(max(0,newScrollyY),webHeight)
newScrollyX′＝min(max(0,newScrollyX),webLength)
其中，newScrollyY′表示所述待显示页面最近更新后的滚动值中的Y值，newScrollyY表示所述待显示页面上一次更新后的滚动值中的Y值，webHeight表示所述待显示页面的高度；newScrollyX′表示所述待显示页面最近更新后的滚动值中的X值，newScrollyX表示所述待显示页面上一次更新后的滚动值中的X值，webLength表示所述待显示页面的长度。
6.如权利要求1所述的方法，其特征在于，所述基于所述待显示区域获取所述待显示页面的滚动值，包括：
基于所述待显示区域，对所述目标区域的滚动值进行更新，得到所述目标区域更新后的滚动值。
7.如权利要求6所述的方法，其特征在于，所述基于所述待显示区域，对所述目标区域的滚动值进行更新之后，还包括：
当基于所述目标区域更新后的滚动值确定所述目标区域位于所述显示屏幕的其他区域中时，对所述待显示页面的滚动值进行更新，得到所述待显示页面更新后的滚动值。
8.如权利要求6所述的方法，其特征在于，所述目标区域更新后的滚动值表示如下：
int offsetY＝(webviewHeight-videoHeight)/2-videoY+ScrollY
int offsetX＝(webviewLength-videoLength)/2-videoX+ScrollX
其中，int offsetY表示所述目标区域更新后的滚动值中的Y值，webviewHeight表示所述显示屏幕的高度，videoHeight表示所述目标区域的高度，videoY表示所述目标区域的原Y值，ScrollY表示所述待显示页面的滚动值中的Y值；int offsetX表示所述目标区域更新后的滚动值中的X值，webviewLength表示所述显示屏幕的长度，videoLength表示所述目标区域的长度，videoX表示所述目标区域的原X值，ScrollX表示所述待显示页面的滚动值中的X值。
9.一种视频界面显示装置，其特征在于，所述装置包括：
获取单元，用于获取待显示页面中的目标区域，所述目标区域包括视频界面和页面元素；
确定单元，用于确定所述目标区域在显示屏幕中的待显示区域，并基于所述待显示区域获取所述待显示页面的滚动值；
移动单元，用于基于所述待显示页面的滚动值，将所述目标区域移动至所述待显示区域；
填充单元，用于在所述显示屏幕中除所述待显示区域以外的其他区域填充预设的显示信息。
10.如权利要求9所述的装置，其特征在于，所述确定单元基于所述待显示区域获取所述待显示页面的滚动值，具体用于：
基于所述待显示区域对所述待显示页面的滚动值进行更新，得到所述待显示页面更新后的滚动值。
11.如权利要求10所述的装置，其特征在于，
所述确定单元，还用于基于所述待显示区域对所述待显示页面的滚动值进行更新之后，当基于所述更新后的滚动值确定所述目标区域位于所述显示屏幕的其他区域中时，对所述目标区域进行移动，使得移动后的目标区域位于所述显示屏幕的待显示区域中。
12.如权利要求10所述的装置，其特征在于，所述待显示页面更新后的滚动值表示如下：
newScrollyY＝videoY-(webviewHeight-videoHeight)/2
newScrollyX＝videoX-(webviewLength-videoLength)/2
其中，newScrollyY表示所述待显示页面更新后的滚动值中的Y值，videoY表示所述目标区域的原Y值，webviewHeight表示所述显示屏幕的高度，videoHeight表示所述目标区域的高度；newScrollyX表示所述待显示页面更新后的滚动值中的X值，videoX表示所述目标区域的原X值，webviewLength表示所述显示屏幕的长度，videoLength表示所述目标区域的长度。
13.如权利要求12所述的装置，其特征在于，所述待显示页面更新后的滚动值表示如下：
newScrollyY′＝min(max(0,newScrollyY),webHeight)
newScrollyX′＝min(max(0,newScrollyX),webLength)
其中，newScrollyY′表示所述待显示页面最近更新后的滚动值中的Y值，newScrollyY表示所述待显示页面上一次更新后的滚动值中的Y值，webHeight表示所述待显示页面的高度；newScrollyX′表示所述待显示页面最近更新后的滚动值中的X值，newScrollyX表示所述待显示页面上一次更新后的滚动值中的X值，webLength表示所述待显示页面的长度。
14.如权利要求9所述的装置，其特征在于，所述确定单元基于所述待显示区域获取所述待显示页面的滚动值，具体用于：
基于所述待显示区域，对所述目标区域的滚动值进行更新，得到所述目标区域更新后的滚动值。
15.如权利要求14所述的装置，其特征在于，
所述确定单元，还用于基于所述待显示区域，对所述目标区域的滚动值进行更新之后，当基于所述目标区域更新后的滚动值确定所述目标区域位于所述显示屏幕的其他区域中时，对所述待显示页面的滚动值进行更新，得到所述待显示页面更新后的滚动值。
16.如权利要求14所述的装置，其特征在于，所述目标区域更新后的滚动值表示如下：
int offsetY＝(webviewHeight-videoHeight)/2-videoY+ScrollY
int offsetX＝(webviewLength-videoLength)/2-videoX+ScrollX
其中，int offsetY表示所述目标区域更新后的滚动值中的Y值，webviewHeight表示所述显示屏幕的高度，videoHeight表示所述目标区域的高度，videoY表示所述目标区域的原Y值，ScrollY表示所述待显示页面的滚动值中的Y值；int offsetX表示所述目标区域更新后的滚动值中的X值，webviewLength表示所述显示屏幕的长度，videoLength表示所述目标区域的长度，videoX表示所述目标区域的原X值，ScrollX表示所述待显示页面的滚动值中的X值。
CN201710007619.9A 2017-01-05 2017-01-05 一种视频界面显示方法及装置 Active CN108282683B (zh)

Priority Applications (3)

Application Number Priority Date Filing Date Title
CN201710007619.9A CN108282683B (zh) 2017-01-05 2017-01-05 一种视频界面显示方法及装置
PCT/CN2017/117638 WO2018126899A1 (zh) 2017-01-05 2017-12-21 一种视频界面显示方法及装置
US16/375,432 US20190230311A1 (en) 2017-01-05 2019-04-04 Video interface display method and apparatus

Applications Claiming Priority (1)

Application Number Priority Date Filing Date Title
CN201710007619.9A CN108282683B (zh) 2017-01-05 2017-01-05 一种视频界面显示方法及装置

Publications (2)

Publication Number Publication Date
CN108282683A true CN108282683A (zh) 2018-07-13
CN108282683B CN108282683B (zh) 2020-07-14

Family

ID=62789382

Family Applications (1)

Application Number Title Priority Date Filing Date
CN201710007619.9A Active CN108282683B (zh) 2017-01-05 2017-01-05 一种视频界面显示方法及装置

Country Status (3)

Country Link
US (1) US20190230311A1 (zh)
CN (1) CN108282683B (zh)
WO (1) WO2018126899A1 (zh)

Cited By (2)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN113393294A (zh) * 2021-06-11 2021-09-14 北京沃东天骏信息技术有限公司 一种页面显示方法及装置、设备、存储介质
CN114416084A (zh) * 2021-12-31 2022-04-29 北京五八信息技术有限公司 一种数据处理方法、装置、电子设备及存储介质

Families Citing this family (5)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
US20200186623A1 (en) * 2018-12-11 2020-06-11 Microsoft Technology Licensing, Llc Performant retrieval and presentation of content
USD966281S1 (en) 2019-05-24 2022-10-11 Yandex Europe Ag Display screen or portion thereof with graphical user interface
USD970516S1 (en) 2019-06-20 2022-11-22 Yandex Europe Ag Display screen or portion thereof with graphical user interface
CN112783591A (zh) * 2021-01-27 2021-05-11 北京字跳网络技术有限公司 互动方法、装置、电子设备和存储介质
CN115002549A (zh) * 2021-03-01 2022-09-02 腾讯科技（深圳）有限公司 视频画面的显示方法、装置、设备及介质

Citations (6)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
US20130042171A1 (en) * 2011-08-12 2013-02-14 Korea Advanced Institute Of Science And Technology Method and system for generating and managing annotation in electronic book
CN103514202A (zh) * 2012-06-25 2014-01-15 北京新媒传信科技有限公司 一种网页显示的实现方法和装置
CN104268250A (zh) * 2014-09-30 2015-01-07 北京奇虎科技有限公司 一种网页中视频元素的播放方法和装置
CN105791947A (zh) * 2016-04-21 2016-07-20 腾讯科技（深圳）有限公司 一种视频播放方法及装置
CN105898523A (zh) * 2016-06-29 2016-08-24 无锡天脉聚源传媒科技有限公司 一种视频播放方法及装置
CN106210916A (zh) * 2016-06-29 2016-12-07 乐视控股（北京）有限公司 视频通话界面调节方法及装置

Family Cites Families (10)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
US20020126154A1 (en) * 2001-03-12 2002-09-12 Watson Edwin George Method for displaying and scrolling data including display status feedback
US20100198697A1 (en) * 2006-07-21 2010-08-05 Videoegg, Inc. Fixed Position Interactive Advertising
CN102402377B (zh) * 2010-09-17 2013-08-14 深圳Tcl新技术有限公司 一种实现屏保的显示装置及其屏保方法
CN102314502B (zh) * 2011-09-01 2017-03-01 百度在线网络技术（北京）有限公司 一种用于在移动终端上显示网页主体内容的方法和设备
CN103365930A (zh) * 2012-04-11 2013-10-23 富泰华工业（深圳）有限公司 网页内容显示控制系统及方法
US20140095328A1 (en) * 2012-09-28 2014-04-03 Yahoo! Inc. Interactive reveal ad unit
CN104077056B (zh) * 2014-06-27 2017-05-10 广州视睿电子科技有限公司 屏幕显示页面的平移方法和系统
WO2016100408A1 (en) * 2014-12-15 2016-06-23 Vessel Group, Inc. Processing techniques in audio-visual streaming systems
CN105511737A (zh) * 2015-12-18 2016-04-20 北京奇虎科技有限公司 一种管理网页上的菜单选项的方法及电子设备
US20170228762A1 (en) * 2016-02-09 2017-08-10 Comcast Cable Communications, Llc Responsive Advertisements

Patent Citations (6)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
US20130042171A1 (en) * 2011-08-12 2013-02-14 Korea Advanced Institute Of Science And Technology Method and system for generating and managing annotation in electronic book
CN103514202A (zh) * 2012-06-25 2014-01-15 北京新媒传信科技有限公司 一种网页显示的实现方法和装置
CN104268250A (zh) * 2014-09-30 2015-01-07 北京奇虎科技有限公司 一种网页中视频元素的播放方法和装置
CN105791947A (zh) * 2016-04-21 2016-07-20 腾讯科技（深圳）有限公司 一种视频播放方法及装置
CN105898523A (zh) * 2016-06-29 2016-08-24 无锡天脉聚源传媒科技有限公司 一种视频播放方法及装置
CN106210916A (zh) * 2016-06-29 2016-12-07 乐视控股（北京）有限公司 视频通话界面调节方法及装置

Cited By (3)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN113393294A (zh) * 2021-06-11 2021-09-14 北京沃东天骏信息技术有限公司 一种页面显示方法及装置、设备、存储介质
WO2022257973A1 (zh) * 2021-06-11 2022-12-15 北京沃东天骏信息技术有限公司 页面显示方法及装置、设备、存储介质
CN114416084A (zh) * 2021-12-31 2022-04-29 北京五八信息技术有限公司 一种数据处理方法、装置、电子设备及存储介质

Also Published As

Publication number Publication date
US20190230311A1 (en) 2019-07-25
CN108282683B (zh) 2020-07-14
WO2018126899A1 (zh) 2018-07-12

Similar Documents

Publication Publication Date Title
CN108282683A (zh) 一种视频界面显示方法及装置
CN107341018B (zh) 一种在页面切换后继续显示视图的方法和装置
CN107551555B (zh) 游戏画面显示方法及装置、存储介质、终端
JP7317232B2 (ja) 情報インタラクション方法、装置、機器、記憶媒体及びプログラム製品
CN109862414B (zh) 一种蒙版弹幕显示方法、装置及服务器
US8821277B2 (en) Colour barcodes and cellphone
CN107484025B (zh) 一种弹幕显示方法及移动终端
EP2318908A1 (en) Methods and systems providing an interactive social ticker
CN111324275B (zh) 显示画面中元素的播报方法及装置
CN106534993A (zh) 一种信息交互方法及装置
CN108845855A (zh) 用户界面显示方法、装置、终端及存储介质
CN112791393A (zh) 一种信息处理方法、装置、设备及介质
US20170220314A1 (en) Group-viewing assistance device, group-viewing assistance method, and viewing apparatus
CN108259923B (zh) 一种视频直播方法、系统及设备
CN112969097A (zh) 内容播放方法和装置、内容评论方法和装置
CN111083147A (zh) 一种会话建立方法及相关设备
CN113891140A (zh) 一种素材编辑方法、装置、设备及存储介质
CN110912806B (zh) 消息处理方法、装置、存储介质和电子装置
CN113101633B (zh) 云游戏的模拟操作方法、装置及电子设备
CN113301421B (zh) 直播片段展示方法和装置、存储介质及电子设备
CN113312237B (zh) 信息反馈方法、装置、电子设备及存储介质
CN106648281B (zh) 一种截图方法及装置
CN113259752A (zh) 浏览器页面中的互动视频的播放控制方法、装置及服务器
CN109656463A (zh) 个性表情的生成方法、装置及系统
CN113435926A (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