Page display control method, device and electronic equipment

By dividing the display area in the graphical user interface of the terminal device and adopting a horizontal or vertical screen layout, the page blocking problem is solved, allowing users to view and operate multiple pages at the same time, thereby improving the user experience.

CN119512671BActive Publication Date: 2025-10-21NETEASE (HANGZHOU) NETWORK CO LTD
View PDF 2 Cites 0 Cited by

Patent Information

Application Number
CN202411448834.9
Authority / Receiving Office
CN · China
Patent Type
Patents(China)
Current Assignee / Owner
Filing Date
2024-10-16
Publication Date
2025-10-21
Estimated Expiration
2044-10-16

AI Technical Summary

Technical Problem

When operating a mobile game or application, when a user opens another page, the original page is blocked, resulting in the inability to timely understand the game dynamics or perform operations, affecting the user experience.

Method used

Provide a graphical user interface through the terminal device, divide the display area and adopt a horizontal or vertical screen layout to control the display of multiple pages in different areas, ensuring that users can view and operate multiple pages at the same time.

Benefits of technology

It enables users to understand the contents of multiple pages at the same time, improves operational efficiency and user experience, and the reasonable layout makes page object operations more convenient.

✦ Generated by Eureka AI based on patent content.

Smart Images

  • Figure CN119512671B_ABST
    Figure CN119512671B_ABST
Patent Text Reader

Abstract

The application provides a page display control method, device and electronic equipment; wherein the method comprises: controlling a first page to be displayed on a graphical user interface; in response to a display instruction for a second page, dividing a display area on the graphical user interface, and controlling the first page and the second page to be displayed in different display areas; in response to a display area of a target page meeting a preset condition, arranging page objects in the target page according to a layout mode corresponding to the preset condition; wherein the target page comprises the first page and / or the second page; and the layout mode comprises a horizontal screen layout mode or a vertical screen layout mode. In this way, multiple pages are displayed in a split-screen mode, and the pages are arranged in a horizontal screen or vertical screen mode according to the display area, so that the user can understand the content of multiple pages at the same time, a reasonable layout mode is also more conducive to the user to operate the objects in the pages, and the operation experience of the user is improved.
Need to check novelty before this filing date? Find Prior Art

Description

Technical Field

[0001] The present invention relates to the field of page display technology, and in particular to a page display control method, device and electronic equipment. Background Art

[0002] In the operation of mobile applications, taking game operations as an example, when the terminal device displays the game screen, if the user controls to open other pages, such as the backpack page, store page, etc., these pages will block the game screen; resulting in the user being unable to keep up with the game dynamics in a timely manner when viewing the newly opened page, and unable to perform game operations, affecting the user's operating experience. Summary of the Invention

[0003] In view of this, the purpose of the present invention is to provide a page display control method, device and electronic device, so that users can understand the contents of multiple pages at the same time, which is more conducive to users operating objects in the pages and improving the user's operating experience.

[0004] In a first aspect, an embodiment of the present invention provides a page display control method, which provides a graphical user interface through a terminal device; the method includes: controlling the display of a first page on the graphical user interface; responding to a display instruction for a second page, dividing a display area in the graphical user interface, and controlling the first page and the second page to be displayed in different display areas; in response to the display area of ​​the target page meeting a preset condition, laying out the page objects in the target page according to the layout method corresponding to the preset condition; wherein the target page includes the first page and / or the second page; the layout method includes: a horizontal screen layout method or a vertical screen layout method.

[0005] In a second aspect, an embodiment of the present invention provides a page display control device, which provides a graphical user interface through a terminal device; the device includes: a page display module, which is used to control the display of a first page on the graphical user interface; a partition display module, which is used to respond to a display instruction for a second page, divide the display area in the graphical user interface, and control the first page and the second page to be displayed in different display areas; an object layout module, which is used to respond to the display area of ​​the target page meeting a preset condition, and layout the page objects in the target page according to the layout method corresponding to the preset condition; wherein the target page includes the first page and / or the second page; the layout method includes: a horizontal screen layout method or a vertical screen layout method.

[0006] In a third aspect, an embodiment of the present invention provides an electronic device, including a processor and a memory, wherein the memory stores computer-executable instructions that can be executed by the processor, and the processor executes the computer-executable instructions to implement the above-mentioned page display control method.

[0007] In a fourth aspect, an embodiment of the present invention provides a computer-readable storage medium, which stores computer-executable instructions. When the computer-executable instructions are called and executed by a processor, the computer-executable instructions prompt the processor to implement the above-mentioned page display control method.

[0008] The embodiments of the present invention bring the following beneficial effects:

[0009] The above-mentioned page display control method, device, and electronic device provide a graphical user interface through a terminal device; control the display of a first page on the graphical user interface; respond to a display instruction for a second page, divide the display area in the graphical user interface, and control the first and second pages to be displayed in different display areas; respond to the display area of ​​the target page meeting a preset condition, layout the page objects in the target page according to the layout method corresponding to the preset condition; wherein the target page includes the first page and / or the second page; the layout method includes: a horizontal layout method or a vertical layout method. In this method, multiple pages are displayed in a split-screen manner, and the pages are controlled to be laid out in a horizontal or vertical manner according to the display area. The user can understand the contents of multiple pages at the same time, and a reasonable layout method is also more conducive to the user's operation of the objects on the page, thereby improving the user's operating experience.

[0010] Other features and advantages of the present invention will be described in the following description, and in part will become apparent from the description, or understood by practicing the present invention. The purposes and other advantages of the present invention are realized and obtained by the structures particularly pointed out in the description, claims and drawings.

[0011] In order to make the above-mentioned objects, features and advantages of the present invention more obvious and easy to understand, preferred embodiments are given below and described in detail with reference to the accompanying drawings. BRIEF DESCRIPTION OF THE DRAWINGS

[0012] In order to more clearly illustrate the specific embodiments of the present invention or the technical solutions in the prior art, the following briefly introduces the drawings required for use in the specific embodiments or the description of the prior art. Obviously, the drawings described below are some embodiments of the present invention. For those skilled in the art, other drawings can be obtained based on these drawings without paying any creative work.

[0013] Figure 1 This is a schematic diagram of a page display method in the related art;

[0014] Figure 2 This is a schematic diagram of displaying a page through a floating window in the related art;

[0015] Figure 3 A flow chart of a page display control method provided by an embodiment of the present invention;

[0016] Figure 4 A schematic diagram of triggering split-screen display through a split-screen control provided in an embodiment of the present invention;

[0017] Figure 5 A schematic diagram of triggering split-screen display through a display mode selection control provided in an embodiment of the present invention;

[0018] Figure 6 A schematic diagram of an embodiment of the present invention showing a first page displayed in portrait mode and a second page displayed in landscape mode;

[0019] Figure 7 A schematic diagram showing that both the first and second pages are displayed in landscape mode according to an embodiment of the present invention;

[0020] Figure 8 A schematic diagram of an embodiment of the present invention showing a first page displayed in landscape mode and a second page displayed in portrait mode;

[0021] Figure 9 A schematic diagram showing only the first page after canceling the split-screen display according to an embodiment of the present invention;

[0022] Figure 10 A schematic diagram of displaying a second page on top of a first page after canceling the split-screen display according to an embodiment of the present invention;

[0023] Figure 11 A schematic structural diagram of a page display control device provided by an embodiment of the present invention;

[0024] Figure 12 A schematic diagram of an electronic device provided by an embodiment of the present invention. DETAILED DESCRIPTION

[0025] To make the objectives, technical solutions, and advantages of the embodiments of the present invention more clear, the technical solutions of the present invention will be clearly and completely described below with reference to the accompanying drawings. Obviously, the embodiments described are only part of the embodiments of the present invention, not all of them. Based on the embodiments of the present invention, all other embodiments obtained by those skilled in the art without creative work shall fall within the scope of protection of the present invention.

[0026] In mobile games, when the game screen is displayed on the interface, if you open other pages, such as the props page, chat page, etc., part of the game screen will be blocked. Figure 1 As shown; when a user switches between multiple applications on a mobile device, the newly opened application screen will cover the originally displayed application screen.

[0027] In the related art, in order to avoid blocking the game screen, the game screen is displayed in a floating window, such as Figure 2 , the game screen is displayed in a floating window above the newly opened screen, so that the user can understand the game status in real time; in addition, when the user switches applications, the original application screen can also be displayed in a floating window.

[0028] However, the display area of ​​the floating window is usually very small, and users may not be able to see the content of the screen clearly, making it difficult to clearly display the game status; the floating window will also block the content of the newly opened page, which is not conducive to users viewing and operating the new page; in addition, when the user operates the floating window, it is difficult to distinguish whether the operation is performed on the floating window itself or on the object on the screen within the floating window, and the operation is difficult. For example, a drag operation may be recognized as a drag on the floating window, or it may be recognized as a drag on an object on the screen within the floating window.

[0029] Based on the above problems, the embodiments of the present invention provide a page display control method, device and electronic device, which can be applied to the display control between multiple pages in a game, and can also be applied to the display control of program screens of multiple applications.

[0030] The page display control method in one embodiment of the present disclosure can be run on a local terminal device or a server. When the page display control method is run on a server, the method can be implemented and executed based on a cloud interaction system, wherein the cloud interaction system includes a server and a client device.

[0031] In an optional embodiment, various cloud applications can be run under the cloud interaction system, such as cloud games. Taking cloud games as an example, cloud games refer to a gaming method based on cloud computing. In the cloud game operation mode, the operating body of the game program and the main body of the game screen presentation are separated. The storage and operation of the page display control method are completed on the cloud game server. The role of the client device is to receive and send data and present the game screen. For example, the client device can be a display device with data transmission function close to the user side, such as a mobile terminal, TV, computer, PDA, etc.; but the cloud game server in the cloud is responsible for information processing. When playing the game, the user operates the client device to send operation instructions to the cloud game server. The cloud game server runs the game according to the operation instructions, encodes and compresses the game screen and other data, and returns it to the client device through the network. Finally, the client device decodes and outputs the game screen.

[0032] In an optional embodiment, taking a game as an example, the local terminal device stores the game program and is used to present the game screen. The local terminal device is used to interact with the user through a graphical user interface, that is, the game program is downloaded and installed and run by the conventional electronic device. The local terminal device can provide the graphical user interface to the user in a variety of ways, for example, it can be rendered and displayed on the terminal display, or provided to the user through holographic projection. For example, the local terminal device may include a display screen and a processor, the display screen is used to present the graphical user interface, the graphical user interface includes the game screen, and the processor is used to run the game, generate the graphical user interface, and control the display of the graphical user interface on the display screen.

[0033] In a possible implementation, an embodiment of the present invention provides a page display control method, providing a graphical user interface through a terminal device, wherein the terminal device can be the local terminal device mentioned above, or the client device in the cloud interaction system mentioned above.

[0034] like Figure 3 In the page, the control method is displayed, including the following steps:

[0035] Step S302, controlling the display of a first page on the graphical user interface;

[0036] The first page can be a game match screen, a game lobby page, etc., or a page of a currently used application, for example, a video screen currently being played by a video application, etc. When the graphical user interface displays the first page, it can be understood that the interface only displays the first page, and the first page does not block other pages.

[0037] Step S304, responding to the display instruction for the second page, dividing the display area in the graphical user interface, and controlling the first page and the second page to be displayed in different display areas;

[0038] The purpose of this display instruction is to control the split-screen display of the first and second pages so that they do not obstruct each other. The display instruction for the second screen can be implemented through various display triggering operations; for example, a display trigger control for the second page is displayed on the first page, and the display instruction is generated by triggering the display trigger control; or after the second page is displayed on top of the first page, a specific triggering operation for the second page is executed to generate the display instruction.

[0039] Alternatively, the first page is a page of a currently displayed application. When the user performs an application switching operation, a display instruction for a second page is generated. The second page may be a main page of the newly switched application, or other pages.

[0040] The graphical user interface may be divided into a plurality of display areas, for example, at least two display areas, or may be divided into three or more display areas, with the first page and the second page occupying part of the display areas.

[0041] In one example, the graphical user interface can be divided into two display areas, which can be arranged horizontally, vertically, or in other ways; for the first page and the second page, each page occupies one display area, so that the first page and the second page do not block each other.

[0042] If the display area of ​​the first page is smaller than the display area of ​​the first page in the graphical user interface, it is usually necessary to shrink the first page and then display it in the display area of ​​the first page; for example, the graphical user interface displays the first page in full screen, and then receives a display instruction for the second page, the first page needs to be shrunk and then displayed in the corresponding display area.

[0043] Step S306, in response to the display area of ​​the target page meeting the preset conditions, layout the page objects in the target page according to the layout method corresponding to the preset conditions; wherein the target page includes the first page and / or the second page; the layout method includes: horizontal layout method or vertical layout method.

[0044] The preset condition can be set based on the display area's dimensions, such as width, length, or area. For example, the preset condition includes a parameter range for a specific region dimension parameter. When the characteristic region dimension parameter of the display area falls within this parameter range, the target page's display area satisfies the preset condition. The preset condition can also be set based on the display area's shape. For example, the preset condition includes a criterion for determining whether the display area has a specific shape. The specific shape can be, for example, a rectangle, square, or trapezoid.

[0045] Multiple preset conditions can be preset, different preset conditions correspond to different layout methods, and the correspondence between preset conditions and layout methods can be preset; if the display area of ​​the target page meets preset condition A, the target page is laid out according to the layout method corresponding to preset condition A.

[0046] In actual implementation, when the display area is initially divided, it can be divided according to the default method. For example, display area 1 is used to display the first page. The divided display area 1 meets preset condition 1, and the first page is laid out according to the layout method corresponding to preset condition 1; display area 2 is used to display the second page. The divided display area 2 meets preset condition 2, and the second page is laid out according to the layout method corresponding to preset condition 2.

[0047] In one example, the graphical user interface is divided into two display areas, the display area used to display the first page meets preset condition A, and the layout mode corresponding to preset condition A is a vertical screen layout mode, and the display area used to display the second page meets preset condition B, and the layout mode corresponding to preset condition B is a horizontal screen layout mode.

[0048] It should be noted that the target page can be the first page, the second page, or both. In addition to the display area automatically divided by the graphical user interface, the user can also adjust the display area through operation, thereby changing the preset conditions met by the display area. In this case, the layout of the target page in the display area will also change accordingly.

[0049] The horizontal screen layout mode can be understood as that the horizontal length of the target page is greater than the vertical length; the vertical screen layout mode can be understood as that the horizontal length of the target page is less than the vertical length.

[0050] The above-mentioned page display control method provides a graphical user interface through a terminal device; controls the display of a first page on the graphical user interface; responds to a display instruction for a second page, divides the display area in the graphical user interface, and controls the first and second pages to be displayed in different display areas; responds to the display area of ​​the target page meeting a preset condition, layouts the page objects in the target page according to the layout method corresponding to the preset condition; wherein the target page includes the first page and / or the second page; the layout method includes: a horizontal layout method or a vertical layout method. In this method, multiple pages are displayed in a split-screen manner, and the pages are controlled to be laid out in a horizontal or vertical manner according to the display area. The user can understand the contents of multiple pages at the same time, and a reasonable layout method is also more conducive to the user's operation of the objects on the page, thereby improving the user's operating experience.

[0051] In a specific implementation method, in response to a display trigger operation for the second page, a display mode pre-set for the second page and the first page is obtained; it is determined that the display mode indicates that the second page and the first page are displayed in split screen, the display area is divided in the graphical user interface, and the first page and the second page are controlled to be displayed in different display areas.

[0052] In actual implementation, the display mode for the first page and the second page can be pre-set. For example, in the settings page, the display mode of the first page and the second page can be set, such as split-screen display, blocked display, etc.; when the first page and the second page are set to split-screen display, after the user performs a display trigger operation, the first page and the second page are displayed in a split-screen display manner, that is, the display area is divided in the graphical user interface, and the first page and the second page are controlled to be displayed in different display areas.

[0053] When the first page and the second page are set to be blocked display, after the user performs the display triggering operation, the second page is displayed on the first page, that is, the second page blocks at least a portion of the first page.

[0054] The display trigger operation can be an operation on a trigger control corresponding to the second page, or a preset operation for triggering the display of the second page, such as a sliding operation. When the display trigger operation is executed, the display mode of the second page and the first page is determined by the preset display mode. That is, after executing the same display trigger operation, if the display mode is set differently, the display mode of the second page and the first page will be different.

[0055] In the above method, the display mode of the second page and the first page is controlled by the pre-set display mode. The user does not need to perform specific operations to control the split-screen display of multiple pages. The control method is convenient and efficient.

[0056] In another implementation, in response to a display trigger operation for the second page, operation parameters of the display trigger operation are obtained; it is determined that the operation parameters indicate that the second page and the first page are displayed in split screens, the display area is divided in the graphical user interface, and the first page and the second page are controlled to be displayed in different display areas.

[0057] Different display triggering operations generate different operating parameters. If the operating parameter indicates that the second page and the first page should be displayed in split-screen mode, the graphical user interface divides the display area, controlling the first and second pages to be displayed in different display areas. The operating parameter can specifically be the control selected by the display triggering operation. If a control for split-screen display is selected, the operating parameter indicates that the second page should be displayed in split-screen mode with the first page; if a control for floating window display is selected, the operating parameter indicates that the first page should also be displayed as a floating window on top of the second page.

[0058] The operation parameter can also be the specific operation type of the display trigger operation. For example, if the display trigger operation is a sliding operation on the display trigger control, the operation parameter indicates that the second page and the first page are displayed in split screen; if the display trigger operation is a click operation on the display trigger control, the operation parameter indicates that the second page is displayed on top of the first page, covering part of the first page.

[0059] Specifically, the first page includes a display trigger control for the second page; in response to the first trigger operation for the display trigger control, split-screen operation information is displayed; in response to the trigger operation indicated by the split-screen operation information, operation parameters indicating the split-screen display of the second page and the first page are generated.

[0060] The display triggers the control to display different specific trigger operations. The aforementioned first trigger operation can be a double-click operation, a long press operation, a sliding operation, etc. After executing the first trigger operation, the split-screen operation information is displayed. The split-screen operation information is used to indicate the operation method for controlling the split-screen display of the second page and the first page. The split-screen operation information can specifically be the operation control for controlling the split-screen display of the second page and the first page, or the type of operation for controlling the split-screen display of the second page and the first page, such as performing a double-click operation, a sliding operation in a specific direction, etc.

[0061] After the split-screen operation information is displayed, the user performs a trigger operation corresponding to the split-screen operation information, and an operation parameter indicating the split-screen display of the second page and the first page is generated to control the split-screen display of the second page and the first page.

[0062] In a specific operation, in response to a long press operation on a display trigger control, a split-screen control is displayed at a specified position relative to the display trigger control; in response to a sliding operation starting from the display trigger control, and a sliding end operation acting on the split-screen control, operation parameters indicating the split-screen display of the second page and the first page are generated.

[0063] The aforementioned designated position may be a position around the display trigger control, such as the left position, right position, top position, etc.; Figure 4 , the split-screen controls appear on top of the display-trigger controls. Figure 4 The dotted arrow in the figure shows the trajectory of the sliding operation. After the user long presses the display trigger control, without lifting the finger from the screen, the sliding operation begins. The sliding direction of the sliding operation is the direction of the split-screen control relative to the display trigger control. After the sliding operation slides to the split-screen control, the user lifts the finger, which means the sliding operation ends. At this time, the operation parameter indicating the split-screen display of the second page and the first page is generated. Of course, the operation parameter indicating the split-screen display of the second page and the first page can also be generated by clicking the split-screen control.

[0064] In another embodiment, in response to a first trigger operation for displaying a trigger control, a second page is displayed on top of the first page; wherein the second page obscures at least a portion of the first page; and in response to a second trigger operation for the second page, an operation parameter of the second trigger operation is obtained.

[0065] The first trigger operation is usually a conventional trigger operation for displaying a trigger control, such as a single-click operation, a sliding operation, etc. After executing the first trigger operation, the second page is displayed on the first page, that is, the second page covers all or part of the first page; when the second trigger operation is no longer executed, the second page covers all or part of the first page, and the display mode no longer changes.

[0066] When the second page blocks all or part of the first page for display, and then the second trigger operation is performed, the operation parameters of the second trigger operation are obtained, and the display mode of the second page is changed according to the change of the operation parameters of the second trigger operation. The second trigger operation can be an operation to trigger a specific control, or an operation to select a display mode, etc.

[0067] Furthermore, in response to a second trigger operation on the second page, at least one display mode selection control is controlled to be displayed; wherein, the display mode selection control includes a split-screen mode selection control; in response to a selection operation on the display mode selection control, the operation parameters of the second trigger operation are generated based on the target display mode indicated by the selected display mode selection control.

[0068] For example, the second trigger operation can be a long press operation, a double-click operation, a single-click operation, etc. on the second page; the display mode selection control includes: a split-screen mode selection control, a floating window mode selection control, an occlusion mode selection control, etc.; in order to achieve split-screen display, the display mode selection control includes at least a split-screen mode selection control, and may also include a floating window mode selection control, an occlusion mode selection control, etc.

[0069] The aforementioned selection operation is achieved by executing click operations, sliding operations, etc. on the display mode selection control, and the target display mode indicated by the selected display mode selection control is used as the operation parameter of the second trigger operation, thereby controlling the second page to be displayed according to the target display mode.

[0070] In a specific operation method, in response to a long press operation on the second page, at least one display mode selection control is controlled to be displayed; in response to a sliding operation starting from the second page, and a sliding end operation acting on the first display mode selection control, the operation parameters of the second trigger operation are generated based on the target display mode indicated by the first display mode selection control.

[0071] Figure 1 In the example, the first page is the game screen, and the second page is the props page; the second page is displayed on top of the first page, that is, the second page blocks the display of the first page. Figure 1 On the basis of , a long press operation is performed on the second page, for example, a long press operation is performed on the top area of ​​the second page, and the above-mentioned display mode selection control is displayed; Figure 5 In the example, two display mode selection controls are displayed, namely a selection control for split-screen display and a selection control for floating window display.

[0072] refer to Figure 5 In the , after long pressing the second page, perform a sliding operation starting from the second page, then when the sliding operation starts, the second page is displayed in a reduced size, and the reduced second page moves with the touch point of the sliding operation; Figure 5 In the figure, the dotted arrow represents the sliding track of the sliding operation. When the sliding operation starts, the second page is displayed in a reduced size. The second page before the sliding operation is displayed in a dotted line, indicating that the second page is no longer displayed, and only the reduced second page is displayed.

[0073] The sliding end operation is the operation of lifting the user's finger. When the contact point of the sliding operation is located at the first display mode selection control, the sliding end operation is performed at this time, the first display mode selection control is selected, and the target display mode corresponding to the first display mode selection control is used as the operation parameter of the second trigger operation, and the second page is displayed according to the target display mode.

[0074] When the touch point of the sliding operation is located on the first display mode selection control, or the second page contacts or overlaps with the first display mode selection control, the first display mode selection control can be displayed in a specified display format, for example, highlighted, flashing, etc., to prompt the user that if the sliding end operation is performed at this time, the first display mode selection control can be selected.

[0075] For example, if the target display mode is split-screen display, the first page and the second page are displayed in different display areas; for another example, if the target display mode is floating window display, the second page is still displayed on the first page, and at the same time, a floating window is generated on the second page, and the first page is displayed in the floating window.

[0076] refer to Figure 5 In the , slide operation slide to the 'split screen' display mode selection control, then perform the sliding end operation, the first page and the second page are displayed in split screen.

[0077] In the above method, the display mode of the second page and the first page is controlled by the operation mode, and the user can change the display mode in real time according to actual needs. The control method is more convenient and flexible.

[0078] Furthermore, in order to increase interactivity, in response to a long press operation on the second page, the display status of the second page is updated; wherein, the display status includes: page display size and / or page transparency; in response to a sliding operation starting from the second page, the second page after the status is updated is controlled to move along with the contact point of the sliding operation.

[0079] The display state may include both the page display size and the page transparency, or may include only one of the page display size and the page transparency. For example, after a long press operation is performed, the page transparency of the second page increases. In one example, before the long press operation is performed, the page transparency of the second page is zero, and after the long press operation is performed, the page transparency of the second page is 50%.

[0080] For another example, after performing a long press operation, the page display size of the second page is reduced.

[0081] In actual implementation, after performing the long press operation, only the page display size of the second page may be updated, only the page transparency may be updated, or both the page display size and the page transparency may be updated simultaneously.

[0082] In one implementation, after a long press operation is performed, the page transparency of the second page is controlled to increase, and the page display size remains unchanged; after a sliding operation starting from the second page is performed, the page display size of the second page is controlled to decrease, and then the second page after the status is updated is controlled to move with the contact point of the sliding operation.

[0083] In the above manner, updating the display state of the second page according to the user's operation can interact with the user's operation, so that the user's operation has obvious feedback prompts, thereby improving the user's operation efficiency and operation experience.

[0084] In a specific implementation method, in response to a display instruction for the second page, a first display area and a second display area are divided in a graphical user interface; the first page is controlled to be displayed in the first display area, and the second page is controlled to be displayed in the second display area; wherein, the first display area meets the first preset condition corresponding to the vertical screen layout mode, and the second display area meets the second preset condition corresponding to the horizontal screen layout mode.

[0085] The display instruction is an instruction for controlling the split-screen display of the second page and the first page, that is, the second page and the first page are displayed in different display areas; based on this, the first display area and the second display area are divided in the graphical user interface; considering that the user may be more concerned about the page content of the second page, in this embodiment, the first display area meets the first preset condition corresponding to the vertical screen layout mode, and the second display area meets the second preset condition corresponding to the horizontal screen layout mode.

[0086] When a display instruction for the second page is received, the first page layouts the page objects in the first page in a portrait layout, and the second page layouts the page objects in the second page in a landscape layout. Page objects include controls, images, scene images, video images, etc. in the page.

[0087] It can be understood that the first display area is usually smaller than the second display area. The first page is displayed in a vertical layout in the smaller first display area; the second page is displayed in a horizontal layout in the larger second display area, so that it is convenient for users to view and operate the second page.

[0088] In other implementations, when a display instruction for the second page is received, the first display area may satisfy the second preset condition corresponding to the horizontal layout mode, and the second display area may satisfy the second preset condition corresponding to the horizontal layout mode; or the first display area may satisfy the second preset condition corresponding to the horizontal layout mode, and the second display area may satisfy the first preset condition corresponding to the vertical layout mode. Alternatively, the first display area may satisfy the first preset condition corresponding to the vertical layout mode, and the second display area may satisfy the first preset condition corresponding to the vertical layout mode.

[0089] Specifically, the above-mentioned preset conditions include the area size of the display area; in response to the area size of the display area of ​​the target page being within a first size range, the page objects in the target page are laid out in a horizontal layout manner; in response to the area size of the display area of ​​the target page being within a second size range, the page objects in the target page are laid out in a vertical layout manner.

[0090] The area size can be specifically the area, width, length, etc. of the display area, and the first size range and the second size range are set. The area size of the display area can be preset by the system or generated by user adjustment.

[0091] For example, if the system pre-sets the area size of the display area to be within the first size range, then after receiving the aforementioned display instruction, the page objects in the target page are laid out in a horizontal layout; for another example, if the user adjusts the area size so that the area size of the display area is adjusted from the second size range to the first size range, then the target page switches from a vertical layout to a horizontal layout.

[0092] In a specific operation method, the area size of the display area of ​​the target page is controlled to be adjusted so that the page size of the target page changes with the change of the area size; in response to the area size of the display area of ​​the target page being adjusted from a first size range to a second size range, the target page is controlled to switch from a horizontal screen layout mode to a vertical screen layout mode; or, in response to the area size of the display area of ​​the target page being adjusted from the second size range to the first size range, the target page is controlled to switch from a vertical screen layout mode to a horizontal screen layout mode.

[0093] For example, you can adjust the size of the display area by sliding it, or by using a zoom control to zoom the display area. When the area size changes, the size of the target page within the display area changes adaptively; for example, when the area size increases, the size of the target page also increases; when the area size decreases, the size of the target page also decreases.

[0094] During the process of region size change, the size range to which the current region size belongs can be monitored in real time. When the size range changes, the layout of the target page changes.

[0095] refer to Figure 6 In response to a display instruction for the second page, considering that the user is more inclined to view or operate the second page, the second page is displayed in landscape mode, so that the second page occupies a larger display area, and the first page is displayed in portrait mode, so that the first page occupies a smaller display area. In this case, the area size of the display area of ​​the second page meets the first size range, and the area size of the display area of ​​the first page meets the second size range.

[0096] Then, the user zooms in or out of the display area of ​​the first page or the second page. Figure 7 , the area size of the display area of ​​the first page is adjusted from the second size range to the first size range, so the first page is switched from the vertical screen display mode to the horizontal screen display mode, and at the same time, Figures 6 to 7 In the change of , the area size of the display area of ​​the second page is always within the first size range, and the second page is always displayed in horizontal mode.

[0097] Furthermore, the user continues to zoom in and out of the display area of ​​the first page or the second page, referring to Figure 8 , the area size of the display area of ​​the second page is adjusted from the first size range to the second size range, so the second page is switched from the horizontal screen display mode to the vertical screen display mode, and at the same time, Figures 7 to 8 In the change of , the area size of the display area of ​​the first page is always within the first size range, and the first page is always displayed in a horizontal screen mode.

[0098] exist Figure 6 、 Figure 7 and Figure 8 In the GUI of the terminal device, the screen is horizontal, so Figure 6 、 Figure 7 and Figure 8 As shown, the screen is split into left and right parts; in addition, when the graphical user interface of the terminal device is in a vertical screen display mode, the first page and the second page can be split into upper and lower parts.

[0099] In one specific operation mode, in response to a zoom control operation on the display area of ​​a target page, the size of the display area of ​​the target page is adjusted. In this mode, the zoom control operation is directly applied to the target page. For example, the zoom control operation is a sliding operation of two fingers moving apart from each other, which is used to reduce the size of the area, or a sliding operation of two fingers moving together, which is used to enlarge the size of the area. When the target page is a first page, in response to the zoom control operation on the display area of ​​the first page, the size of the display area of ​​the first page is adjusted. When the target page is a second page, in response to the zoom control operation on the display area of ​​the second page, the size of the display area of ​​the second page is adjusted.

[0100] Alternatively, in response to a zoom control operation on the display area of ​​the current page other than the target page, the area size of the display area of ​​the current page is adjusted, and the area size of the display area of ​​the target page is controlled to follow the change in the area size of the display area of ​​the current page; wherein the area size of the display area of ​​the target page is negatively correlated with the area size of the display area of ​​the current page.

[0101] This method indirectly adjusts the size of the target page's display area by adjusting the display area of ​​other pages. For example, when the target page is the first page and the current page is the second page, the size of the second page's display area is adjusted in response to a zoom control operation on the second page's display area, and the size of the first page's display area is controlled to follow the size of the second page's display area. That is, when the second page's display area is enlarged, the first page's display area is reduced, and when the second page's display area is reduced, the first page's display area is enlarged.

[0102] For example, when the target page is the second page and the current page is the first page, in response to the zoom control operation on the display area of ​​the first page, the area size of the display area of ​​the first page is adjusted, and the area size of the display area of ​​the second page is controlled to follow the area size change of the display area of ​​the first page, that is, when the display area of ​​the first page is enlarged, the display area of ​​the second page is reduced, and when the display area of ​​the first page is reduced, the display area of ​​the second page is enlarged.

[0103] In one specific operation mode, in response to a drag operation on an adjustment control between the display area of ​​the first page and the display area of ​​the second page, the display area of ​​the first page and the display area of ​​the second page are adjusted. When the display area of ​​the first page is enlarged, the display area of ​​the second page is reduced, and when the display area of ​​the first page is reduced, the display area of ​​the second page is enlarged.

[0104] In the above method, the area size of the display area is adjusted through the zoom control operation, thereby controlling the page layout of the page to switch between horizontal screen display mode and vertical screen display mode, so that the page layout matches the display area size of the page, thereby facilitating users to perform page operations and view page content, thereby improving user operation efficiency.

[0105] In a specific implementation, in response to the display area of ​​the target page meeting a specified condition, the division of the display area is canceled; the first page is displayed on the graphical user interface, or the second page is displayed on top of the first page.

[0106] The specified condition can be understood as a condition for canceling the split-screen display. After canceling the split-screen display, only the first page is displayed, or the first page is displayed on top of the second page, and the second page obscures at least a portion of the first page.

[0107] After the display area division is canceled, the content displayed in the graphical user interface is determined based on the specific specified conditions satisfied by the display area of ​​the target page. For example, if the target page includes a first page, the specified condition may be that the area size of the display area of ​​the first page is larger than the specified area size. In this case, after the display area division is canceled, only the first page is displayed in the graphical user interface. If the target page includes a second page, the specified condition may be that the area size of the display area of ​​the second page is larger than the specified area size. In this case, after the display area division is canceled, the first page is displayed on top of the second page.

[0108] In a specific manner, in response to the area size of the display area of ​​the second page being smaller than the first specified area size, the division of the display area is canceled, and the first page is displayed on the graphical user interface.

[0109] The area size can be the length, width, area, etc. of the display area; Figure 8 , Figure 8 The display area of ​​the second page is smaller. On this basis, if the display area of ​​the second page is further reduced, it means that the user is not interested in the content of the second page. When the display area of ​​the second page is reduced to less than the first specified area size, the split-screen display is canceled and only the first page is displayed. Figure 9 .

[0110] It should be noted that reducing the display area of ​​the second page may be performing a zoom-out operation on the display area of ​​the second page, or may be performing a zoom-in operation on the display area of ​​the first page.

[0111] In another embodiment, in response to the area size of the display area of ​​the second page being larger than the second specified area size, the division of the display area is cancelled, and the second page is displayed on top of the first page.

[0112] refer to Figure 6, Figure 6 The display area of ​​the second page is larger. On this basis, if the display area of ​​the second page is further enlarged, it means that the user is very interested in the content of the second page. When the display area of ​​the second page is enlarged to be larger than the second specified area size, the split screen display is canceled and the second page is displayed on top of the first page. The first page is blocked, such as Figure 10 .

[0113] Enlarging the display area of ​​the second page may be performing a zoom-in operation on the display area of ​​the second page, or may be performing a zoom-out operation on the display area of ​​the first page.

[0114] Another method is to respond to a page close instruction for the second page by canceling the divided display area and displaying the first page in the graphical user interface. During the split-screen display, the user can operate the page close control of the second page or a designated page close operation to issue a page close instruction; after the second page is closed, the split-screen display is automatically canceled, and only the first page is displayed.

[0115] In the above method, the split-screen display is canceled through operation, which is convenient and can meet the user's personalized viewing and operation needs.

[0116] Corresponding to the above method embodiment, see Figure 11 The schematic diagram of the structure of a page display control device shown in FIG. 1 provides a graphical user interface through a terminal device; the device includes:

[0117] The page display module 110 is used to control the display of the first page on the graphical user interface;

[0118] A partition display module 112 is configured to respond to a display instruction for the second page, divide the display area in the graphical user interface, and control the first page and the second page to be displayed in different display areas;

[0119] The object layout module 114 is used to layout the page objects in the target page according to the layout method corresponding to the preset conditions in response to the display area of ​​the target page meeting the preset conditions; wherein the target page includes the first page and / or the second page; the layout method includes: horizontal screen layout method or vertical screen layout method.

[0120] The above-mentioned page display control device provides a graphical user interface through a terminal device; controls the display of a first page on the graphical user interface; responds to a display instruction for a second page, divides the display area in the graphical user interface, and controls the first and second pages to be displayed in different display areas; responds to the display area of ​​the target page meeting a preset condition, and layouts the page objects in the target page according to the layout method corresponding to the preset condition; wherein the target page includes the first page and / or the second page; the layout method includes: a horizontal layout method or a vertical layout method. In this method, multiple pages are displayed in a split-screen manner, and the pages are controlled to be laid out in a horizontal or vertical manner according to the display area. The user can understand the contents of multiple pages at the same time. The reasonable layout method also makes it easier for the user to operate the objects on the page, thereby improving the user's operating experience.

[0121] The above-mentioned partition display module is used to: respond to the display trigger operation for the second page, obtain the display mode pre-set for the second page and the first page; determine the display mode to indicate that the second page and the first page are displayed in split screen, divide the display area in the graphical user interface, and control the first page and the second page to be displayed in different display areas.

[0122] The above-mentioned partition display module is used to: respond to the display trigger operation for the second page, obtain the operation parameters of the display trigger operation; determine the operation parameters indicating that the second page and the first page are displayed in split screen, divide the display area in the graphical user interface, and control the first page and the second page to be displayed in different display areas.

[0123] The above-mentioned first page includes a display trigger control for the second page; the above-mentioned partition display module is used to: respond to the first trigger operation for the display trigger control, display split-screen operation information; respond to the trigger operation indicated by the split-screen operation information, and generate operation parameters indicating the split-screen display of the second page and the first page.

[0124] The above-mentioned partition display module is used to: respond to a long press operation on the display trigger control, and display the split-screen control at a specified position relative to the display trigger control; respond to a sliding operation starting from the display trigger control, and a sliding end operation acting on the split-screen control, and generate operation parameters indicating the split-screen display of the second page and the first page.

[0125] The above-mentioned first page includes a display trigger control for the second page; the above-mentioned partition display module is used to: respond to the first trigger operation for the display trigger control, display the second page on the first page; wherein the second page blocks at least part of the first page; respond to the second trigger operation for the second page, obtain the operation parameters of the second trigger operation.

[0126] The above-mentioned partition display module is used to: respond to the second trigger operation for the second page, control the display of at least one display mode selection control; wherein the display mode selection control includes a split-screen mode selection control; respond to the selection operation for the display mode selection control, and generate the operation parameters of the second trigger operation based on the target display mode indicated by the selected display mode selection control.

[0127] The above-mentioned partition display module is used to: respond to a long press operation on the second page, control the display of at least one display mode selection control; respond to a sliding operation starting from the second page, and a sliding end operation acting on the first display mode selection control, and generate the operation parameters of the second trigger operation based on the target display mode indicated by the first display mode selection control.

[0128] The above-mentioned device also includes a status update module, which is used to: respond to a long press operation on the second page, update the display status of the second page; wherein the display status includes: page display size and / or page transparency; respond to a sliding operation starting from the second page, control the second page after the status update to follow the contact movement of the sliding operation.

[0129] The above-mentioned partition display module is used to: respond to the display instruction for the second page, divide the first display area and the second display area in the graphical user interface; control the first page to be displayed in the first display area and the second page to be displayed in the second display area; wherein, the first display area meets the first preset condition corresponding to the vertical screen layout mode, and the second display area meets the second preset condition corresponding to the horizontal screen layout mode.

[0130] The above-mentioned preset conditions include the area size of the display area; the above-mentioned object layout module is used to: in response to the area size of the display area of ​​the target page being within the first size range, layout the page objects in the target page according to the horizontal screen layout mode; in response to the area size of the display area of ​​the target page being within the second size range, layout the page objects in the target page according to the vertical screen layout mode.

[0131] The above-mentioned device also includes an adjustment module, which is used to: control the adjustment of the area size of the display area of ​​the target page so that the page size of the target page changes with the change of the area size; in response to the area size of the display area of ​​the target page being adjusted from the first size range to the second size range, control the target page to switch from a horizontal screen layout mode to a vertical screen layout mode; or, in response to the area size of the display area of ​​the target page being adjusted from the second size range to the first size range, control the target page to switch from a vertical screen layout mode to a horizontal screen layout mode.

[0132] The above-mentioned adjustment module is used to: respond to the zoom control operation on the display area of ​​the target page and adjust the area size of the display area of ​​the target page; or respond to the zoom control operation on the display area of ​​the current page other than the target page and adjust the area size of the display area of ​​the current page, so as to control the area size of the display area of ​​the target page to follow the area size of the display area of ​​the current page; wherein the area size of the display area of ​​the target page is negatively correlated with the area size of the display area of ​​the current page.

[0133] The above-mentioned device also includes a partition cancellation module, which is used to: cancel the partition of the display area in response to the display area of ​​the target page meeting the specified conditions; display the first page on the graphical user interface, or display the second page on the first page.

[0134] The partition cancellation module is configured to cancel the partitioning of the display area in response to the area size of the second page being smaller than the first specified area size, and to display the first page on the graphical user interface.

[0135] The partition cancellation module is configured to cancel the partitioning of the display area and display the second page on top of the first page in response to the area size of the display area of ​​the second page being larger than the second specified area size.

[0136] The above device also includes a page closing module, which is used to: respond to a page closing instruction for the second page, cancel the division of the display area, and display the first page on the graphical user interface.

[0137] This embodiment further provides an electronic device, including a processor and a memory, wherein the memory stores computer-executable instructions that can be executed by the processor, and the processor executes the computer-executable instructions to implement the above-mentioned page display control method. The electronic device can be a server or a terminal device.

[0138] See also Figure 12 As shown, the electronic device includes a processor 100 and a memory 101. The memory 101 stores computer-executable instructions that can be executed by the processor 100. The processor 100 executes the computer-executable instructions to implement the above-mentioned page display control method.

[0139] Furthermore, Figure 12 The electronic device shown further includes a bus 102 and a communication interface 103 , and the processor 100 , the communication interface 103 and the memory 101 are connected via the bus 102 .

[0140] The memory 101 may include high-speed random access memory (RAM) and may also include non-volatile memory, such as at least one disk storage. The communication connection between the system network element and at least one other network element is achieved through at least one communication interface 103 (which may be wired or wireless), and the Internet, wide area network, local area network, metropolitan area network, etc. may be used. The bus 102 may be an ISA bus, a PCI bus, or an EISA bus. The bus can be divided into an address bus, a data bus, a control bus, etc. For ease of representation, Figure 12 Only one bidirectional arrow is used in the diagram, but this does not mean that there is only one bus or one type of bus.

[0141] The processor 100 may be an integrated circuit chip with signal processing capabilities. During implementation, each step of the above method can be completed by hardware integrated logic circuits in the processor 100 or software instructions. The above processor 100 may be a general-purpose processor, including a central processing unit (CPU), a network processor (NP), etc.; it may also be 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. It can implement or execute the various methods, steps, and logic block diagrams disclosed in the embodiments of the present invention. The general-purpose processor may be a microprocessor or any conventional processor. The steps of the method disclosed in conjunction with the embodiments of the present invention 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 a random access memory, flash memory, read-only memory, programmable read-only memory, electrically erasable programmable memory, or register. The storage medium is located in the memory 101. The processor 100 reads the information in the memory 101 and, in conjunction with its hardware, completes the steps of the method of the aforementioned embodiment.

[0142] The processor in the electronic device can implement the following operations in the page display control method by executing computer-executable instructions:

[0143] A page display control method comprises providing a graphical user interface (GUI) through a terminal device; controlling the display of a first page on the GUI; responding to a display instruction for a second page, dividing a display area in the GUI, and controlling the first page and the second page to be displayed in different display areas; and responsive to the display area of ​​a target page satisfying a preset condition, laying out page objects in the target page according to a layout method corresponding to the preset condition; wherein the target page includes the first page and / or the second page; and the layout method includes: a horizontal layout method or a vertical layout method.

[0144] In response to a display trigger operation for the second page, a display mode pre-set for the second page and the first page is obtained; determining that the display mode indicates that the second page and the first page are displayed in split screen, dividing the display area in the graphical user interface, and controlling the first page and the second page to be displayed in different display areas.

[0145] In response to a display trigger operation for the second page, an operation parameter of the display trigger operation is obtained; it is determined that the operation parameter indicates that the second page and the first page are displayed in split screen, the display area is divided in the graphical user interface, and the first page and the second page are controlled to be displayed in different display areas.

[0146] The first page includes a display trigger control for the second page; in response to the first trigger operation for the display trigger control, split-screen operation information is displayed; in response to the trigger operation indicated by the split-screen operation information, operation parameters indicating the split-screen display of the second page and the first page are generated.

[0147] In response to a long press operation on the display trigger control, a split-screen control is displayed at a specified position relative to the display trigger control; in response to a sliding operation starting from the display trigger control, and a sliding end operation acting on the split-screen control, operation parameters indicating the split-screen display of the second page and the first page are generated.

[0148] A page includes a display trigger control for a second page; in response to a first trigger operation on the display trigger control, the second page is displayed on the first page; wherein the second page obscures at least a portion of the first page; in response to a second trigger operation on the second page, an operation parameter of the second trigger operation is obtained.

[0149] In response to a second trigger operation on the second page, control the display of at least one display mode selection control; wherein the display mode selection control includes a split-screen mode selection control; in response to a selection operation on the display mode selection control, generate operation parameters for the second trigger operation based on the target display mode indicated by the selected display mode selection control.

[0150] In response to a long press operation on the second page, control the display of at least one display mode selection control; in response to a sliding operation starting from the second page, and a sliding end operation acting on the first display mode selection control, generate operation parameters for the second trigger operation based on the target display mode indicated by the first display mode selection control.

[0151] In response to a long press operation on the second page, the display status of the second page is updated; wherein the display status includes: page display size and / or page transparency; in response to a sliding operation starting from the second page, the second page after the status is updated is controlled to move along with the contact point of the sliding operation.

[0152] In response to a display instruction for the second page, a first display area and a second display area are divided in the graphical user interface; the first page is controlled to be displayed in the first display area, and the second page is controlled to be displayed in the second display area; wherein the first display area satisfies a first preset condition corresponding to the vertical screen layout mode, and the second display area satisfies a second preset condition corresponding to the horizontal screen layout mode.

[0153] The preset conditions include the area size of the display area; in response to the area size of the display area of ​​the target page being within a first size range, the page objects in the target page are laid out in a horizontal layout manner; in response to the area size of the display area of ​​the target page being within a second size range, the page objects in the target page are laid out in a vertical layout manner.

[0154] Controlling adjustment of the area size of the display area of ​​the target page so that the page size of the target page changes with the change of the area size; in response to the area size of the display area of ​​the target page being adjusted from a first size range to a second size range, controlling the target page to switch from a horizontal layout mode to a vertical layout mode; or, in response to the area size of the display area of ​​the target page being adjusted from the second size range to the first size range, controlling the target page to switch from a vertical layout mode to a horizontal layout mode.

[0155] In response to a zoom control operation on the display area of ​​a target page, the area size of the display area of ​​the target page is adjusted; or, in response to a zoom control operation on the display area of ​​a current page other than the target page, the area size of the display area of ​​the current page is adjusted, and the area size of the display area of ​​the target page is controlled to follow the area size change of the display area of ​​the current page; wherein the area size of the display area of ​​the target page is negatively correlated with the area size of the display area of ​​the current page.

[0156] In response to the display area of ​​the target page meeting a specified condition, the display area is divided and displayed; the first page is displayed on the graphical user interface, or the second page is displayed on top of the first page.

[0157] In response to the area size of the display area of ​​the second page being smaller than the first specified area size, the division of the display area is canceled, and the first page is displayed on the graphical user interface.

[0158] In response to the area size of the display area of ​​the second page being larger than the second specified area size, the division of the display area is canceled, and the second page is displayed on top of the first page.

[0159] In response to the page closing instruction for the second page, the division of the display area is cancelled, and the first page is displayed on the graphical user interface.

[0160] In the above method, multiple pages are displayed in a split-screen manner, and the pages are controlled to be laid out in a horizontal or vertical manner according to the display area. Users can understand the contents of multiple pages at the same time. A reasonable layout method is also more conducive to users operating objects on the page, thereby improving the user's operating experience.

[0161] This embodiment further provides a computer-readable storage medium, which stores computer-executable instructions. When the computer-executable instructions are called and executed by a processor, the computer-executable instructions prompt the processor to implement the above-mentioned page display control method.

[0162] The computer-executable instructions stored in the computer-readable storage medium can implement the following operations in the page display control method by executing the computer-executable instructions:

[0163] A page display control method comprises providing a graphical user interface (GUI) through a terminal device; controlling the display of a first page on the GUI; responding to a display instruction for a second page, dividing a display area in the GUI, and controlling the first page and the second page to be displayed in different display areas; and responsive to the display area of ​​a target page satisfying a preset condition, laying out page objects in the target page according to a layout method corresponding to the preset condition; wherein the target page includes the first page and / or the second page; and the layout method includes: a horizontal layout method or a vertical layout method.

[0164] In response to a display trigger operation for the second page, a display mode pre-set for the second page and the first page is obtained; determining that the display mode indicates that the second page and the first page are displayed in split screen, dividing the display area in the graphical user interface, and controlling the first page and the second page to be displayed in different display areas.

[0165] In response to a display trigger operation for the second page, an operation parameter of the display trigger operation is obtained; it is determined that the operation parameter indicates that the second page and the first page are displayed in split screen, the display area is divided in the graphical user interface, and the first page and the second page are controlled to be displayed in different display areas.

[0166] The first page includes a display trigger control for the second page; in response to the first trigger operation for the display trigger control, split-screen operation information is displayed; in response to the trigger operation indicated by the split-screen operation information, operation parameters indicating the split-screen display of the second page and the first page are generated.

[0167] In response to a long press operation on the display trigger control, a split-screen control is displayed at a specified position relative to the display trigger control; in response to a sliding operation starting from the display trigger control, and a sliding end operation acting on the split-screen control, operation parameters indicating the split-screen display of the second page and the first page are generated.

[0168] A page includes a display trigger control for a second page; in response to a first trigger operation on the display trigger control, the second page is displayed on the first page; wherein the second page obscures at least a portion of the first page; in response to a second trigger operation on the second page, an operation parameter of the second trigger operation is obtained.

[0169] In response to a second trigger operation on the second page, control the display of at least one display mode selection control; wherein the display mode selection control includes a split-screen mode selection control; in response to a selection operation on the display mode selection control, generate operation parameters for the second trigger operation based on the target display mode indicated by the selected display mode selection control.

[0170] In response to a long press operation on the second page, control the display of at least one display mode selection control; in response to a sliding operation starting from the second page, and a sliding end operation acting on the first display mode selection control, generate operation parameters for the second trigger operation based on the target display mode indicated by the first display mode selection control.

[0171] In response to a long press operation on the second page, the display status of the second page is updated; wherein the display status includes: page display size and / or page transparency; in response to a sliding operation starting from the second page, the second page after the status is updated is controlled to move along with the contact point of the sliding operation.

[0172] In response to a display instruction for the second page, a first display area and a second display area are divided in the graphical user interface; the first page is controlled to be displayed in the first display area, and the second page is controlled to be displayed in the second display area; wherein the first display area satisfies a first preset condition corresponding to the vertical screen layout mode, and the second display area satisfies a second preset condition corresponding to the horizontal screen layout mode.

[0173] The preset conditions include the area size of the display area; in response to the area size of the display area of ​​the target page being within a first size range, the page objects in the target page are laid out in a horizontal layout manner; in response to the area size of the display area of ​​the target page being within a second size range, the page objects in the target page are laid out in a vertical layout manner.

[0174] Controlling adjustment of the area size of the display area of ​​the target page so that the page size of the target page changes with the change of the area size; in response to the area size of the display area of ​​the target page being adjusted from a first size range to a second size range, controlling the target page to switch from a horizontal layout mode to a vertical layout mode; or, in response to the area size of the display area of ​​the target page being adjusted from the second size range to the first size range, controlling the target page to switch from a vertical layout mode to a horizontal layout mode.

[0175] In response to a zoom control operation on the display area of ​​a target page, the area size of the display area of ​​the target page is adjusted; or, in response to a zoom control operation on the display area of ​​a current page other than the target page, the area size of the display area of ​​the current page is adjusted, and the area size of the display area of ​​the target page is controlled to follow the area size change of the display area of ​​the current page; wherein the area size of the display area of ​​the target page is negatively correlated with the area size of the display area of ​​the current page.

[0176] In response to the display area of ​​the target page meeting a specified condition, the display area is divided and displayed; the first page is displayed on the graphical user interface, or the second page is displayed on top of the first page.

[0177] In response to the area size of the display area of ​​the second page being smaller than the first specified area size, the division of the display area is canceled, and the first page is displayed on the graphical user interface.

[0178] In response to the area size of the display area of ​​the second page being larger than the second specified area size, the division of the display area is canceled, and the second page is displayed on top of the first page.

[0179] In response to the page closing instruction for the second page, the division of the display area is cancelled, and the first page is displayed on the graphical user interface.

[0180] In the above method, multiple pages are displayed in a split-screen manner, and the pages are controlled to be laid out in a horizontal or vertical manner according to the display area. Users can understand the contents of multiple pages at the same time. A reasonable layout method is also more conducive to users operating objects on the page, thereby improving the user's operating experience.

[0181] The page display control method, device, and computer program product of the electronic device provided in the embodiments of the present invention include a computer-readable storage medium storing program code. The instructions included in the program code can be used to execute the method described in the previous method embodiments. For specific implementation, please refer to the method embodiments and will not be repeated here.

[0182] Those skilled in the art will clearly understand that, for the convenience and brevity of description, the specific working processes of the above-described systems and devices can refer to the corresponding processes in the aforementioned method embodiments and will not be repeated here.

[0183] In addition, in the description of the embodiments of the present invention, unless otherwise expressly specified or limited, the terms "mounted," "connected," and "connected" should be understood in a broad sense. For example, they may refer to fixed connections, detachable connections, or integral connections; they may refer to mechanical connections or electrical connections; they may refer to direct connections or indirect connections through an intermediate medium; and they may refer to internal communication between two components. Those skilled in the art will understand the specific meanings of the above terms in the present invention based on the specific circumstances.

[0184] If the functions are implemented as software functional units and sold or used as independent products, they can be stored in a computer-readable storage medium. Based on this understanding, the technical solution of the present invention, or the portion that contributes to the prior art, or the portion of the technical solution, can be embodied in the form of a software product. This computer software product is stored in a storage medium and includes several instructions for causing a computer device (which can be a personal computer, server, or network device, etc.) to execute all or part of the steps of the methods described in various embodiments of the present invention. The aforementioned storage media include various media that can store program code, such as USB flash drives, mobile hard drives, read-only memories (ROMs), random access memories (RAMs), magnetic disks, or optical disks.

[0185] In the description of the present invention, it should be noted that the terms "center," "upper," "lower," "left," "right," "vertical," "horizontal," "inner," and "outer," etc., indicating orientations or positional relationships, are based on the orientations or positional relationships shown in the accompanying drawings and are intended solely to facilitate and simplify the description of the present invention. They are not intended to indicate or imply that the devices or components referred to must have, be constructed, or operate in a specific orientation, and therefore should not be construed as limitations on the present invention. Furthermore, the terms "first," "second," and "third" are used for descriptive purposes only and should not be construed as indicating or implying relative importance.

[0186] Finally, it should be noted that the above embodiments are only specific implementation methods of the present invention, which are used to illustrate the technical solutions of the present invention, rather than to limit them. The scope of protection of the present invention is not limited thereto. Although the present invention has been described in detail with reference to the above embodiments, those skilled in the art should understand that any person skilled in the art can modify or easily conceive of changes to the technical solutions described in the above embodiments within the technical scope disclosed by the present invention, or replace some of the technical features therein with equivalents. Such modifications, changes or replacements do not deviate from the spirit and scope of the technical solutions of the embodiments of the present invention, and should be included in the scope of protection of the present invention. Therefore, the scope of protection of the present invention should be based on the scope of protection of the claims.

Claims

1. A page display control method, characterized in that: Providing a graphical user interface through a terminal device; the method includes: Controlling display of a first page on the graphical user interface; In response to a display instruction for the second page, dividing a display area in the graphical user interface, and controlling the first page and the second page to be displayed in different display areas; In response to the display area of ​​the target page meeting a preset condition, laying out the page objects in the target page according to a layout method corresponding to the preset condition; wherein the target page includes the first page and / or the second page; the layout method includes: a horizontal layout method or a vertical layout method; The preset condition includes the area size of the display area; in response to the display area of ​​the target page satisfying the preset condition, the step of laying out the page objects in the target page according to the layout method corresponding to the preset condition includes: in response to the area size of the display area of ​​the target page being within a first size range, laying out the page objects in the target page according to a horizontal layout method; in response to the area size of the display area of ​​the target page being within a second size range, laying out the page objects in the target page according to a vertical layout method.

2. The method according to claim 1, characterized in that In response to a display instruction for the second page, the step of dividing the display area in the graphical user interface and controlling the first page and the second page to be displayed in different display areas includes: In response to a display triggering operation for the second page, obtaining a display mode pre-set for the second page and the first page; Determine that the display mode indicates that the second page and the first page are displayed on a split screen, divide the display area in the graphical user interface, and control the first page and the second page to be displayed in different display areas.

3. The method according to claim 1, characterized in that In response to a display instruction for the second page, the step of dividing the display area in the graphical user interface and controlling the first page and the second page to be displayed in different display areas includes: In response to a display triggering operation on the second page, obtaining an operation parameter of the display triggering operation; Determine that the operation parameter indicates that the second page and the first page are displayed on a split screen, divide the display area in the graphical user interface, and control the first page and the second page to be displayed in different display areas.

4. The method according to claim 3, characterized in that The first page includes a display trigger control for the second page; and the step of obtaining an operation parameter of the display trigger operation in response to the display trigger operation for the second page includes: In response to a first trigger operation on the display trigger control, displaying split-screen operation information; In response to a trigger operation indicated by the split-screen operation information, an operation parameter indicating split-screen display of the second page and the first page is generated.

5. The method according to claim 4, characterized in that The step of displaying split-screen operation information in response to a first trigger operation on the display trigger control includes: In response to a long press operation on the display trigger control, displaying a split-screen control at a designated position relative to the display trigger control; The step of generating, in response to a trigger operation indicated by the split-screen operation information, an operation parameter indicating split-screen display of the second page and the first page, comprises: In response to a sliding operation starting from the display trigger control and a sliding end operation acting on the split-screen control, an operation parameter indicating split-screen display of the second page and the first page is generated.

6. The method according to claim 3, characterized in that The first page includes a display trigger control for the second page; and the step of obtaining an operation parameter of the display trigger operation in response to the display trigger operation for the second page includes: In response to a first trigger operation on the display trigger control, displaying the second page on top of the first page; wherein the second page obscures at least a portion of the first page; In response to a second trigger operation on the second page, an operation parameter of the second trigger operation is obtained.

7. The method according to claim 6, characterized in that In response to a second trigger operation on the second page, the step of obtaining an operation parameter of the second trigger operation includes: In response to a second trigger operation on the second page, controlling the display of at least one display mode selection control; wherein the display mode selection control includes a split-screen mode selection control; In response to a selection operation on the display mode selection control, an operation parameter of the second trigger operation is generated based on a target display mode indicated by the selected display mode selection control.

8. The method according to claim 7, characterized in that In response to a second trigger operation on the second page, controlling the display of at least one display mode selection control includes: in response to a long press operation on the second page, controlling the display of at least one display mode selection control; The step of generating the operation parameter of the second trigger operation in response to the selection operation of the display mode selection control and based on the target display mode indicated by the selected display mode selection control includes: In response to a sliding operation starting from the second page and a sliding end operation acting on the first display mode selection control, an operation parameter of the second trigger operation is generated based on the target display mode indicated by the first display mode selection control.

9. The method according to claim 8, characterized in that The method further comprises: In response to a long press operation on the second page, updating a display state of the second page; wherein the display state includes: page display size and / or page transparency; In response to a sliding operation starting from the second page, the second page after the state is updated is controlled to move along with the contact point of the sliding operation.

10. The method according to claim 1, characterized in that In response to a display instruction for the second page, the step of dividing the display area in the graphical user interface and controlling the first page and the second page to be displayed in different display areas includes: In response to a display instruction for a second page, dividing the graphical user interface into a first display area and a second display area; Control the first page to be displayed in the first display area and the second page to be displayed in the second display area; wherein, the first display area satisfies a first preset condition corresponding to the vertical screen layout mode, and the second display area satisfies a second preset condition corresponding to the horizontal screen layout mode.

11. The method according to claim 1, wherein The method further comprises: Controlling and adjusting the area size of the display area of ​​the target page so that the page size of the target page changes following the change of the area size; In response to the area size of the display area of ​​the target page being adjusted from the first size range to the second size range, the target page is controlled to switch from a horizontal layout mode to a vertical layout mode; or, in response to the area size of the display area of ​​the target page being adjusted from the second size range to the first size range, the target page is controlled to switch from a vertical layout mode to a horizontal layout mode.

12. The method according to claim 11, characterized in that The step of controlling and adjusting the area size of the display area of ​​the target page includes: In response to a zoom control operation on the display area of ​​the target page, adjusting the area size of the display area of ​​the target page; Alternatively, in response to a zoom control operation on the display area of ​​the current page other than the target page, the area size of the display area of ​​the current page is adjusted, and the area size of the display area of ​​the target page is controlled to follow the change in the area size of the display area of ​​the current page; wherein the area size of the display area of ​​the target page is negatively correlated with the area size of the display area of ​​the current page.

13. The method according to claim 1, wherein The method further comprises: In response to the display area of ​​the target page meeting a specified condition, the display area is de-divided; the first page is displayed on the graphical user interface, or the second page is displayed on top of the first page.

14. The method according to claim 13, characterized in that In response to the display area of ​​the target page meeting a specified condition, canceling the division of the display area; and displaying the first page on the graphical user interface, comprising: In response to the area size of the display area of ​​the second page being smaller than the first specified area size, the display area is undivided and the first page is displayed on the graphical user interface.

15. The method according to claim 13, characterized in that In response to the display area of ​​the target page meeting a specified condition, canceling the division of the display area; The step of displaying the second page on the first page includes: In response to the area size of the display area of ​​the second page being larger than the second specified area size, the display area is undivided and the second page is displayed on top of the first page.

16. The method according to claim 1, wherein The method further comprises: In response to a page close instruction for the second page, the display area is undivided, and the first page is displayed on the graphical user interface.

17. A page display control device, characterized in that: A graphical user interface is provided through a terminal device; the device comprises: A page display module, configured to control the display of a first page on the graphical user interface; a partition display module, configured to respond to a display instruction for the second page, divide the display area in the graphical user interface, and control the first page and the second page to be displayed in different display areas; an object layout module, configured to, in response to a display area of ​​a target page satisfying a preset condition, layout the page objects in the target page according to a layout method corresponding to the preset condition; wherein the target page includes the first page and / or the second page; and the layout method includes: a horizontal layout method or a vertical layout method; The preset conditions include the area size of the display area; the object layout module is further used to: in response to the area size of the display area of ​​the target page being within a first size range, layout the page objects in the target page according to a horizontal screen layout; in response to the area size of the display area of ​​the target page being within a second size range, layout the page objects in the target page according to a vertical screen layout.

18. An electronic device, characterized in that: The method comprises a processor and a memory, wherein the memory stores computer-executable instructions that can be executed by the processor, and the processor executes the computer-executable instructions to implement the page display control method according to any one of claims 1 to 16.

19. A computer-readable storage medium, characterized in that The computer-readable storage medium stores computer-executable instructions. When the computer-executable instructions are called and executed by the processor, the computer-executable instructions prompt the processor to implement the page display control method according to any one of claims 1 to 16.

Citation Information

Patent Citations

  • Webpage screen splitting display method and device

    CN108572980A

  • Page split-screen display method and device

    CN114063958A