A method, apparatus, computer device, and storage medium for page grid adjustment

Abstract

The present disclosure provides a page grid adjustment method, apparatus, computer device, and storage medium. The method includes: obtaining page content to be rendered, and rendering and displaying the corresponding page content in each preset page grid corresponding to the target page; in response to a start trigger operation of the grid adaptive adjustment function, determining a first preset page grid corresponding to the target page content that is not fully displayed based on the displayed page content located in each preset page grid; adaptively adjusting the first preset page grid based on the target page content, and completely rendering and displaying the target page content according to the adjusted first preset page grid.

Description

Technical Field

[0001] The present disclosure relates to the technical field of front-end page, and in particular, to a page grid adjustment method, apparatus, computer device, and storage medium. Background Art

[0002] When designing a target page, how to reasonably perform page layout is a key issue. In the prior art, Grid grid technology is usually used for page layout to ensure the rationality of page layout. However, after the page layout is completed using the Grid grid technology, the sizes of the respective preset page grids corresponding to the target page for displaying and rendering content will also be fixed.

[0003] If dynamic content needs to be rendered in the preset page grid, it often causes the problem that some dynamic content cannot be fully displayed in the preset page grid, thereby affecting the page rendering effect and the readability of the target page. Summary of the Invention

[0004] Embodiments of the present disclosure at least provide a page grid adjustment method, apparatus, computer device, and storage medium.

[0005] In a first aspect, embodiments of the present disclosure provide a page grid adjustment method, including:

[0006] Obtain the page content to be rendered, and perform rendering and display of the corresponding page content in each preset page grid corresponding to the target page;

[0007] In response to the start trigger operation of the grid adaptive adjustment function, determine the first preset page grid corresponding to the target page content that is not fully displayed based on the displayed page content located in each preset page grid;

[0008] Perform adaptive adjustment on the first preset page grid based on the target page content, and perform complete rendering and display of the target page content according to the adjusted first preset page grid.

[0009] In a possible implementation manner, the performing adaptive adjustment on the first preset page grid based on the target page content includes:

[0010] Determine the adjusted grid size information corresponding to the first preset page grid based on the target page content;

[0011] Adjust the size of the first preset page grid based on the adjusted grid size information corresponding to the first preset page grid, and adjust the positions of other preset page grids that have a position association with the first preset page grid.

[0012] In a possible implementation, after completely rendering and displaying the target page content according to the adjusted first preset page grid, the following steps are further included:

[0013] In response to a position adjustment operation on the second preset page grid in the adjusted target page, based on the target position where the second preset page grid is located after moving, adjust the positions of other preset page grids that have a position association with the second preset page grid.

[0014] In a possible implementation, the step of "in response to a position adjustment operation on the second preset page grid in the adjusted target page, based on the target position where the second preset page grid is located after moving, adjust the positions of other preset page grids that have a position association with the second preset page grid" includes:

[0015] In response to a position adjustment operation on the second preset page grid in the adjusted target page, adjust the grid height of each preset page grid in the adjusted target page to a preset height;

[0016] Determine whether there is at least one third preset page grid adjusted to the preset height at the target position where the second preset page grid is located after moving. If so, move at least one third preset page grid out of the target position, and use the position where the third preset page grid is located after moving as the new target position;

[0017] Return to the step of determining whether there is at least one third preset page grid adjusted to the preset height at the target position until there is no third preset page grid at the target position;

[0018] Restore the grid height of each preset page grid from the preset height to the height before adjustment.

[0019] In a possible implementation, the page content to be rendered includes a plurality of pre-divided target page contents and a grid identifier corresponding to each target page content;

[0020] The step of rendering and displaying the corresponding page content in each preset page grid corresponding to the target page includes:

[0021] Render and display each target page content in the preset page grid indicated by the grid identifier corresponding to the target page content.

[0022] In a possible implementation, the method further includes the step of constructing the preset page grid corresponding to the target page:

[0023] Determine the page architecture corresponding to the target page, and based on the page architecture, determine the number of grid rows corresponding to the target page in the page width direction and the number of grid columns corresponding to the target page in the page length direction;

[0024] For each row of grids corresponding to the target page, determine the number of grids and the grid positions corresponding to that row of grids;

[0025] Based on the number of grids and the grid positions corresponding to each row of grids, create the corresponding preset page grids in the target page.

[0026] In a possible implementation manner, the triggering operation in response to the start of the grid adaptive adjustment function includes:

[0027] In response to a triggering operation on the adaptive adjustment function button displayed on the target page, or,

[0028] In response to a content scaling operation on any displayed page content displayed on the target page.

[0029] In a second aspect, an embodiment of the present disclosure further provides a page grid adjustment device, including:

[0030] An acquisition module, configured to acquire the page content to be rendered, and perform rendering and display of the corresponding page content in each preset page grid corresponding to the target page;

[0031] A determination module, configured to, in response to a triggering operation for starting the grid adaptive adjustment function, determine a first preset page grid corresponding to the target page content that is not fully displayed based on the displayed page content located in each preset page grid;

[0032] A first adjustment module, configured to perform adaptive adjustment on the first preset page grid based on the target page content, and perform complete rendering and display of the target page content according to the adjusted first preset page grid.

[0033] In a possible implementation manner, the first adjustment module is configured to determine the adjusted grid size information corresponding to the first preset page grid based on the target page content;

[0034] Based on the adjusted grid size information corresponding to the first preset page grid, adjust the size of the first preset page grid, and adjust the positions of other preset page grids that have a positional association with the first preset page grid.

[0035] In a possible implementation manner, the device further includes:

[0036] The second adjustment module is configured to, after completely rendering and displaying the target page content according to the adjusted first preset page grid, in response to a position adjustment operation on the second preset page grid in the adjusted target page, based on the target position where the second preset page grid is located after moving, adjust the positions of other preset page grids that have a position association with the second preset page grid.

[0037] In a possible implementation manner, the second adjustment module is configured to, in response to a position adjustment operation on the second preset page grid in the adjusted target page, adjust the grid height of each preset page grid in the adjusted target page to a preset height;

[0038] Determine whether there is at least one third preset page grid adjusted to the preset height at the target position where the second preset page grid is located after moving. If so, move at least one third preset page grid out of the target position, and use the position where the third preset page grid is located after moving as the new target position;

[0039] Return to the step of determining whether there is at least one third preset page grid adjusted to the preset height at the target position until there is no third preset page grid at the target position;

[0040] Restore the grid height of each preset page grid from the preset height to the height before adjustment.

[0041] In a possible implementation manner, the page content to be rendered includes a plurality of pre-divided target page contents and a grid identifier corresponding to each target page content;

[0042] The obtaining module is configured to render and display each target page content in the preset page grid indicated by the grid identifier corresponding to the target page content.

[0043] In a possible implementation manner, the device further includes:

[0044] The construction module is configured to construct the preset page grid corresponding to the target page according to the following steps:

[0045] Determine the page architecture corresponding to the target page, and based on the page architecture, determine the number of grid rows corresponding to the target page in the page width direction and the number of grid columns corresponding to the target page in the page length direction;

[0046] For each row of grids corresponding to the target page, determine the number of grids and the grid positions corresponding to that row of grids;

[0047] Create the corresponding preset page grid in the target page based on the number of grids and the grid positions corresponding to each row of grids.

[0048] In a possible implementation manner, the determining module is configured to respond to a trigger operation on the adaptive adjustment function button displayed on the target page, or

[0049] respond to a content scaling operation on any displayed page content displayed on the target page.

[0050] In a third aspect, an alternative implementation of the present disclosure further provides a computer device, including a processor and a memory. The memory stores machine-readable instructions executable by the processor. The processor is configured to execute the machine-readable instructions stored in the memory. When the machine-readable instructions are executed by the processor, the machine-readable instructions are executed to perform the steps in the first aspect or any possible implementation manner in the first aspect.

[0051] In a fourth aspect, an alternative implementation of the present disclosure further provides a computer-readable storage medium, on which a computer program is stored. When the computer program is run, it executes the steps in the first aspect or any possible implementation manner in the first aspect.

[0052] For the effect description of the above page grid adjustment device, computer device, and computer-readable storage medium, refer to the description of the above page grid adjustment method, which will not be elaborated here.

[0053] The page grid adjustment method, device, computer device, and storage medium provided by the embodiments of the present disclosure are based on the provided grid adaptive adjustment function and the target page content corresponding to the first preset page grid, and can achieve adaptive adjustment of the grid size of the first preset page grid when the target page content corresponding to the first preset page grid is not completely rendered and displayed, that is, when part of the target page content is blocked, so that the adjusted grid size of the first preset page grid can match the target page content; and then through the rendering and display of the target page content, it can be realized that the target page content is completely displayed in the first preset page grid, greatly improving the integrity of the displayed content.

[0054] To make the above objects, features, and advantages of the present disclosure more obvious and understandable, the following specific preferred embodiments are given and described in detail in conjunction with the accompanying drawings. BRIEF DESCRIPTION OF THE DRAWINGS

[0055] To more clearly illustrate the technical solutions of the embodiments of the present disclosure, the accompanying drawings required for the embodiments will be briefly introduced below. The accompanying drawings herein are incorporated into the specification and form a part of this specification. These accompanying drawings show embodiments consistent with the present disclosure and, together with the specification, are used to illustrate the technical solutions of the present disclosure. It should be understood that the following accompanying drawings only show some embodiments of the present disclosure and should not be regarded as limiting the scope. For those of ordinary skill in the art, without creative efforts, other related accompanying drawings can be obtained based on these accompanying drawings.

[0056] Figure 1 FIG. shows a schematic diagram of a rendered target page provided by an embodiment of the present disclosure;

[0057] Figure 2 FIG. shows a flowchart of a page grid adjustment method provided by an embodiment of the present disclosure;

[0058] Figure 3 FIG. shows a schematic diagram of an adaptively adjusted target page provided by an embodiment of the present disclosure;

[0059] Figure 4 FIG. shows a schematic diagram of a grid adaptive adjustment function button provided by an embodiment of the present disclosure;

[0060] Figure 5 FIG. shows a comparison schematic diagram of normalizing the grid height of each preset page grid provided by an embodiment of the present disclosure;

[0061] Figure 6 FIG. shows a schematic diagram of using a structure tree for page layout provided by an embodiment of the present disclosure;

[0062] Figure 7 FIG. shows a schematic diagram of a page grid adjustment device provided by an embodiment of the present disclosure;

[0063] Figure 8 FIG. shows a schematic diagram of the structure of a computer device provided by an embodiment of the present disclosure. Detailed Embodiments

[0064] To make the objectives, technical solutions, and advantages of the embodiments of the present disclosure clearer, the technical solutions in the embodiments of the present disclosure will be clearly and completely described below with reference to the accompanying drawings in the embodiments of the present disclosure. Apparently, the described embodiments are only some, rather than all, of the embodiments of the present disclosure. The components of the embodiments of the present disclosure described and illustrated herein generally can be arranged and designed in various different configurations. Therefore, the following detailed description of the embodiments of the present disclosure is not intended to limit the scope of the claimed present disclosure, but merely represents selected embodiments of the present disclosure. All other embodiments obtained by those skilled in the art based on the embodiments of the present disclosure without creative efforts fall within the scope of protection of the present disclosure.

[0065] In addition, the terms "first", "second", etc. in the description, claims, and the above-mentioned drawings of the embodiments of the present disclosure are used to distinguish similar objects, and are not necessarily used to describe a specific order or sequence. It should be understood that the data used in this way can be interchanged under appropriate circumstances so that the embodiments described herein can be implemented in an order different from that shown or described herein.

[0066] As used herein, "a plurality of" or "several" means two or more. "And / or" describes the association relationship of associated objects and indicates that three relationships can exist. For example, A and / or B can represent three situations: A exists alone, A and B exist simultaneously, and B exists alone. The character " / " generally represents an "or" relationship between the associated objects before and after.

[0067] After research, it is found that in the existing grid layout scheme, although it can be well applied to the construction and layout of the target page of the report form, after the page layout is completed, the number of rows, columns, row height, and column height corresponding to the target page are all limited, that is, the sizes of each preset page grid corresponding to the layout of the target page are all limited and cannot be changed anymore. However, there will also be some dynamic content in the target page of the report form. During the process of rendering the dynamic content in the preset page grid, since the grid size is fixed, it is inevitable that some dynamic content does not match the grid size of the preset page grid, resulting in incomplete rendering and display of this part of the dynamic content in the preset page grid. As Figure 1 shown, it is a schematic diagram of a rendered target page provided by an embodiment of the present disclosure. In Figure 1 it, a target object (the displayed page content hereinafter), that is, a cat, is rendered and displayed in a preset page grid. It can be seen that part of the content of the selected target object A is blocked, that is, it can be determined that the content rendered and displayed in the preset page grid corresponding to the target object A is incomplete. The existence of the problem that the above-mentioned part of the content cannot be completely rendered and displayed in the preset page grid greatly affects the integrity of the displayed content corresponding to the page.

[0068] Based on the above research, the present disclosure provides a page grid adjustment method, apparatus, computer device, and storage medium. Based on the provided grid adaptive adjustment function and the target page content corresponding to the first preset page grid, it is possible to achieve adaptive adjustment of the grid size of the first preset page grid when the target page content corresponding to the first preset page grid is not completely rendered and displayed, that is, when part of the target page content is blocked, so that the adjusted grid size of the first preset page grid can match the target page content; and then through the rendering and display of the target page content, it is possible to completely display the target page content in the first preset page grid, greatly improving the integrity of the displayed content.

[0069] All the defects existing in the above solutions are the results obtained by the inventors through practice and careful research. Therefore, the process of discovering the above problems and the solutions proposed by the present disclosure for the above problems in the following text should be the contributions made by the inventors to the present disclosure during the process of the present disclosure.

[0070] It should be noted that similar reference numerals and letters represent similar items in the following drawings. Therefore, once an item is defined in one drawing, it does not need to be further defined and explained in subsequent drawings.

[0071] To facilitate the understanding of this embodiment, first, a page grid adjustment method disclosed in the embodiments of the present disclosure will be introduced in detail. The execution subject of the page grid adjustment method provided in the embodiments of the present disclosure is generally a computer device with certain computing capabilities. In some possible implementation manners, the page grid adjustment method can be implemented by a processor calling computer-readable instructions stored in a memory.

[0072] Hereinafter, the page grid adjustment method provided in the embodiments of the present disclosure will be described by taking the execution subject as a computer device as an example.

[0073] As Figure 2 shown, the flowchart of a page grid adjustment method provided in the embodiments of the present disclosure may include the following steps:

[0074] S201: Obtain the page content to be rendered, and perform the rendering and display of the corresponding page content in each preset page grid corresponding to the target page.

[0075] Here, the page content to be rendered is the content that needs to be rendered and displayed on the target page, and may include, for example, static images, dynamic images, text, tables, videos, etc. to be rendered.

[0076] The target page is a pre-designed page, which can correspond to multiple invisible pre-set page grids. Different pre-set page grids correspond to different page areas in the target page and can be used to display different page contents.

[0077] In specific implementation, the page content to be rendered can be obtained through a communication network. Then, the target page content corresponding to each pre-set page grid in the page content is determined. Furthermore, the target page content corresponding to each determined pre-set page grid can be rendered in the pre-set page grid and, after the rendering is completed, displayed in the pre-set page grid, thereby realizing the rendering and display of the page content to be rendered in each pre-set page grid corresponding to the target page.

[0078] Here, since the target page content corresponding to each pre-set page grid may be dynamic content and the grid sizes of the pre-set page grids are fixed during the rendering process, after the target page content is rendered in each pre-set page grid, the actually rendered and displayed content in each pre-set page grid may be different from the target page content corresponding to the pre-set page grid. For example, there may be a situation where the page content actually displayed in a pre-set page grid is partially blocked, such as the target object A in the above Figure 1 above.

[0079] S202: In response to the start trigger operation of the grid adaptive adjustment function, based on the displayed page content located in each pre-set page grid, determine the first pre-set page grid corresponding to the target page content that is not fully displayed.

[0080] Here, the grid adaptive adjustment function is a function provided in advance for adaptively adjusting the grid size of the pre-set page grid with page content rendered and displayed.

[0081] The start trigger operation can be an operation initiated by the user to determine the size adjustment of the pre-set page grid corresponding to the target page. For example, the start trigger operation can be an operation of inputting a pre-set code, an operation of clicking a target button, etc.

[0082] The displayed page content is the actually displayed page content in the pre-set page grid, and the target page content is the page content that needs to be rendered and displayed in the pre-set page grid determined according to the page content to be rendered. The target page content not being fully displayed means that the actually rendered and displayed displayed page content in the pre-set page grid is different from the target page content. Specifically, it can be a situation where the displayed page content is less than the target page content.

[0083] The first pre-set page grid is the pre-set page grid selected from the page grids corresponding to the target page, where the displayed page content is different from the target page content. As Figure 1The preset page grid corresponding to the target object A in it is the first preset page grid.

[0084] In specific implementation, after rendering and displaying the corresponding page content of the page content to be selected for rendering in each preset page grid, if there is a situation where the target page content corresponding to the first preset page grid is not completely rendered and displayed, that is, there is a situation where the rendered page content in the first preset grid is blocked, it can be explained that the grid size of the first preset grid does not match the target page content. Furthermore, the user can perform a startup trigger operation for the grid adaptive adjustment function. Then, in response to this startup trigger operation, based on the displayed page content located in each preset page grid and the determined target page content corresponding to each preset page grid, determine the preset page grid where the displayed page content is different from the target page content, and use this preset page grid as the first preset page grid. And, the first preset grid determined here can include multiple.

[0085] In another implementation manner, the startup trigger operation can also be an automatically triggered operation. As long as it is determined that the rendering and display of the page content to be rendered are completed, the grid adaptive adjustment function is automatically triggered. After that, based on the target page content and the displayed page content corresponding to each preset page grid, determine whether there is a first preset grid page. If so, determine each first preset grid page; if not, it can be directly determined that the displayed page content and the target page content corresponding to each preset page grid are the same.

[0086] Or, in another implementation manner, after it is determined that the rendering and display of the page content to be rendered are completed, it can be automatically determined based on the target page content and the displayed page content corresponding to each preset page grid whether there is a first preset grid page. And when it is determined that there is one, the grid adaptive adjustment function is automatically triggered, and then the following S203 is used to perform adaptive adjustment on each determined first preset grid.

[0087] Or, in one implementation manner, when the startup trigger operation is an operation initiated by the user, the user can also specify the first preset page grid. In this way, while responding to the startup trigger operation, the first preset page grid can also be directly obtained, omitting the step of determining the first preset page grid based on the displayed page content and the target page content corresponding to each preset page grid, which is beneficial to improving the efficiency of adaptive adjustment.

[0088] S203: Perform adaptive adjustment on the first preset page grid based on the target page content, and perform complete rendering and display of the target page content according to the adjusted first preset page grid.

[0089] In specific implementation, for the determined first preset page grid, the grid size required to display the target page content can be determined according to the target page content corresponding to the first preset page grid, and then the grid size of the first preset page grid can be adjusted to the grid size required to display the target page content. Here, when adjusting the grid size, it can also be determined whether to adjust the first preset page grid in the width direction, in the height direction, or both, and the first preset grid can be adjusted according to the adjustment direction. For example, the grid height of the first preset page grid is increased by 2 cm downward in the vertical direction.

[0090] After that, the target page content can be fully rendered and displayed according to the adjusted first preset page grid. As Figure 3 shown, it is a schematic diagram of an adaptively adjusted target page provided by an embodiment of the present disclosure. Among them, Figure 3 is obtained by adaptively adjusting the rendered target page shown in Figure 1 . In Figure 3 , the selected target object A has been fully displayed without occlusion, and the grid height of the first preset page grid corresponding to the target object A has been adaptively adjusted to be higher than the grid height of the first preset page grid corresponding to the target object A in Figure 1 .

[0091] Specifically, regarding the step of fully rendering and displaying the target page content according to the adjusted first preset page grid, the adjusted first preset page grid can still display the display page content corresponding to the first preset page grid before adjustment. When fully rendering the target page content, the page content that was not displayed corresponding to the first preset page grid before adjustment can be determined based on the display page content corresponding to the first preset page grid before adjustment and the target page content, and the page content that was not displayed can be rendered in the adjusted first preset page grid and displayed according to the adjusted first preset page grid. Subsequently, based on the determined page content that was not displayed and rendered and the display page content displayed by the adjusted first preset page grid, the complete above-mentioned target page content can be displayed, thereby achieving the full rendering and display of the target page content.

[0092] Alternatively, after obtaining the adjusted first preset page grid, the target page content corresponding to the adjusted first preset page grid can also be re-rendered and displayed.

[0093] In one embodiment, after determining the first preset page grid, a new preset page grid that matches the grid size can be generated based on the grid size required to display the target page corresponding to the first preset page grid. The new preset page grid is used to replace the first preset page grid, and after the replacement is completed, the target page content is fully rendered and displayed in the new preset page grid.

[0094] In this way, based on the provided grid adaptive adjustment function and the target page content corresponding to the first preset page grid, it is possible to adaptively adjust the grid size of the first preset page grid when the target page content corresponding to the first preset page grid is not fully rendered and displayed, that is, when part of the target page content is blocked, so that the adjusted grid size of the first preset page grid can match the target page content. Then, by rendering and displaying the target page content, it is possible to fully display the target page content in the first preset page grid, greatly improving the integrity of the displayed content.

[0095] In one example, for the step of responding to the start trigger operation of the grid adaptive adjustment function in S202, an adaptive adjustment function button can be displayed at a preset position corresponding to the target page, as Figure 4 shown, which is a schematic diagram of an adaptive adjustment function button provided by an embodiment of the present disclosure. When the user determines that adaptive adjustment is required, the user can click the adaptive adjustment function button. After that, in response to the trigger operation of clicking the adaptive adjustment function button, it is determined to start the grid adaptive adjustment function.

[0096] Alternatively, it is also possible to determine that the user has performed the start trigger operation in response to the content scaling operation of any displayed page content on the target page by the user. Specifically, the content scaling operation can be an operation of enlarging or reducing a selected displayed page content by the user; or it can also be a size adjustment operation on the page area corresponding to the selected displayed page content by the user. Regarding the content scaling operation or size adjustment operation performed by the user, no response will be made to this operation, but when it is determined that this operation exists, it is determined that the user has performed the start trigger operation, and in response to the start trigger operation, the grid adaptive adjustment function is started.

[0097] In one embodiment, for the step of adaptively adjusting the first preset page grid in S203, the adjusted grid size information corresponding to the first preset page grid can be determined based on the target page content first. Here, the adjusted grid size information may include the grid size required to display the target page content, the size information to be adjusted in each direction, and the adjustment rules in each direction. Specifically, the adjustment rule may be, for example, increasing the size starting from the rightmost side of the grid in the width direction; increasing the size starting from the bottommost side of the grid in the height direction, etc.

[0098] Then, according to the determined adjusted grid size information, the grid size of the first preset page grid can be adjusted to the grid size required to display the target page content, so as to achieve the adaptive adjustment of the grid size of the first preset page grid. For example, the grid height of the first preset page grid is adjusted from 90px to 110px.

[0099] Moreover, after the adaptive adjustment of the first preset grid size, the positions of other preset page grids that have a positional association with the first preset page grid can also be adjusted.

[0100] Here, other preset page grids that have a positional association with the first preset page grid can be each preset page grid whose grid position is affected by the grid position of the first preset page grid after adaptive adjustment. Specifically, other preset page grids with a positional association may include:

[0101] The fourth preset page grid whose grid position overlaps with the grid position of the first preset page grid after adaptive adjustment, and, after the adaptive adjustment of the fourth preset page grid based on the grid position of the first preset page grid after adaptive adjustment, a new fourth preset page grid that overlaps with the fourth preset page grid, and so on, until there is no new fourth preset page grid after the adaptive adjustment of the grid position of the latest determined fourth preset page grid. All the fourth preset page grids determined in the above process are regarded as other preset page grids that have a positional association with the first preset page grid.

[0102] In the case where the grid position of the first preset page grid after adaptive adjustment overlaps with the fourth preset page grid in the same column and the next row with a target distance, the grid position order of the fourth preset page grid is translated downward by the target distance. And when it is determined that after the downward translation of the fourth preset page grid, there is an overlap with a new fourth preset page grid with a target distance (which can also be a new target distance), the grid position order of the new fourth preset page grid is translated downward by the target distance, and so on, until it is determined that the adjustment of the grid positions of each other preset page grid that has a positional association with the first preset page grid is completed.

[0103] In one embodiment, after the target page content is completely rendered and displayed according to the adjusted first preset page grid, in response to a position adjustment operation for the second preset page grid in the adjusted target page, based on the target position where the second preset page grid is located after being moved, the positions of other preset page grids that are positionally associated with the second preset page grid are adjusted.

[0104] Here, the adjusted target page is the target page after adaptively adjusting the preset page grid corresponding to the target page in the manner provided in the above embodiments. The second preset page grid can be any preset page grid selected from the preset page grids corresponding to the target page.

[0105] The positions of other preset page grids that are positionally associated with the second preset page grid can be those preset page grids whose grid positions are affected by the grid position of the second preset page grid after being moved.

[0106] In specific implementation, in response to a position adjustment operation for the second preset page grid in the adjusted target page initiated by the user, enter the page interaction editing state. When the user stops moving the second preset page grid, end the page interaction editing state and determine the target position where the second preset page grid is finally moved.

[0107] Then, perform position adaptive adjustment on other preset page grids originally at the target position. For example, other preset page grids at the target position can be moved to the position before the second preset page grid is moved.

[0108] Alternatively, the grid positions of other preset page grids at the target position can also be translated, for example, translated up and down or left and right; and when it is determined that there are new other preset page grids at the position after the translation of the other preset page grid, continue to translate the other preset page grid until it is determined that there are no new preset page grids at the position where the finally determined other preset page grid is moved, and determine that the adjustment of the positions of other preset page grids that are positionally associated with the second preset page grid is completed.

[0109] In one embodiment, for the step of, in response to a position adjustment operation for the second preset page grid in the adjusted target page, based on the target position where the second preset page grid is located after being moved, adjusting the positions of other preset page grids that are positionally associated with the second preset page grid, it can be implemented according to the following steps:

[0110] Step 1. In response to a position adjustment operation for a second preset page grid in the adjusted target page, adjust the grid height of each preset page grid in the adjusted target page to a preset height.

[0111] Here, the preset height can be the height of a virtual reference grid used to guide the user to adjust the grid position of the preset page grid. Specifically, the target page corresponds to multiple rows of virtual reference grids, and the size and quantity of each row of virtual reference grids are the same, and the virtual reference grid is only presented when the grid is moved.

[0112] In specific implementation, in response to a position adjustment operation for a second preset page grid in the adjusted target page, specifically, when the user just starts to move the second preset page grid, the grid height of each preset page grid (including the second preset page grid) corresponding to the adjusted target page can be adjusted to the preset height to implement normalization processing of the grid height. For example, the heights of preset page grids 1, 2, and 3 corresponding to the adjusted target page are 110px, 120px, and 90px respectively. After adjusting the heights of preset page grids 1, 2, and 3 to the preset height, the heights of preset page grids 1, 2, and 3 become 100px, 100px, and 100px respectively.

[0113] As Figure 5 shown, it is a comparison schematic diagram for normalizing and adjusting the grid height of each preset page grid provided by an embodiment of the present disclosure. Among them, a is a schematic diagram corresponding to the adjusted target page, and b is a schematic diagram for adjusting the grid height of each preset page grid corresponding to the adjusted target page to the preset height.

[0114] Here, through the normalization processing of the grid height, it is convenient for the user to adjust the position of each second preset page grid with normalized height according to the virtual reference grid, ensuring smooth dragging. For example, the second preset page grid is adjusted into a virtual reference grid. Furthermore, the second preset page grid can be accurately positioned according to the moved virtual reference grid, so as to determine the accurate moved position corresponding to the second preset page grid.

[0115] Step 2. Determine whether there is at least one third preset page grid adjusted to the preset height at the target position where the second preset page grid is located after moving. If so, move at least one third preset page grid out of the target position, and use the position where the third preset page grid is located after moving as the new target position.

[0116] Here, the third preset page grid is a preset page grid that has been located at the target position and adjusted to the preset height before moving the second preset page grid.

[0117] In specific implementation, after moving the second preset page grid to the target position, it is necessary to determine whether there is at least one third preset page grid at the target position. If not, it can be determined that there is no other preset page grid that has a position association with the second preset page grid. If so, the grid positions of each third preset grid can be adaptively adjusted by translation to move it out of the target position.

[0118] Determine the position where each third preset grid is located after moving, and use this position as the new target position.

[0119] Step 3: Return to the step of determining whether there is at least one third preset page grid adjusted to the preset height at the target position until there is no third preset page grid at the target position.

[0120] In specific implementation, after using the above Step 2 to use the position where the third preset grid is located after moving as the new target position, it is possible to re-determine whether there is a new third preset page grid at this new target position. If not, it is determined that the adjustment of the positions of other preset page grids that have a position association with the second preset page grid has been completed.

[0121] If so, continue to adaptively adjust the grid position of this new third preset page grid by translation, use the position where this new third preset page grid is located after moving as the new target position, and then return to the step of determining whether there is a third preset page grid at the target position. After sequential or multiple loops, until it is determined that there is no third preset page grid at the target position, it can be determined that the adjustment of the positions of other preset page grids that have a position association with the second preset page grid has been completed.

[0122] Step 4: Restore the grid height of each preset page grid from the preset height to the height before adjustment.

[0123] In this step, after completing the position adjustment of the second preset page grid in the adjusted target page and the position adjustment of other preset page grids that have a position association with the second preset page grid, the grid height of each preset page grid can be restored from the preset height to the height before adjustment. Here, the height before adjustment is the height after the adaptive height adjustment of each preset page grid corresponding to the target page. That is, the grid height of each preset page grid is restored from the preset height to the height before normalization.

[0124] Continuing with the above example, after adjusting the heights of the preset page grids 1, 2, and 3 corresponding to the adjusted target page from 110px, 120px, and 90px to the preset height of 100px, 100px, and 100px, and completing the adjustment of the grid positions of the preset page grids 1, 2, and 3, the grid heights of the preset page grids 1, 2, and 3 can be restored to 110px, 120px, and 90px respectively.

[0125] In one embodiment, the page content to be rendered includes a plurality of pre-divided target page contents and grid identifiers corresponding to each target page content. For the step of rendering and displaying the corresponding page content in each preset page grid corresponding to the target page, the preset page grid indicated by the grid identifier corresponding to each target page content can be determined, and then each target page content can be rendered and displayed in the preset page grid indicated by the grid identifier corresponding to the target page content.

[0126] In one embodiment, the page grid adjustment method provided by the embodiments of the present disclosure further provides steps for constructing a page grid corresponding to the target page:

[0127] ①: Determine the page architecture corresponding to the target page, and based on the page architecture, determine the number of grid rows corresponding to the target page in the page width direction and the number of grid columns corresponding to the target page in the page length direction.

[0128] Here, the page architecture is used to characterize the page structure corresponding to the target page. For example, the page structure can reflect each page area divided by the target page and the position of each page area on the target page.

[0129] Specifically, in implementation, the number of grid rows that need to be set for the target page in the page width direction and the number of grid columns that need to be set for the target page in the page length direction can be determined based on the page architecture; that is, the maximum number of page areas that need to be divided for the target page in the page width direction and the maximum number of page areas that need to be divided for the target page in the page length direction are determined. Among them, one page area can correspond to one preset page grid.

[0130] ②: For each row of grids corresponding to the target page, determine the number of grids and the grid positions corresponding to that row of grids.

[0131] Specifically, in implementation, the number of grids and the grid positions corresponding to each row of grids can be determined according to the page architecture.

[0132] ③: Based on the number of grids and the grid positions corresponding to each row of grids, create the corresponding preset page grids in the target page.

[0133] In specific implementation, the corresponding preset page grid in the target page can be created according to the number of grids corresponding to each row of the grid and the determined grid positions of each corresponding grid. Here, when creating the preset page grid, before executing ③, the preset grid size of each preset page grid can be determined according to the size of each page area, and then based on ③, each preset page grid can be determined according to the determined preset grid size.

[0134] Alternatively, the preset grid size of each preset page grid can also be set to a default value. When rendering the page content subsequently, the grid size of the preset page grid can be adaptively adjusted directly using the adaptive adjustment function.

[0135] In addition, when laying out the target page that needs to render dynamic content, due to the problems existing in the prior art, the grid technology cannot be directly used for layout. It is necessary to use multiple different page containers in the form of a structure tree for complex node nesting to complete the layout of the target page. Based on the grid adaptive adjustment function provided by the embodiments of the present disclosure, the use of complex node nesting for page layout can be directly avoided. Only the required page containers of the page need to be simply deployed under the same node of the structure tree according to the positions of the respective page containers corresponding in the target page to achieve the layout of the target page. As Figure 6 shown, it is a schematic diagram of using a structure tree for page layout provided by the embodiments of the present disclosure. Among them, Figure 6 c in shows the structure tree corresponding to the implementation of the page layout of the target page without providing the grid adaptive adjustment function, including nested multi-level nodes. The nesting relationship is shown in regions 1, 2, and 3 in c. Figure 6 d in shows the structure tree corresponding to the implementation of the page layout of the target page when the grid adaptive adjustment function is provided. As shown in region 4 in d, when implementing the page layout of the target page, only the required page containers need to be deployed under one content node, without complex node nesting.

[0136] Those skilled in the art can understand that in the above method of the specific implementation manner, the writing order of each step does not mean a strict execution order and does not constitute any limitation on the implementation process. The specific execution order of each step should be determined according to its function and possible internal logic.

[0137] Based on the same inventive concept, the embodiments of the present disclosure also provide a page grid adjustment device corresponding to the page grid adjustment method. Since the principle of solving problems by the device in the embodiments of the present disclosure is similar to the above page grid adjustment method of the embodiments of the present disclosure, the implementation of the device can refer to the implementation of the method, and the repeated parts will not be described again.

[0138] As Figure 7As shown in the figure, it is a schematic diagram of a page grid adjustment device provided by an embodiment of the present disclosure, including:

[0139] An acquisition module 701, configured to acquire page content to be rendered, and perform rendering and display of the corresponding page content in each preset page grid corresponding to the target page;

[0140] A determination module 702, configured to, in response to a start trigger operation of the grid adaptive adjustment function, determine a first preset page grid corresponding to the target page content that is not fully displayed based on the displayed page content located in each preset page grid;

[0141] A first adjustment module 703, configured to perform adaptive adjustment on the first preset page grid based on the target page content, and perform complete rendering and display of the target page content according to the adjusted first preset page grid.

[0142] In a possible implementation manner, the first adjustment module 703 is configured to determine adjusted grid size information corresponding to the first preset page grid based on the target page content;

[0143] Based on the adjusted grid size information corresponding to the first preset page grid, adjust the size of the first preset page grid, and adjust the positions of other preset page grids that are positionally associated with the first preset page grid.

[0144] In a possible implementation manner, the device further includes:

[0145] A second adjustment module 704, configured to, after performing complete rendering and display of the target page content according to the adjusted first preset page grid, in response to a position adjustment operation for a second preset page grid in the adjusted target page, based on the target position where the second preset page grid is located after moving, adjust the positions of other preset page grids that are positionally associated with the second preset page grid.

[0146] In a possible implementation manner, the second adjustment module 704 is configured to, in response to a position adjustment operation for a second preset page grid in the adjusted target page, adjust the grid height of each preset page grid in the adjusted target page to a preset height;

[0147] Judge whether there is at least one third preset page grid adjusted to the preset height at the target position where the second preset page grid is located after moving. If so, move at least one third preset page grid out of the target position, and use the position where the third preset page grid is located after moving as the new target position;

[0148] Steps of returning and determining whether there is at least one third preset page grid adjusted to the preset height at the target position are performed until there is no third preset page grid at the target position;

[0149] Restore the grid height of each of the preset page grids from the preset height to the height before adjustment.

[0150] In a possible implementation manner, the page content to be rendered includes a plurality of pre-divided target page contents and a grid identifier corresponding to each target page content;

[0151] The obtaining module 701 is configured to render and display each target page content in the preset page grid indicated by the grid identifier corresponding to the target page content.

[0152] In a possible implementation manner, the apparatus further includes:

[0153] The construction module 705 is configured to construct the preset page grid corresponding to the target page according to the following steps:

[0154] Determine the page architecture corresponding to the target page, and based on the page architecture, determine the number of grid rows corresponding to the target page in the page width direction and the number of grid columns corresponding to the target page in the page length direction;

[0155] For each row of grids corresponding to the target page, determine the number of grids and the grid positions corresponding to the row of grids;

[0156] Based on the number of grids and the grid positions corresponding to each row of grids, create the corresponding preset page grid in the target page.

[0157] In a possible implementation manner, the determining module 702 is configured to respond to a trigger operation on the adaptive adjustment function button displayed on the target page, or,

[0158] Respond to a content scaling operation on any displayed page content on the target page.

[0159] Descriptions of the processing flows of the various modules in the apparatus and the interaction flows between the various modules may refer to the relevant descriptions in the above method embodiments and will not be elaborated here.

[0160] This disclosure embodiment also provides a computer device, as Figure 8 shown, which is a schematic structural diagram of a computer device provided by this disclosure embodiment, including:

[0161] A processor 81 and a memory 82; the memory 82 stores machine-readable instructions executable by the processor 81. The processor 81 is configured to execute the machine-readable instructions stored in the memory 82. When the machine-readable instructions are executed by the processor 81, the processor 81 performs the following steps: S201: Obtain the page content to be rendered, and perform rendering and display of the corresponding page content in each preset page grid corresponding to the target page; S202: In response to a start trigger operation of the grid adaptive adjustment function, based on the displayed page content located in each preset page grid, determine a first preset page grid corresponding to the target page content that is not fully displayed, and S203: Perform adaptive adjustment on the first preset page grid based on the target page content, and perform complete rendering and display of the target page content according to the adjusted first preset page grid.

[0162] The above-mentioned memory 82 includes a memory 821 and an external memory 822; here, the memory 821 is also called an internal memory, which is used to temporarily store the operation data in the processor 81 and the data exchanged with the external memory 822 such as a hard disk. The processor 81 exchanges data with the external memory 822 through the memory 821.

[0163] For the specific execution process of the above instructions, reference can be made to the steps of the page grid adjustment method described in the embodiments of the present disclosure, which will not be elaborated here.

[0164] The embodiments of the present disclosure further provide a computer-readable storage medium, on which a computer program is stored. When the computer program is run by a processor, it executes the steps of the page grid adjustment method described in the above method embodiments. Among them, the storage medium may be a volatile or non-volatile computer-readable storage medium.

[0165] The computer program product of the page grid adjustment method provided by the embodiments of the present disclosure includes a computer-readable storage medium storing program code. The instructions included in the program code can be used to execute the steps of the page grid adjustment method described in the above method embodiments. For details, reference can be made to the above method embodiments, which will not be elaborated here.

[0166] The computer program product can be specifically implemented in a manner of hardware, software, or a combination thereof. In an alternative embodiment, the computer program product is specifically embodied as a computer storage medium. In another alternative embodiment, the computer program product is specifically embodied as a software product, such as a Software Development Kit (SDK), etc.

[0167] Those skilled in the art can clearly understand that for the convenience and brevity of description, the specific working processes of the devices described above can refer to the corresponding processes in the foregoing method embodiments, and will not be elaborated herein. In several embodiments provided by the present disclosure, it should be understood that the disclosed devices and methods can be implemented in other ways. The device embodiments described above are merely illustrative. For example, the division of the units is only a logical functional division, and there can be other division methods in actual implementation. For another example, multiple units or components can be combined, or some features can be ignored, or not executed. Another point is that the displayed or discussed couplings or direct couplings or communication connections to each other can be through some communication interfaces, and the indirect couplings or communication connections of the devices or units can be in electrical, mechanical or other forms.

[0168] The units described as separate components may or may not be physically separated, and the components displayed as units may or may not be physical units, that is, they can be located in one place, or distributed to multiple network units. Some or all of the units can be selected according to actual needs to achieve the purpose of the solution of this embodiment.

[0169] In addition, in each embodiment of the present disclosure, the functional units can be integrated into one processing unit, or each unit can exist physically alone, or two or more units can be integrated into one unit.

[0170] If the functions are implemented in the form of software function units and sold or used as independent products, they can be stored in a non-volatile computer-readable storage medium executable by a processor. Based on such an understanding, the technical solution of the present disclosure, in essence, or the part that contributes to the prior art, or a part of this 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, a server, or a network device, etc.) to execute all or part of the steps of the methods described in each embodiment of the present disclosure. The foregoing storage medium includes: various media such as USB flash drives, mobile hard disks, read-only memories (ROMs), random access memories (RAMs), magnetic disks, or optical discs that can store program codes.

[0171] Finally, it should be noted that the above-described embodiments are only specific embodiments of the present disclosure, which are used to illustrate the technical solutions of the present disclosure, rather than limiting them. The protection scope of the present disclosure is not limited thereto. Although the present disclosure has been described in detail with reference to the foregoing embodiments, those of ordinary skill in the art should understand that any person skilled in the art within the technical scope disclosed by the present disclosure can still modify the technical solutions described in the foregoing embodiments, or can easily think of changes, or perform equivalent replacements for some of the technical features; and these modifications, changes or replacements do not make the essence of the corresponding technical solutions deviate from the spirit and scope of the technical solutions of the embodiments of the present disclosure, and should all be covered by the protection scope of the present disclosure. Therefore, the protection scope of the present disclosure should be subject to the protection scope of the claims.

Claims

1. A method for adjusting a page grid, characterized in that, it includes: Obtain the page content to be rendered, and perform the rendering and display of the corresponding page content in each preset page grid corresponding to the target page; In response to the start trigger operation of the grid adaptive adjustment function, based on the displayed page content located in each preset page grid, determine the first preset page grid corresponding to the target page content that is not fully displayed; Based on the target page content, perform adaptive adjustment on the first preset page grid, and perform complete rendering and display of the target page content according to the adjusted first preset page grid; and In response to the position adjustment operation of the second preset page grid in the adjusted target page obtained by the adaptive adjustment, based on the target position where the second preset page grid is located after moving, adjust the positions of other preset page grids that have a position association with the second preset page grid; wherein, adjusting the positions of other preset page grids that have a position association with the second preset page grid includes: In response to the position adjustment operation, adjust the grid height of each preset page grid in the adjusted target page to a preset height; Judge whether there is at least one third preset page grid adjusted to the preset height at the target position. If so, move at least one third preset page grid out of the target position, and use the position where the third preset page grid is located after moving as the new target position; Return to the step of judging whether there is at least one third preset page grid adjusted to the preset height at the target position until there is no third preset page grid at the target position; Restore the grid height of each of the preset page grids from the preset height to the height before adjustment.

2. The method according to claim 1, characterized in that, The performing adaptive adjustment on the first preset page grid based on the target page content includes: Based on the target page content, determine the adjusted grid size information corresponding to the first preset page grid; Based on the adjusted grid size information corresponding to the first preset page grid, adjust the size of the first preset page grid, and adjust the positions of other preset page grids that have a position association with the first preset page grid.

3. The method according to claim 1, characterized in that, The page content to be rendered includes a plurality of pre-divided target page contents and grid identifiers corresponding to each of the target page contents; The performing the rendering and display of the corresponding page content in each preset page grid corresponding to the target page includes: Render and display each of the target page contents in the preset page grid indicated by the grid identifier corresponding to the target page content.

4. The method according to claim 1, characterized in that, The method further includes the step of constructing the preset page grid corresponding to the target page: Determine the page architecture corresponding to the target page, and based on the page architecture, determine the number of grid rows corresponding to the target page in the page width direction and the number of grid columns corresponding to the target page in the page length direction; For each row of grids corresponding to the target page, determine the number of grids and the grid positions corresponding to that row of grids; Based on the number of grids and the grid positions corresponding to each row of grids, create the corresponding preset page grids in the target page.

5. The method according to claim 1, wherein, the activation trigger operation in response to the grid adaptive adjustment function includes: responding to a trigger operation on the adaptive adjustment function button displayed on the target page, or, responding to a content scaling operation on any displayed page content displayed on the target page.

6. A page grid adjustment device, wherein, comprises: an acquisition module, configured to acquire page content to be rendered, and perform rendering and display of the corresponding page content in each preset page grid corresponding to the target page; a determination module, configured to, in response to an activation trigger operation of the grid adaptive adjustment function, determine a first preset page grid corresponding to the target page content that is not fully displayed based on the displayed page content located in each preset page grid; a first adjustment module, configured to perform adaptive adjustment on the first preset page grid based on the target page content, and perform complete rendering and display of the target page content according to the adjusted first preset page grid; and a second adjustment module, configured to, in response to a position adjustment operation on a second preset page grid in the adjusted target page obtained by the adaptive adjustment, adjust the positions of other preset page grids that have a position association with the second preset page grid based on the target position where the second preset page grid is located after moving; wherein, the second adjustment module is specifically configured to: in response to the position adjustment operation, adjust the grid height of each preset page grid in the adjusted target page to a preset height; judge whether there is at least one third preset page grid adjusted to the preset height at the target position, if so, move at least one third preset page grid out of the target position, and use the position where the third preset page grid is located after moving as the new target position; return to the step of judging whether there is at least one third preset page grid adjusted to the preset height at the target position until there is no third preset page grid at the target position; restore the grid height of each of the preset page grids from the preset height to the height before adjustment.

7. A computer device, wherein, comprises: a processor and a memory, the memory stores machine-readable instructions executable by the processor, the processor is configured to execute the machine-readable instructions stored in the memory, and when the machine-readable instructions are executed by the processor, the processor executes the steps of the page grid adjustment method according to any one of claims 1 to 5.

8. A computer-readable storage medium, wherein, A computer program is stored on the computer-readable storage medium. When the computer program is run by a computer device, the computer device executes the steps of the page grid adjustment method according to any one of claims 1 to 5.

Images