Page display method and related apparatus

Abstract

Provided in the present application are a page display method and a related apparatus, which are applied to a terminal device. The method comprises: when it is detected that the window size of an application window becomes larger, predicting a window size for when the re-layout of a page in the application window has been completed; estimating the page size of the page on the basis of the window size; and displaying the page on the basis of the page size. Insofar as good responsiveness is guaranteed, when the size of a window changes, a terminal device can predict the size of the window for when the next layout of a page in the window has been completed, and the size of the page during the next layout is then estimated on the basis of the predicted size of the window, such that the size of the page displayed after the next layout of the page is completed can be close to the size of the window, thereby reducing the occurrence of a white or black area on an inner edge of the window and improving the user experience.

Description

A page display method and related device

[0001] This application claims priority to the Chinese patent application filed with the China Patent Office on November 8, 2023, with application number 202311483102.9 and application name “A page display method and related device”, the entire contents of which are incorporated by reference into this application. Technical Field

[0002] The present application relates to the field of terminal technology, and in particular to a page display method and related devices. Background Art

[0003] The resizing of an application window triggers the re-layout and re-rendering of a world wide web (Web) page within the window.

[0004] In a currently known page display method, the window size change is triggered by the user dragging the window. After the window size changes, the terminal device will rearrange and render the web page in the window based on the changed window size. However, the speed of web page rearrangement is slower than the speed of window change. As a result, white or black areas will appear on the inner edge of the window as the window grows from small to large, resulting in poor display effect and a poor user experience.

[0005] Summary of the Invention

[0006] The present application provides a page display method and related devices, so as to reduce the occurrence of white or black areas on the inner edge of a window when the window is enlarged, thereby improving the user experience.

[0007] In the first aspect, the present application provides a page display method, which can be executed by a terminal device, or the method can be executed by a component configured in the terminal device (such as a chip, a chip system, etc.), or it can be implemented by a logic module or software that can realize all or part of the terminal device functions. The present application does not limit this.

[0008] Exemplarily, the method includes: when detecting that the window size of an application window changes from small to large, predicting the window size when the pages within the application window are rearranged; based on the window size, estimating the page size of the page; and displaying the page based on the page size.

[0009] Based on the above technical solution, when the size of a window changes, the terminal device can predict the size of the window when the page within the window is next laid out. It can then estimate the size of the page at the next layout based on the predicted window size, so that the size of the page displayed after the next layout is completed is close to the size of the window. This can reduce the appearance of white or black areas on the inner edge of the window, improving the user experience. Furthermore, the window size changes as the user drags the window, ensuring good hand tracking.

[0010] In combination with the first aspect, in some possible implementations, the window size is predicted for a target moment, which is the moment when the (n+1)th layout of the pages in the application window is completed. The target moment is determined based on the moment when the nth layout is completed and the duration consumed by the nth layout, where n is an integer greater than or equal to 1.

[0011] The window size is predicted for the target moment, which can be understood as predicting the window size at the target moment, that is, the window size is the predicted size of the window at the target moment.

[0012] In combination with the first aspect, in some possible implementations, predicting the window size when the pages within the application window are rearranged includes: estimating the window size change rate based on the window sizes obtained for the two most recent times before the start of the (n+1)th layout; and estimating the window size at the target moment based on the window size change rate and the duration consumed by the nth layout.

[0013] In combination with the first aspect, in some possible implementations, the page size of the page is estimated based on the window size, including: estimating the page size at the target moment based on the window size and the difference between the window size and the page size displayed after the last re-layout.

[0014] In this implementation, the difference between the displayed window size and the page size after the last relayout is taken into account. During this relayout, the difference is smoothed out, so that the estimated page size at the target moment is as close as possible to the actual window size obtained at the target moment, thereby reducing the appearance of white or black areas on the inner edge of the window and improving the user experience.

[0015] In combination with the first aspect, in some possible implementations, the window size includes the length and width of the window; and / or the page size includes the length and width of the page.

[0016] In combination with the first aspect, in some possible implementations, the window size includes the length and diagonal of the window; and / or the page size includes the length and diagonal of the page.

[0017] In combination with the first aspect, in some possible implementations, the window size includes the width and diagonal of the window; and / or the page size includes the width and diagonal of the page.

[0018] In combination with the first aspect, in some possible implementations, the method further includes: obtaining the duration consumed by the n-th layout.

[0019] In combination with the first aspect, in some possible implementations, displaying the page based on the page size includes: displaying the application window based on the most recently acquired window size; and displaying the page in the application window based on the page size.

[0020] In a second aspect, the present application provides a terminal device that can be used to implement the method of the first aspect and any possible implementation of the first aspect. The terminal device includes corresponding modules for executing the above-mentioned method. The modules included in the terminal device can be implemented in software and / or hardware.

[0021] In a third aspect, the present application provides a terminal device comprising at least one processor and at least one communication interface. The processor is coupled to the communication interface and can be used to execute a program to implement the page display method of the first aspect and any possible implementation of the first aspect.

[0022] Optionally, the terminal device further includes a memory, and the processor is coupled to the memory.

[0023] In a fourth aspect, the present application provides a chip system comprising at least one processor for supporting the implementation of the functions involved in the above-mentioned first aspect and any possible implementation of the first aspect, for example, processing the data involved in the above-mentioned method, etc.

[0024] In one possible design, the chip system also includes a memory, which is used to store program instructions and data. The memory is located inside or outside the processor.

[0025] The chip system can be composed of chips, or can include chips and other discrete devices.

[0026] In a fifth aspect, a readable storage medium is provided, on which a program (also referred to as code, or instruction) is stored. When the program is run, the method in the above-mentioned first aspect and any possible implementation of the first aspect is executed.

[0027] In a sixth aspect, a program product is provided, comprising: a program (also referred to as code, or instruction), which, when run, enables the method in the above-mentioned first aspect and any possible implementation of the first aspect to be executed.

[0028] It should be understood that the second to sixth aspects of the present application correspond to the technical solutions of the first aspect of the present application, and the beneficial effects achieved by each aspect and the corresponding feasible implementation methods are similar and will not be repeated here. BRIEF DESCRIPTION OF THE DRAWINGS

[0029] FIG1 is a schematic structural diagram of a terminal device applicable to the page display method provided in an embodiment of the present application;

[0030] FIG2 is a schematic diagram of a flow chart of a page display method;

[0031] FIG3 is a schematic diagram of a page display method;

[0032] FIG4 is a schematic diagram showing a comparison between page size and window size in a page display method;

[0033] FIG5 is a schematic flow chart of a page display method provided in an embodiment of the present application;

[0034] FIG6 is another schematic flow chart of a page display method provided in an embodiment of the present application;

[0035] FIG7 is a schematic diagram showing a comparison between page size and window size applicable to the surface display method provided in an embodiment of the present application. DETAILED DESCRIPTION

[0036] The technical solution in this application will be described below with reference to the accompanying drawings.

[0037] First, in this application, the terms "including" and "having" and any variations thereof are intended to cover non-exclusive inclusions. For example, a device, system, product or apparatus comprising a series of modules, modules or units is not necessarily limited to those modules, modules or units explicitly listed, but may include other modules, modules or units that are not explicitly listed or are inherent to these devices, systems, products or apparatuses.

[0038] Second, in this application, words such as "exemplarily" and "for example" are used to indicate examples, illustrations, or explanations. Any embodiment or design described as "exemplarily" or "for example" in the embodiments of this application should not be construed as being preferred or advantageous over other embodiments or designs. Rather, the use of words such as "exemplarily" and "for example" is intended to present the relevant concepts in a concrete manner.

[0039] Third, in this application, "when...", "in the case of...", "if" and "if" all mean that the device will take corresponding actions under certain objective circumstances, which does not limit the time, nor does it require that the device must perform judgment actions when it is implemented, nor does it mean that there are other limitations.

[0040] Fourth, in this application, preset can be understood as predefined, defined, predefined, stored, pre-stored, pre-negotiated, or pre-configured, etc.

[0041] Fifth, in this application, "and / or" describes the relationship between associated objects, indicating that three possible relationships exist. For example, "A and / or B" can represent: A alone, A and B together, or B alone. A and B can be singular or plural. The character " / " generally indicates an "or" relationship between the associated objects, but does not exclude the possibility of indicating an "and" relationship between the associated objects. The specific meaning of the symbol should be understood in the context.

[0042] Before describing in detail the page display method provided in the embodiment of the present application, an exemplary description of a terminal device applicable to the embodiment of the present application is first given in conjunction with FIG1 .

[0043] The page display method provided in the embodiments of the present application can be applied to terminal devices, including but not limited to smartphones, tablet computers, wearable devices, vehicle-mounted devices, laptop computers, ultra-mobile personal computers (UMPCs), netbooks, projectors, smart screens, etc. The embodiments of the present application do not impose any restrictions on the specific type of device.

[0044] In addition, the methods described in the embodiments of the present application can support operating systems such as the Android operating system (Android OS), Harmony OS, OpenHarmony OS, iOS, Windows OS, and lightweight operating systems (such as LiteOS). The embodiments of the present application do not impose any limitations on this.

[0045] FIG1 is a schematic structural diagram of a terminal device applicable to the page display method provided in an embodiment of the present application.

[0046] For example, FIG1 shows a schematic structural diagram of a terminal device 100. As shown in FIG1 , the terminal device 100 may include a processor 110, an external memory interface 120, an internal memory 121, a universal serial bus (USB) interface 130, a charging management module 140, a power management module 141, a battery 142, an antenna 1, an antenna 2, a mobile communication module 150, a wireless communication module 160, an audio module 170, a speaker 170A, a receiver 170B, a microphone 170C, an earphone interface 170D, a sensor module 180, a button 190, a motor 191, an indicator 192, a camera 193, a display 194, and a subscriber identification module (SIM) card interface 195. The sensor module 180 may include a pressure sensor 180A, a gyroscope sensor 180B, an air pressure sensor 180C, a magnetic sensor 180D, an acceleration sensor 180E, a distance sensor 180F, a proximity light sensor 180G, a fingerprint sensor 180H, a temperature sensor 180J, a touch sensor 180K, an ambient light sensor 180L and a bone conduction sensor 180M, etc.

[0047] The processor 110 may include one or more processing units. For example, the processor 110 may include one or more of an application processor (AP), a modem processor, a graphics processing unit (GPU), an image signal processor (ISP), a controller, a memory, a video codec, a digital signal processor (DSP), a baseband processor, and a neural-network processing unit (NPU). The different processing units may be independent devices or integrated into one or more processors.

[0048] The application processor outputs sound signals through the audio module 170 (such as the speaker 170A, etc.), or displays images or videos through the display screen 194.

[0049] The controller can be the nerve center and command center of the terminal device 100. The controller can generate operation control signals according to instruction operation codes and timing signals to complete the control of instruction fetching and execution.

[0050] Processor 110 may also include a memory for storing instructions and data. In some embodiments, the memory in processor 110 is a cache memory. This memory can store instructions or data that have just been used or are being recycled by processor 110. If processor 110 needs to use the same instruction or data again, it can directly access the memory. This avoids duplicate accesses, reduces processor 110 latency, and thus improves system efficiency.

[0051] The processor 110 can perform different operations to implement different functions by executing instructions. The instructions can be, for example, instructions pre-stored in the memory before the device leaves the factory, or instructions read from the APP after the user installs a new APP during use. This embodiment of the application does not impose any restrictions on this.

[0052] In some embodiments, the processor 110 may include one or more interfaces. The interfaces may include an inter-integrated circuit (I2C) interface, an inter-integrated circuit sound (I2S) interface, a pulse code modulation (PCM) interface, a universal asynchronous receiver / transmitter (UART) interface, a mobile industry processor interface (MIPI), a general-purpose input / output (GPIO) interface, a SIM interface, and / or a USB interface.

[0053] The USB interface 130 is an interface that complies with the USB standard specification, and specifically can be a Mini USB interface, a Micro USB interface, a USB Type C interface, etc. The USB interface 130 can be used to connect a charger to charge the terminal device 100, and can also be used to transmit data between the terminal device 100 and peripheral devices. It can also be used to connect headphones to play audio through the headphones. The interface can also be used to connect other devices, such as augmented reality (AR) devices, etc. It will be understood that the interface connection relationship between the modules illustrated in this application is only a schematic illustration and does not constitute a structural limitation on the terminal device 100. In other embodiments, the terminal device 100 may also adopt different interface connection methods in the above embodiments, or a combination of multiple interface connection methods.

[0054] The charging management module 140 is configured to receive charging input from a charger. The charger can be either a wireless charger or a wired charger. In some wired charging embodiments, the charging management module 140 can receive charging input from the wired charger via the USB interface 130. In some wireless charging embodiments, the charging management module 140 can receive wireless charging input via the wireless charging coil of the terminal device 100. While charging the battery 142, the charging management module 140 can also provide power to the terminal device 100 via the power management module 141.

[0055] The power management module 141 is used to connect the battery 142, the charging management module 140 and the processor 110. The power management module 141 receives input from the battery 142 and / or the charging management module 140, and provides power to the processor 110, the internal memory 121, the external memory, the display 194, the camera 193, and the wireless communication module 160. The power management module 141 can also be used to monitor parameters such as battery capacity, battery cycle count, and battery health status (leakage, impedance). In some other embodiments, the power management module 141 can also be set in the processor 110. In other embodiments, the power management module 141 and the charging management module 140 can also be set in the same device.

[0056] The wireless communication function of the terminal device 100 can be implemented through the antenna 1, the antenna 2, the mobile communication module 150, the wireless communication module 160, the modem processor and the baseband processor.

[0057] Antenna 1 and antenna 2 are used to transmit and receive electromagnetic wave signals. Each antenna in terminal device 100 can be used to cover a single or multiple communication frequency bands. Different antennas can also be reused to improve antenna utilization.

[0058] The mobile communication module 150 can provide wireless communication solutions including 2G / 3G / 4G / 5G applied on the terminal device 100.

[0059] The wireless communication module 160 can provide wireless communication solutions applied to the terminal device 100, including wireless local area networks (WLAN) (such as wireless fidelity (Wi-Fi) networks), Bluetooth (BT), global navigation satellite system (GNSS), frequency modulation (FM), near field communication (NFC) technology, infrared (IR) technology, etc.

[0060] In some embodiments, antenna 1 of terminal device 100 is coupled to mobile communication module 150 , and antenna 2 is coupled to wireless communication module 160 , so that terminal device 100 can communicate with the network and other devices through wireless communication technology.

[0061] The terminal device 100 can implement display functions through a GPU, display screen 194, and an application processor. The GPU is a microprocessor for image processing that connects the display screen 194 and the application processor. The GPU is used to perform mathematical and geometric calculations for graphics rendering. The processor 110 may include one or more GPUs that execute program instructions to generate or change display information.

[0062] Display screen 194, also referred to as a screen, can be used to display images, videos, and the like. It should be understood that display screen 194 may also include additional components, such as a backlight panel and a driver circuit. The backlight panel can be used to provide a light source, and the display panel emits light based on the light provided by the backlight panel. The driver circuit can be used to control the light transmission or opacity of the liquid crystal layer.

[0063] The terminal device 100 can realize the shooting function through the ISP, camera 193, video codec, GPU, display screen 194 and application processor.

[0064] The external memory interface 120 can be used to connect an external memory card, such as a Micro SD card, to expand the storage capacity of the terminal device 100. The external memory card communicates with the processor 110 via the external memory interface 120 to implement data storage functions. For example, files such as music and videos can be stored on the external memory card.

[0065] The internal memory 121 can be used to store device executable program code, which includes instructions. The processor 110 executes various functional applications and data processing of the terminal device 100 by running the instructions stored in the internal memory 121. The internal memory 121 may include a program storage area and a data storage area. Among them, the program storage area can store an operating system, an application required for at least one function (such as a sound playback function, an image playback function, etc.), etc. The data storage area can store data created during the use of the terminal device 100 (such as audio data, a phone book, etc.), etc. In addition, the internal memory 121 may include a high-speed random access memory, and may also include a non-volatile memory, such as at least one disk storage device, a flash memory device, etc.

[0066] The terminal device 100 can implement audio functions such as music playback and recording through the audio module 170, such as the speaker 170A, the receiver 170B, the microphone 170C and the headphone jack 170D, and the application processor.

[0067] It should be understood that the structure illustrated in this application does not constitute a specific limitation on the terminal device 100. In other embodiments, the terminal device 100 may include more or fewer components than shown, or may combine or separate certain components, or arrange the components differently. The illustrated components may be implemented in hardware, software, or a combination of software and hardware.

[0068] The size change of the application window will trigger the re-layout and rendering of the web page in the window. The following briefly describes a currently known page display method in conjunction with Figures 2 to 4.

[0069] FIG2 is a flow chart of a page display method.

[0070] In a currently known page display method, the change in the size (i.e., window dimensions) of an application window (which may be simply referred to as a window) is triggered by a user dragging the window. For example, a user can drag the window with a mouse to trigger the window size change. As shown in FIG2 , the user dragging the window triggers the window module to change the window size. The window module can periodically or at a certain frequency obtain the window size and transmit the obtained window size to the display module. The change in window size triggers a change in the size of the web page within the window. The page module can obtain the window size from the window module. In other words, the window module also transmits the obtained window size to the page module. The page module can then determine the size of the web page based on the obtained window size and re-layout the web page based on the determined size. After the layout is completed, the layout result (including but not limited to the content and size of the web page) is transmitted to the display module. The display module can display the window and the web page within the window based on a certain screen refresh rate and the obtained window size and web page layout result.

[0071] FIG3 is a schematic diagram of page display of a page display method.

[0072] As shown in FIG3a), before the user drags the window, the size of the web page (e.g., page 1) within the window is substantially the same as the size of the window. As shown in FIG3b), as the user drags the window, the window size changes, and the terminal device re-layouts and renders the web page within the window based on the changed window size.

[0073] However, the speed at which web pages are re-layouted is slower than the speed at which windows are changed.

[0074] FIG4 is a schematic diagram showing a comparison between a page size and a window size in a page display method.

[0075] As shown in Figure 4, at time 1, the window size transmitted by the window module to the display module and the page module at time 1 is size 1. After receiving the window size as size 1, the display module displays the window and the web page in the window based on the currently known window size and page size (also size 1, the page size was reported to the display module by the page module last time).

[0076] Between time 1 and time 2, the window module continuously obtains the size of the window at a certain frequency and passes the obtained window size to the display module and the page module. The display module also displays the window and the web page in the window based on the obtained window size and the size of the most recently obtained page. The page module can determine that the window size is changing from small to large based on the multiple window sizes obtained between time 1 and time 2, thereby triggering the re-layout of the web page, that is, triggering the change of the size of the web page. Therefore, at time 2, the page module starts to re-layout based on the currently obtained window size (that is, size 2), and after completing the layout, passes the layout result to the display module. In the layout result, the size of the page is size 2. The display module receives the layout result passed by the page module at time 3, and displays the window and the web page in the window based on the most recently obtained window size and the layout result.

[0077] Then, in the process of the page module rearranging the layout based on size 2, the size of the window is constantly changing, and the window module is also constantly passing the window size to the display module. The window size that the display module last obtained before time 3 is size 3. Therefore, at time 3, the size of the window displayed by the display module is size 3, and the size of the web page is size 2, that is, the size of the web page is smaller than the size of the window.

[0078] In other words, the page size is displayed later than the window size. Consequently, as the window expands, as shown in Figure 4, the page displayed by the display module is smaller than the window size. Consequently, white or black areas appear at the inner edge of the window, as shown in the shaded area in Figure 3b). This is caused by the asynchronous resizing of the page and window. In summary, this page display method produces poor display quality and a poor user experience.

[0079] In another currently known page display method, the window size does not change with the drag of the mouse. Instead, when the page size changes, the window size always remains consistent with the page size. Although this method can achieve good display effects, it has poor tracking performance and a poor user experience.

[0080] Based on the above problems, the present application provides a page display method and related devices. While ensuring good tracking performance, when the size of the window changes, the terminal device can predict the size of the window when the page in the window is laid out next time, and then estimate the size of the page at the next layout based on the predicted window size, so that the size of the page displayed after the layout of the page is completed next time can be close to the size of the window. In this way, the appearance of white or black areas on the inner edge of the window can be reduced, thereby improving the user experience.

[0081] FIG5 is a schematic flowchart of a page display method provided in an embodiment of the present application.

[0082] As shown in Figure 5, method 500 may include steps 510 to 530. The steps of method 500 may be performed by a terminal device, or the method 500 may be performed by a component configured in the terminal device (such as a chip, a chip system, etc.), or may be implemented by a logic module or software that can implement all or part of the terminal device functions, which is not limited in this embodiment of the present application. The terminal device may have the structure shown in Figure 1, which is not limited in this embodiment of the present application. The steps in Figure 5 are described in detail below.

[0083] In the page display method provided in this application, the page is not limited to a web page, and can also be other pages, for example, including but not limited to a Hypertext Markup Language (HTML) 5 (H5) page. This application does not impose any restrictions on this.

[0084] In step 510 , when it is detected that the window size of the application window is changed from small to large, the window size when the pages in the application window are rearranged is predicted.

[0085] For example, when the user drags the window, the terminal device can be triggered to change the window size. The terminal device can obtain the window size periodically or at a certain frequency. For example, the period or the frequency is equal to the screen refresh rate of the terminal device. Based on the window sizes obtained multiple times, the terminal device can detect whether the window size changes from small to large or from large to small.

[0086] As an example and not a limitation, the terminal device can use the window module shown in Figure 2 to periodically obtain the window size and pass the window size obtained each time to the display module and the page module. The page module can determine whether the window size is changing from small to large or from large to small based on the window sizes obtained multiple times.

[0087] Upon detecting that the window size has changed from large to small, the terminal device may predict the window size when the pages within the window are re-layouted. As an example and not a limitation, the terminal device may utilize the page module shown in FIG2 to predict the window size when the pages within the window are re-layouted upon detecting that the window size has changed from large to small.

[0088] In a possible implementation, the window size includes the length and width of the window.

[0089] In this implementation, the terminal device can use the window module shown in Figure 2 to periodically or at a certain frequency obtain the length and width of the window, and pass the length and width of the window obtained each time to the display module and the page module. The page module can determine whether the window is changing from small to large or from large to small based on the length and width of the window obtained multiple times.

[0090] It is understandable that, in this implementation, as long as any one of the length and width of the window changes from small to large, it can be considered that the window changes from small to large.

[0091] In another possible implementation, the window size includes a side length and a diagonal of the window.

[0092] Optionally, the window size includes the length and diagonal of the window.

[0093] In this implementation, the terminal device can use the window module shown in Figure 2 to periodically or at a certain frequency obtain the length and diagonal of the window, and pass the length and diagonal of the window obtained each time to the display module and the page module. The page module can determine whether the window is changing from small to large or from large to small based on the length and diagonal of the window obtained multiple times.

[0094] It can be understood that, in this implementation, as long as any one of the length and the diagonal of the window changes from small to large, it can be considered that the window changes from small to large.

[0095] Optionally, the window size includes the width and diagonal of the window.

[0096] In this implementation, the terminal device can use the window module shown in Figure 2 to periodically or at a certain frequency obtain the width and diagonal of the window, and pass the width and diagonal of the window obtained each time to the display module and the page module. The page module can determine whether the window is changing from small to large or from large to small based on the width and diagonal of the window obtained multiple times.

[0097] It can be understood that, in this implementation, as long as any one of the width and the diagonal of the window changes from small to large, it can be considered that the window changes from small to large.

[0098] In one possible implementation, the window size is predicted for a target moment, which is the moment when the (n+1)th layout of the pages in the application window is completed. The target moment is determined based on the moment when the nth layout is completed and the duration consumed by the nth layout, where n is an integer greater than or equal to 1.

[0099] The window size is predicted for the target moment, which can be understood as predicting the window size at the target moment, that is, the window size is the predicted size of the window at the target moment.

[0100] The target time is determined based on the time when the nth layout is completed and the time consumed by the nth layout. In one possible implementation, that is, the target time = the time when the nth rearrangement is completed + the time consumed by the nth rearrangement.

[0101] In a possible implementation, the method 500 further includes: obtaining the duration consumed by the n-th layout.

[0102] The terminal device also needs to obtain the time consumed by the nth layout. For example, the terminal device can use the page module shown in Figure 2 to calculate and record the time consumed by each re-layout, for example, the time consumed by the nth re-layout = the time when the nth re-layout is completed - the time when the nth layout is started.

[0103] As an example, as shown in Figure 4, assuming that the terminal device starts the first rearrangement based on size 1 at time 1 and completes the first rearrangement at time 2, the target time for completing the second layout of the page in the application window = time 2 + (time 2 - time 1), where (time 2 - time 1) is the time consumed by the first rearrangement.

[0104] Another example, as shown in Figure 4, assuming that the terminal device starts the second rearrangement based on size 2 at time 2 and completes the second rearrangement at time 3, the target time for completing the third layout of the page in the application window = time 3 + (time 3 - time 2), where (time 3 - time 2) is the time consumed by the second rearrangement.

[0105] That is to say, unlike the page display method shown in Figure 2, in the page display method provided in the present application, the page module does not directly rearrange according to the window size that has been actually obtained, but rather, it infers the window size when the page is rearranged next time based on the window size that has been actually obtained, and then rearranges based on the predicted window size. That is, the size of the window when the page module passes the layout result to the display module is predicted in advance, and the layout is performed based on the predicted window size in advance. This can make the size of the page when the page module passes the layout result to the display module close to the actual window size obtained by the current display module, thereby reducing the appearance of white or black areas on the inner edge of the window and improving the user experience.

[0106] In one possible implementation, predicting the window size when the pages in the application window are rearranged includes: estimating the window size change rate based on the two most recent window sizes obtained before the start of the (n+1)th layout; and estimating the window size at the target moment based on the window size change rate and the duration consumed by the nth layout.

[0107] For example, taking the third rearrangement as an example, the moment when the third rearrangement starts is moment 3, that is, the terminal device can use the page module shown in Figure 2 to estimate the window size change speed based on the two window sizes obtained in the last two times before moment 3.

[0108] In a possible implementation, the window size change speed=window size change size / window change time.

[0109] As an example and not a limitation, the time when the page module most recently obtained the window size before time 3 is time point A and time point B, where time point A is earlier than time point B, and the window size obtained at time point A is size a, and the window size obtained at time point B is size b, then the window size change speed = (size b-size a) / (time point B-time point A). It can be understood that (size b-size a) is the window size change amount, and (time point B-time point A) is the window change time.

[0110] After estimating the window size change speed, the terminal device can use the page module to estimate the window size at the target time based on the estimated window size change speed and the duration consumed by the nth layout.

[0111] In a possible implementation, the window size at the target moment = the window size change speed × the duration consumed by the nth layout.

[0112] As an example and not a limitation, taking the third rearrangement as an example, the window size at the target moment (i.e., the moment when the third rearrangement is completed) = window size change speed × the time consumed by the second layout = [(size b - size a) / (time point B - time point A)] × (time 3 - time 2). It can be understood that [(size b - size a) / (time point B - time point A)] is the estimated window size change speed during the third rearrangement process, and (time 3 - time 2) is the time consumed by the second layout. In other words, it can be estimated that the time required to complete the third rearrangement is also (time 3 - time 2). Therefore, the window size at the moment when the third rearrangement is completed is estimated, that is, the window size at the target moment.

[0113] In step 520 , the page size of the page is estimated based on the window size.

[0114] After estimating the window size at the target time, the terminal device may estimate the page size of the page within the window based on the window size.

[0115] Exemplarily, the terminal device may use the page module shown in FIG. 2 to estimate the page size of the page within the window based on the window size.

[0116] In a possible implementation, estimating the page size of the page based on the window size includes: estimating the window size as the page size of the page at the target moment.

[0117] In this implementation, as an example and not a limitation, taking the third rearrangement as an example, after completing the third rearrangement, the page size of the page displayed in the window by the terminal device is the window size estimated by the terminal device at the moment of completing the third rearrangement.

[0118] In a possible implementation, estimating the page size of the page based on the window size includes estimating the page size at the target moment based on the window size and the difference between the window size and the page size displayed after the last re-layout.

[0119] In this implementation, as an example but not a limitation, taking the third relayout as an example, assuming that the page size of the page displayed after the second relayout is M1, the window size of the displayed window is W1, and the difference between the displayed page size and the window size after the second relayout is V1 = W1-M1, the estimated window size at the moment of completing the third relayout is W2, then the page size at the target moment of completing the third relayout is X1 = W2-V1 = W2-(W1-M1).

[0120] In this implementation, the difference between the displayed window size and the page size after the last relayout is taken into account. During this relayout, the difference is smoothed out, so that the estimated page size at the target moment is as close as possible to the actual window size obtained at the target moment, thereby reducing the appearance of white or black areas on the inner edge of the window and improving the user experience.

[0121] In a possible implementation, the page size includes the length and width of the page.

[0122] In this implementation, the terminal device can use the page module shown in FIG. 2 to estimate the length and width of the page based on the window size obtained by the page module.

[0123] For example, when the window size includes the length and width of the window, the terminal device may estimate the length of the page based on the length of the window, and estimate the width of the page based on the width of the window.

[0124] As another example, when the window size includes the length and diagonal of the window, the terminal device can estimate the length of the page based on the length of the window, and estimate the width of the page based on the length and / or diagonal of the window. In this implementation, when estimating the width of the page, the terminal device can first calculate the width of the window based on the length and diagonal of the window, and then estimate the width of the page based on the calculated window width; alternatively, the terminal device can first estimate the diagonal of the page based on the diagonal of the window, and then calculate the width of the page based on the estimated diagonal and length of the page. This application does not impose any limitations on this.

[0125] As another example, when the window size includes the width and diagonal of the window, the terminal device can estimate the width of the page based on the width of the window, and estimate the length of the page based on the width and / or diagonal of the window. In this implementation, when estimating the length of the page, the terminal device can first calculate the length of the window based on the width and diagonal of the window, and then estimate the length of the page based on the calculated window length; alternatively, the terminal device can first estimate the diagonal of the page based on the diagonal of the window, and then calculate the length of the page based on the estimated diagonal and width of the page. This application does not impose any limitations on this.

[0126] In a possible implementation, the page size includes a side length and a diagonal of the page.

[0127] In this implementation, the terminal device can use the page module shown in FIG. 2 to estimate a side length and a diagonal of the page based on the window size obtained by the page module.

[0128] Optionally, the page size includes the length and diagonal of the page.

[0129] For example, when the window size includes the length and width of the window, the terminal device can estimate the length of the page based on the length of the window, and estimate the diagonal of the page based on the length and / or width of the window. In this implementation, when estimating the diagonal of the page, the terminal device can first calculate the diagonal of the window based on the length and width of the window, and then estimate the diagonal of the page based on the calculated window diagonal; alternatively, the terminal device can first estimate the width of the page based on the width of the window, and then calculate the diagonal of the page based on the estimated width and length of the page. This application does not impose any limitations on this.

[0130] As another example, when the window size includes the length and diagonal of the window, the terminal device may estimate the length of the page based on the length of the window, and estimate the diagonal of the page based on the diagonal of the window.

[0131] As another example, when the window size includes the width and diagonal of the window, the terminal device can estimate the diagonal of the page based on the diagonal of the window, and estimate the length of the page based on the width and / or diagonal of the window. In this implementation, when estimating the length of the page, the terminal device can first estimate the width of the page based on the width of the window, and then calculate the length of the page based on the estimated diagonal and width of the page; alternatively, the terminal device can first calculate the length of the window based on the width and diagonal of the window, and then estimate the length of the page based on the calculated length of the window. This application does not impose any limitations on this.

[0132] Optionally, the page size includes the width and diagonal of the page.

[0133] For example, when the window size includes the length and width of the window, the terminal device can estimate the diagonal of the page based on the diagonal of the window, and estimate the width of the page based on the length and / or width of the window. In this implementation, when estimating the diagonal of the page, the terminal device can first calculate the diagonal of the window based on the length and width of the window, and then estimate the diagonal of the page based on the calculated window diagonal; alternatively, the terminal device can first estimate the length of the page based on the length of the window, and then calculate the diagonal of the page based on the estimated width and length of the page. This application does not impose any limitations on this.

[0134] As another example, when the window size includes the window length and diagonal, the terminal device may estimate the page diagonal based on the window diagonal, and estimate the page width based on the window length and / or diagonal. In this implementation, when estimating the page width, the terminal device may first estimate the page length based on the window length, and then calculate the page width based on the estimated page diagonal and length; alternatively, the terminal device may first calculate the window width based on the window length and diagonal, and then estimate the page width based on the calculated window width. This application does not impose any limitations on this.

[0135] As another example, when the window size includes the width and diagonal of the window, the terminal device may estimate the width of the page based on the width of the window, and estimate the diagonal of the page based on the diagonal of the window.

[0136] In step 530 , the page is displayed based on the page size.

[0137] After estimating the page size, the terminal device may display the page based on the page size.

[0138] Exemplarily, after the terminal device estimates the page size using the page module shown in Figure 2, it can then perform a rearrangement based on the page module to obtain a layout result, and pass the layout result including the page size to the display module, so that the display module can display the page based on the layout result.

[0139] In a possible implementation, displaying the page based on the page size includes: displaying the application window based on the most recently acquired window size; and displaying the page in the application window based on the page size.

[0140] Exemplarily, the terminal device can utilize the display module shown in FIG2 to display the window based on the window size most recently obtained before obtaining the layout result from the page module, and display the interface in the window based on the page size included in the layout result.

[0141] In order to facilitate a better understanding of the page display method provided by the present application, the page display method provided by the present application is briefly described again below in conjunction with FIG. 6 .

[0142] FIG6 is another schematic flowchart of the page display method provided in an embodiment of the present application.

[0143] The steps shown in FIG6 can be performed by a terminal device, or can also be performed by a component configured in the terminal device (such as a chip, chip system, etc.), or can also be implemented by a logic module or software that can realize all or part of the terminal device functions, which is not limited in this embodiment of the present application. The terminal device can have the structure shown in FIG1, which is not limited in this embodiment of the present application. The steps in FIG6 are described in detail below.

[0144] In step 610, a change in window size is detected.

[0145] For example, when a user drags a window, the terminal device may be triggered to change the window size. The terminal device may periodically or at a certain frequency to obtain the window size. For example, the period or frequency is equal to the screen refresh rate of the terminal device. Based on the window sizes obtained multiple times, the terminal device may detect whether the window size has changed. For example, the terminal device may determine whether the window size has changed from small to large or from large to small. For a detailed description, please refer to the relevant description of step 510 in method 500 above. For the sake of brevity, it will not be repeated here.

[0146] In step 620 , the pages in the window are rearranged.

[0147] The change of the window size will trigger the re-layout of the pages in the window. Therefore, when the terminal device detects that the window size has changed, the terminal device can re-layout the pages in the window.

[0148] In a possible implementation, step 620 may include steps 621 to 623 , which are described in detail below.

[0149] Step 621: Estimate the window size at the target time based on the window size change speed and the duration consumed by the nth layout.

[0150] For a detailed description of the target time, please refer to the relevant description of step 510 in the above method 500. For the sake of brevity, it will not be repeated here.

[0151] The terminal device estimates the window size change rate based on the two most recently acquired window sizes before the start of the (n+1)th layout. Taking the third layout as an example, the time when the third layout is started is time 3. That is, the terminal device can use the page module shown in Figure 2 to estimate the window size change rate based on the two most recently acquired window sizes before time 3. For a detailed description, please refer to the relevant description of step 510 in method 500 above. For the sake of brevity, it is not repeated here.

[0152] The terminal device can also obtain the duration of the nth layout. For example, the terminal device can utilize the page module shown in FIG2 to calculate and record the duration of each re-layout. For example, the duration of the nth re-layout = the time when the nth re-layout is completed - the time when the nth re-layout is started. For a detailed description, please refer to the relevant description of step 510 in method 500 above. For the sake of brevity, it is not repeated here.

[0153] After obtaining the window size change speed and the duration consumed by the nth layout, the terminal device can estimate the window size at the target time based on the window size change speed and the duration consumed by the nth layout.

[0154] As an example and not a limitation, taking the third rearrangement as an example, the window size at the target moment (i.e., the moment when the third rearrangement is completed) = window size change speed × the time consumed by the second layout = [(size b - size a) / (time point B - time point A)] × (time 3 - time 2). It can be understood that [(size b - size a) / (time point B - time point A)] is the estimated window size change speed during the third rearrangement process, and (time 3 - time 2) is the time consumed by the second layout. In other words, it can be estimated that the time required to complete the third rearrangement is also (time 3 - time 2). Therefore, the window size at the moment when the third rearrangement is completed is estimated, that is, the window size at the target moment.

[0155] Step 622 , based on the estimated window size at the target moment and the difference between the window size and the page size displayed after the last re-layout, estimate the page size at the target moment.

[0156] Taking the third re-layout as an example, assuming that the page size of the page displayed after the second re-layout is M1, the window size of the window displayed is W1, and the difference between the displayed page size and the window size after the second re-layout is V1 = W1 - M1, the estimated window size at the time of the third re-layout is W2, and the page size at the target time of the third re-layout is X1 = W2 - V1 = W2 - (W1 - M1). For a detailed description, please refer to the relevant description of step 520 in method 500 above, and for the sake of brevity, it is not repeated here.

[0157] Step 623: Re-layout the page based on the estimated page size.

[0158] The terminal device can utilize the page module shown in FIG2 to perform page layout based on the estimated page size.

[0159] In step 630 , the rearranged page is displayed.

[0160] Exemplarily, the terminal device can utilize the display module shown in FIG2 to display the window based on the window size most recently obtained before obtaining the layout result from the page module, and display the interface in the window based on the page size included in the layout result.

[0161] FIG7 is a schematic diagram showing a comparison between page size and window size applicable to the surface display method provided in an embodiment of the present application.

[0162] Based on the above technical solution, when the size of the window changes, the terminal device can predict the size of the window when the page in the window is next laid out, and then estimate the size of the page at the next layout based on the predicted window size, so that the size of the page displayed after the layout of the page is completed next time is close to the size of the window. As shown in Figure 7, the page size is basically close to the window size or slightly larger than the window size. In this way, the occurrence of white or black areas on the inner edge of the window can be reduced, thereby improving the user experience. In addition, the window size changes as the user drags the window, ensuring good hand tracking.

[0163] The present application also provides a terminal device including corresponding modules for executing the steps in any of the embodiments described in Figures 5 and 6. The modules included in the terminal device can be implemented in software and / or hardware.

[0164] An embodiment of the present application also provides a terminal device, which includes a memory and a processor, wherein the memory is used to store programs, and the processor is used to call and execute programs, so that the terminal device performs the steps of any of the embodiments described in Figures 5 and 6 above.

[0165] The present application also provides a chip system, which includes at least one processor for implementing the functions involved in the steps of any of the embodiments described in Figures 5 and 6 above.

[0166] In one possible design, the chip system further includes a memory, which is used to store program instructions and data, and the memory is located inside or outside the processor.

[0167] The chip system can be composed of chips, or can include chips and other discrete devices.

[0168] An embodiment of the present application further provides a readable storage medium on which a program is stored. When the program is executed by a terminal device, the terminal device executes the steps of any one of the embodiments described in Figures 5 and 6 above.

[0169] An embodiment of the present application also provides a program product, including a program. When the program is executed by a terminal device, the terminal device executes the steps of any one of the embodiments described in Figures 5 and 6 above.

[0170] It should be understood that the processor in the embodiments of the present application can be an integrated circuit chip with signal processing capabilities. During implementation, each step of the above-mentioned method embodiment can be completed by hardware integrated logic circuits in the processor or by software instructions. The above-mentioned processor can be a general-purpose processor, a digital signal processor (DSP), an application-specific integrated circuit (ASIC), a field programmable gate array (FPGA), or other programmable logic devices, discrete gate or transistor logic devices, or discrete hardware components. The various methods, steps, and logic block diagrams disclosed in the embodiments of the present application can be implemented or executed. The general-purpose processor can be a microprocessor or any conventional processor. The steps of the method disclosed in the embodiments of the present application can be directly implemented and executed by a hardware decoding processor, or by a combination of hardware and software modules in the decoding processor. The software module can be located in a storage medium well-known in the art, such as random access memory, flash memory, read-only memory, programmable read-only memory, electrically erasable programmable memory, registers, etc. The storage medium is located in the memory, and the processor reads the information in the memory and, in conjunction with its hardware, completes the steps of the above-mentioned method.

[0171] It should also be understood that the memory in the embodiments of the present application may be a volatile memory or a non-volatile memory, or may include both volatile and non-volatile memories.

[0172] The terms "unit", "module", etc. used in this specification may be used to represent device-related entities, hardware, firmware, a combination of hardware and software, software, or software in execution.

[0173] Those skilled in the art will appreciate that the various illustrative logical blocks and steps described in conjunction with the embodiments disclosed herein can be implemented using electronic hardware, or a combination of software and electronic hardware. Whether these functions are performed in hardware or software depends on the specific application and design constraints of the technical solution. Professionals and technicians may use different methods to implement the described functions for each specific application, but such implementation should not be considered beyond the scope of this application. In the several embodiments provided in this application, it should be understood that the disclosed devices, equipment, and methods can be implemented in other ways. For example, the device embodiments described above are merely illustrative. For example, the module division is only a logical function division. In actual implementation, there may be other division methods, such as multiple modules or components can be combined or integrated into another system, or some features can be ignored or not implemented. In addition, the coupling or direct coupling or communication connection shown or discussed can be through some interfaces, indirect coupling or communication connection of devices or modules, and can be electrical, mechanical, or other forms.

[0174] The modules described as separate components may or may not be physically separate, and the components shown as modules may or may not be physical modules, that is, they may be located in one place or distributed across multiple network modules. Some or all of the modules may be selected to achieve the purpose of the present embodiment according to actual needs.

[0175] In addition, the functional modules in the various embodiments of the present application may be integrated into one processing module, or each module may exist physically separately, or two or more units may be integrated into one module.

[0176] If the functions are implemented in the form of software functional units and sold or used as independent products, they can be stored in a readable storage medium. Based on this understanding, the technical solution of the present application, or the part that contributes to the prior art, or the part of the technical solution, can be embodied in the form of a software product, which is stored in a storage medium and includes several instructions for enabling a device to execute all or part of the steps of the methods described in each embodiment of the present application. The aforementioned storage medium includes various media that can store program codes, such as a USB flash drive, a mobile hard disk, a read-only memory (ROM), a random access memory (RAM), a magnetic disk or an optical disk.

[0177] The above description is merely a specific embodiment of the present application, but the scope of protection of the present application is not limited thereto. Any changes or substitutions that can be easily conceived by a person skilled in the art within the technical scope disclosed in this application should be included in the scope of protection of this application. Therefore, the scope of protection of this application should be based on the scope of protection of the claims.

Claims

1. A page display method, characterized in that: Applied to a terminal device, the method comprises: When detecting that the window size of the application window changes from small to large, predicting the window size when the pages in the application window are re-layouted; estimating a page size of the page based on the window size; Based on the page size, the page is displayed.

2. The method according to claim 1, characterized in that The window size is predicted for a target moment, which is the moment when the (n+1)th layout of the pages in the application window is completed. The target moment is determined based on the moment when the nth layout is completed and the duration consumed by the nth layout, where n is an integer greater than or equal to 1.

3. The method according to claim 2, characterized in that The predicting of the window size when the pages in the application window are re-layouted includes: estimating the window size change speed based on the window sizes acquired two most recently before the moment of starting the (n+1)th layout; The window size at the target time is estimated based on the window size change speed and the duration consumed by the nth layout.

4. The method according to claim 3, characterized in that The estimating the page size of the page based on the window size includes: Based on the window size and the difference between the window size and the page size displayed after the last re-layout, the page size at the target time is estimated.

5. The method according to any one of claims 1 to 4, characterized in that The window size includes the length and width of the window; and / or the page size includes the length and width of the page.

6. The method according to any one of claims 2 to 5, characterized in that The method further comprises: Gets the time consumed by the nth layout.

7. The method according to any one of claims 1 to 6, characterized in that The step of displaying the page based on the page size includes: Displaying the application window based on the most recently acquired window size; The page is displayed in the application window based on the page size.

8. A terminal device, characterized in that: comprising a processor and a memory, wherein: The memory is used to store programs; The processor is used to call the program so that the terminal device executes the method according to any one of claims 1 to 7.

9. A readable storage medium having a program stored thereon, characterized in that: When the program is executed, the terminal device executes the method according to any one of claims 1 to 7.

10. A program product, characterized in that The method comprises a program, which, when being executed, causes a terminal device to execute the method according to any one of claims 1 to 7.

Images