Looking for breakthrough ideas for innovation challenges? Try Patsnap Eureka!

Method and system for adaptively adjusted interface flow layout display

A self-adaptive adjustment and interface flow technology, applied in special data processing applications, data processing input/output process, instruments, etc., can solve the problems of video thumbnail size reduction, video thumbnail layout scattered, etc., to achieve enhanced display effect , enhance the browsing experience, and increase the effect of attribution

Active Publication Date: 2017-04-05
ALIBABA (CHINA) CO LTD
View PDF5 Cites 0 Cited by
  • Summary
  • Abstract
  • Description
  • Claims
  • Application Information

AI Technical Summary

Problems solved by technology

[0007] In view of this, the technical problem to be solved by this application is to provide a method and system for adaptively adjusting interface flow layout display to solve the problem that the layout of video thumbnails in the page is scattered and the size of video thumbnails is at a higher resolution. The problem of reducing

Method used

the structure of the environmentally friendly knitted fabric provided by the present invention; figure 2 Flow chart of the yarn wrapping machine for environmentally friendly knitted fabrics and storage devices; image 3 Is the parameter map of the yarn covering machine
View more

Image

Smart Image Click on the blue labels to locate them in the text.
Viewing Examples
Smart Image
  • Method and system for adaptively adjusted interface flow layout display
  • Method and system for adaptively adjusted interface flow layout display
  • Method and system for adaptively adjusted interface flow layout display

Examples

Experimental program
Comparison scheme
Effect test

Embodiment 1

[0039] Such as figure 1 As shown, this is an adaptively adjusted interface flow layout display method described in the first embodiment of this application, and the method includes:

[0040] Step 101: Detect the resolution value of the terminal system running the browser.

[0041] The resolution of the screen used by the user is different. The resolution represents the pixel value in the length and width direction of the screen. The content displayed on the screen (including: text, image, etc.) is composed of pixels. Therefore, the resolution It reflects the amount of content displayed on the screen and the accuracy of the display: the lower the resolution, the less the display content, and the lower the corresponding display accuracy; on the contrary, the display content is more and the display accuracy is high.

[0042] When a user visits the corresponding website (specifically a video website) through the browser on the terminal (including: computer terminal, mobile terminal, etc....

Embodiment 2

[0051] Such as figure 2 As shown, this is an adaptively adjusted interface flow layout display method described in the second embodiment of the application, and the method includes:

[0052] Step 201: When displaying a page through a browser, detect the resolution value of the terminal system running the browser and the pixel value of the current browser window when the size is maximized.

[0053] The detection process can start at the moment the browser is started, the pixel value of the browser window at the maximized size can be recorded in the HTML file, and the resolution value of the terminal system can be obtained by accessing the display process in the current terminal system. For the pixel value of the browser window when the size is maximized, it is specifically the pixel value in the horizontal direction (horizontal direction) of the browser window when the size is maximized.

[0054] Step 202, according to the resolution value and the pixel value of the current browser w...

Embodiment 3

[0068] Combine below Figure 4-8 , The specific application of the adaptively adjusted interface flow layout display method is described in detail:

[0069] Step 1: When the user displays the page through the browser, check that the resolution value of the terminal system running the browser has a pixel value of 1024px in the horizontal direction, and detect the pixel value in the horizontal direction when the current browser window is maximized. The value is 1003px.

[0070] Step two, such as Figure 4 As shown, according to the resolution value of 1024px and the pixel value of 1003px when the current browser window is maximized in size, cell A with a preset pixel width of 55px is used as a reference size to construct a vertical arrangement and cover the size The grid of the page.

[0071] Among them, the total pixel value in the horizontal direction of the grid formed on the page is 990px, and the width of the actual visible area S3 is 970px. Of course, Figure 4 The grid in is no...

the structure of the environmentally friendly knitted fabric provided by the present invention; figure 2 Flow chart of the yarn wrapping machine for environmentally friendly knitted fabrics and storage devices; image 3 Is the parameter map of the yarn covering machine
Login to View More

PUM

No PUM Login to View More

Abstract

Disclosed are a method and system for displaying an interface streaming layout in adaptive adjustment mode, the method comprising: testing the resolution value of a terminal system operating a browser; according to the resolution value, constructing cells having preset pixel values on a page into grids vertically arranged and occupying the whole page; reading the total pixel value of the grids in a transverse direction, and adjusting the size of a video thumbnail and a video classification label in combination with a preset correspondence between the standard number of display columns of the video thumbnail and the total pixel value of the grids in the transverse direction; and arranging on the grids the adjusted video classification labels and the video thumbnails in the transverse direction to form a plurality of mutually parallel video classification rows in the transverse direction for display. The present invention solves the problems of dispersed arrangement of video thumbnails on the page, and reduced size of the video thumbnails in a high resolution.

Description

Technical field [0001] This application relates to the field of interface layout display, and more specifically, to a method and system for adaptively adjusted interface flow layout display. Background technique [0002] With the rapid development of Internet technology, the way people obtain information has changed: from traditional books, newspapers, television, radio, etc., to access through the Internet. In particular, the Internet shares rich and comprehensive online video resources such as film and television programs, news, advertisements, chat videos, game videos, and surveillance videos, so that online video has become an important and irreplaceable way for people to learn, socialize, and relax. [0003] Current websites, especially video websites, are responsible for providing users with a wealth of video resources. Users can access the on-demand page of the video website through the browser on the terminal and watch various videos that the user wants to watch. [0004] Us...

Claims

the structure of the environmentally friendly knitted fabric provided by the present invention; figure 2 Flow chart of the yarn wrapping machine for environmentally friendly knitted fabrics and storage devices; image 3 Is the parameter map of the yarn covering machine
Login to View More

Application Information

Patent Timeline
no application Login to View More
Patent Type & Authority Patents(China)
IPC IPC(8): G06F17/30G06F3/0481
CPCG06F16/00
Inventor 甘露华文伟张奥博李外晏芳姚键潘柏宇卢述奇
Owner ALIBABA (CHINA) CO LTD
Who we serve
  • R&D Engineer
  • R&D Manager
  • IP Professional
Why Patsnap Eureka
  • Industry Leading Data Capabilities
  • Powerful AI technology
  • Patent DNA Extraction
Social media
Patsnap Eureka Blog
Learn More
PatSnap group products

Browse by: Latest US Patents, China's latest patents, Technical Efficacy Thesaurus, Application Domain, Technology Topic, Popular Technical Reports.

© 2024 PatSnap. All rights reserved.Legal|Privacy policy|Modern Slavery Act Transparency Statement|Sitemap|About US| Contact US: help@patsnap.com