Adapting Method, Device, Computer Equipment and Storage Medium for Screen-End Waterfall Flow

Abstract

An embodiment of the present invention discloses an adaptation method, device, computer device and storage medium for a screen-side waterfall flow. The method includes: receiving a request for configuring a waterfall flow by a preset UI component on a terminal screen; obtaining a default margin of the UI component on the terminal screen; if an actual margin of the UI component on the terminal screen is equal to the default margin, configuring the waterfall flow according to the UI component on the terminal screen; if the actual margin is not equal to the default margin, adjusting parameters of the UI component according to a virtual screen width required by the waterfall flow to obtain an adjusted UI component; and configuring the waterfall flow on the terminal screen according to the adjusted UI component. The present invention is based on research and development process optimization technology, solves the problem that the waterfall flow cannot be adapted to screen terminals with different resolutions, indirectly improves the efficiency of subsequent maintenance of the waterfall flow, and reduces the cost of waterfall flow maintenance.

Description

Technical Field

[0001] The present invention belongs to the technical field of UI design, and particularly relates to a method, device, computer device and storage medium for adapting a waterfall flow on a screen end. Background Art

[0002] The waterfall flow, also known as the waterfall layout, is a relatively popular way of laying out web pages. It is commonly found in some websites mainly composed of pictures. Its visual manifestation is a multi-column layout with uneven heights. As the page scrolls down, the waterfall layout continuously loads data blocks and attaches them to the current tail. With the rapid development of Internet technology, the waterfall flow has been widely used in terminal devices with screen ends.

[0003] In the prior art, since the screen display of terminal devices can be configured with different resolutions, when configuring the waterfall flow for screen ends with different resolutions, the pre-formulated waterfall flow cannot be adapted to screen ends with different resolutions. It is necessary to pre-formulate a waterfall flow adapted to each resolution of the screen end, which increases the cost of configuring the waterfall flow. At the same time, when maintaining the same type of waterfall flow, it is necessary to maintain the waterfall flow adapted to each resolution of the screen end, resulting in cumbersome maintenance and low efficiency of the waterfall flow. Summary of the Invention

[0004] Embodiments of the present invention provide a method, device, computer device and storage medium for adapting a waterfall flow on a screen end, which are used to solve the technical problem that the waterfall flow in the prior art cannot be adapted to screen ends with different resolutions.

[0005] In a first aspect, embodiments of the present invention provide a method for adapting a waterfall flow on a screen end, which includes:

[0006] Receiving a request to configure a waterfall flow for a preset UI component on a terminal screen;

[0007] Obtaining the default margin of the UI component on the terminal screen;

[0008] If the actual margin of the UI component on the terminal screen is equal to the default margin, configuring the waterfall flow according to the UI component on the terminal screen;

[0009] If the actual margin is not equal to the default margin, adjusting the parameters of the UI component according to the virtual screen width required by the waterfall flow to obtain an adjusted UI component;

[0010] Configuring the waterfall flow on the terminal screen according to the adjusted UI component.

[0011] In a second aspect, embodiments of the present invention provide a device for adapting a waterfall flow on a screen end, which includes:

[0012] A receiving unit, configured to receive a request for configuring a waterfall flow on a terminal screen by a preset UI component;

[0013] A first obtaining unit, configured to obtain a default margin of the UI component on the terminal screen;

[0014] A first configuring unit, configured to, if an actual margin of the UI component on the terminal screen is equal to the default margin, configure the waterfall flow on the terminal screen according to the UI component;

[0015] A first adjusting unit, configured to, if the actual margin is not equal to the default margin, adjust parameters of the UI component according to a virtual screen width required by the waterfall flow to obtain an adjusted UI component;

[0016] A second configuring unit, configured to configure the waterfall flow on the terminal screen according to the adjusted UI component.

[0017] In a third aspect, an embodiment of the present invention further provides a computer device, including a memory, a processor, and a computer program stored on the memory and executable on the processor. When the processor executes the computer program, the method for adapting a screen-side waterfall flow as described in the first aspect above is implemented.

[0018] In a fourth aspect, an embodiment of the present invention further provides a computer-readable storage medium. The computer-readable storage medium stores a computer program, and when the computer program is executed by a processor, the processor is caused to execute the method for adapting a screen-side waterfall flow as described in the first aspect above.

[0019] An embodiment of the present invention provides a method, an apparatus, a computer device, and a storage medium for adapting a screen-side waterfall flow. When configuring a waterfall flow for a screen end of a terminal device by using this method of the present invention, a default margin and an actual margin of a UI component on the terminal screen are obtained in advance. If the actual margin is equal to the default margin, the waterfall flow is directly configured on the terminal screen; if not, the parameters of the UI component are adjusted according to the virtual screen width of the terminal screen, and the waterfall flow is configured on the terminal screen by using the adjusted UI component, thereby solving the problem that the waterfall flow cannot be adapted to screen ends with different resolutions. Furthermore, when configuring a waterfall flow for a terminal screen, it is not necessary to pre-formulate waterfall flows for each resolution in a cloud server in advance, indirectly improving the efficiency of subsequent maintenance of the waterfall flow and reducing the cost of subsequent waterfall flow maintenance. Description of the Drawings

[0020] To more clearly illustrate the technical solutions of the embodiments of the present invention, the following will briefly introduce the drawings required for the description of the embodiments. Obviously, the drawings in the following description are some embodiments of the present invention. For those of ordinary skill in the art, without creative efforts, other drawings can also be obtained based on these drawings.

[0021] Figure 1 It is a schematic flowchart of the adaptation method for the screen - end waterfall flow provided by the embodiments of the present invention;

[0022] Figure 2 It is a schematic flowchart of the adaptation method for the screen - end waterfall flow provided by the embodiments of the present invention;

[0023] Figure 3 It is another schematic flowchart of the adaptation method for the screen - end waterfall flow provided by the embodiments of the present invention;

[0024] Figure 4 It is another schematic flowchart of the adaptation method for the screen - end waterfall flow provided by the embodiments of the present invention;

[0025] Figure 5 It is another schematic flowchart of the adaptation method for the screen - end waterfall flow provided by the embodiments of the present invention;

[0026] Figure 6 It is another schematic flowchart of the adaptation method for the screen - end waterfall flow provided by the embodiments of the present invention;

[0027] Figure 7 It is another schematic flowchart of the adaptation method for the screen - end waterfall flow provided by the embodiments of the present invention;

[0028] Figure 8 It is a schematic block diagram of the adaptation device for the screen - end waterfall flow provided by the embodiments of the present invention;

[0029] Figure 9 It is a schematic block diagram of the computer device provided by the embodiments of the present invention. Detailed implementation manners

[0030] The following will clearly and completely describe the technical solutions in the embodiments of the present invention with reference to the drawings in the embodiments of the present invention. Obviously, the described embodiments are some, but not all, of the embodiments of the present invention. All other embodiments obtained by those of ordinary skill in the art based on the embodiments of the present invention without creative efforts fall within the scope of protection of the present invention.

[0031] It should be understood that when used in this specification and the appended claims, the terms "comprising" and "including" indicate the presence of the described features, wholes, steps, operations, elements and / or components, but do not exclude the presence or addition of one or more other features, wholes, steps, operations, elements, components and / or their combinations.

[0032] It should also be understood that the terms used in this specification of the present invention are merely for the purpose of describing specific embodiments and are not intended to limit the present invention. As used in this specification of the present invention and the appended claims, unless the context clearly indicates otherwise, the singular forms "a", "an" and "the" are intended to include the plural forms.

[0033] It should be further understood that the term "and / or" used in this specification of the present invention and the appended claims refers to any combination and all possible combinations of one or more of the associated listed items, and includes these combinations.

[0034] Please refer to Figure 1 , Figure 1 which is a schematic flowchart of the adaptation method for the screen - end waterfall flow provided by the embodiments of the present invention. The adaptation method for the screen - end waterfall flow in the embodiments of the present invention is applied to a cloud server, and this method is executed through an application software installed in the cloud server so that the UI components are configured with a waterfall flow in the terminal device. Among them, the terminal device is a terminal device with Internet access function, such as a desktop computer, a laptop computer, a tablet computer or a mobile phone, etc.

[0035] The following is a detailed description of the adaptation method for the screen - end waterfall flow.

[0036] As Figure 1 shown, this method includes the following steps S110 - S150.

[0037] S110. Receive a request for configuring a waterfall flow of a preset UI component on the terminal screen.

[0038] Specifically, the request is instruction information for the UI component to request to configure a waterfall flow on the terminal screen in the cloud server. After the cloud server receives the instruction information for the UI component to request a waterfall flow configuration for the terminal screen, it can execute a waterfall flow configuration program for the terminal screen in the UI component. Among them, the UI component is a component for generating a user interface and displaying the user interface on the terminal screen. The user interface component contains one or several code segments with their respective functions and completes the representation of the user interface. Implementing a waterfall flow on the terminal screen is usually achieved by using UI controls in the UI component.

[0039] S120. Obtain the default margin of the UI component on the terminal screen.

[0040] Specifically, the default margin is the margin preset by the UI component on the terminal screen of any resolution. While obtaining the default margin of the UI component on the terminal screen, the cloud server also obtains the actual margin of the UI component on the terminal screen from the UI component, and then adjusts the parameters in the UI component by comparing whether the actual margin is equal to the default margin so that the UI component is configured in the terminal screen to be suitable for the waterfall flow of the terminal screen.

[0041] In other embodiments of the invention, as Figure 2 shown, step S120 includes sub-steps S121 and S122.

[0042] S121. Obtain the default size information of the waterfall flow in the terminal screen;

[0043] S122. Obtain the default margin according to the default size information.

[0044] Specifically, the default size information is the size information preset by the UI component for the waterfall flow configuration on the terminal screens of different resolutions. The default size information includes the block size and the space size of the waterfall flow. Among them, the block size of the waterfall flow is represented by Block_Size[], and the space size is represented by Space_Size[]. After the cloud server obtains the default size information of the waterfall flow in the terminal screen, it can obtain the default margin of the UI component on the terminal screen through this default size information.

[0045] In addition, the cloud server obtains the default margin through the default size information specifically by a preset default margin calculation formula. The calculation formula of the default margin is: Temppx = ((1 - (Column * Block_Size[0] + (Column - 1) * Space_Size[0])) * Width / 2), where Temppx is the default margin, Column is the Column function in the waterfall flow parameters, and Width is the actual edge width of the terminal screen.

[0046] In other embodiments of the invention, as Figure 3 shown, after step S120, step S120a is further included.

[0047] S120a. Calculate the boundary percentage of the waterfall flow in the terminal screen according to the default size information.

[0048] In this embodiment, the boundary percentage is the percentage of the screen space occupied by the boundary of the waterfall flow in the terminal screen before adaptation in the terminal screen. The virtual screen width of the waterfall flow is obtained by acquiring the boundary percentage, so as to facilitate changing the UI control for implementing the configuration of the waterfall flow in the terminal screen, thereby achieving the adaptation of the waterfall flow in the terminal screen. Among them, the calculation formula for the boundary percentage is: S = (1 - (Column * Block_Size[0] + (Column - 1) * Space_Size[0])), where S is the boundary percentage and Column is the Column function in the waterfall flow parameters.

[0049] S130. If the actual margin of the UI component on the terminal screen is equal to the default margin, configure the waterfall flow according to the UI component on the terminal screen.

[0050] Among them, the actual margin of the UI component on the terminal screen being equal to the default margin means that the pre-set parameter information for the UI component to perform waterfall flow configuration on the terminal screen conforms to the configuration of the waterfall flow on the terminal screen. At this time, without changing the pre-set parameter information of the UI component, the waterfall flow can be configured on the terminal screen.

[0051] S140. If the actual margin is not equal to the default margin, adjust the parameters of the UI component according to the virtual screen width required by the waterfall flow to obtain an adjusted UI component.

[0052] Specifically, the actual margin not being equal to the default margin means that the pre-set parameter information for the UI component to perform waterfall flow configuration on the terminal screen does not conform to the configuration of the waterfall flow on the terminal screen. At this time, the pre-set parameter information of the UI component needs to be changed, so that the UI component can configure the waterfall flow starting from the terminal screen size on the terminal screen.

[0053] In other inventive embodiments, as Figure 4 shown, before step S140, there is also step S140a.

[0054] S140a. Calculate the virtual screen width according to the boundary percentage.

[0055] Specifically, the virtual screen width is the width of the terminal screen adapted to the waterfall flow. The formula for calculating the virtual screen width through the boundary percentage is: ScreenSizeX = (Width - 2 * Offsetpx) / (1 - S), where ScreenSizeX is the virtual screen width, Width is the actual width of the terminal screen, Offsetpx is the actual margin of the UI component on the terminal screen, and S is the boundary percentage. When calculating the virtual screen width using the above formula, it is necessary to pre-obtain the boundary percentage, the actual width of the terminal screen, and the actual margin of the UI component on the terminal screen, and then use the above formula for calculation to obtain the virtual width.

[0056] In other embodiments of the invention, such as Figure 5 shown, step S140a includes sub-steps S140a1 and S140a2.

[0057] S140a1. Obtain the virtual edge width of the virtual screen width according to the boundary percentage;

[0058] S140a2. Calculate the virtual screen width according to the virtual edge width.

[0059] In this embodiment, the virtual edge width is obtained through the formula for calculating the virtual screen width by the boundary percentage, and its formula is: 2W / S = ScreenSizeX, where W is the virtual edge width of the virtual screen width, S is the boundary percentage. Through the above formula, the virtual edge width can be expressed using the boundary percentage and the virtual screen width, and then the virtual edge width is input into a preset calculation formula to obtain the virtual screen width.

[0060] In other embodiments of the invention, such as Figure 6 shown, step S140a2 includes sub-steps S140a21 and S140a22.

[0061] S140a21. If the actual margin is less than the default margin, input the virtual edge width, the actual margin, and the actual edge width of the terminal screen into the first virtual screen width formula to obtain the virtual screen width;

[0062] S140a22. If the actual margin is greater than the default margin, input the virtual edge width, the actual margin, and the actual edge width of the terminal screen into the second virtual screen width formula to obtain the virtual screen width.

[0063] In this embodiment, there are two calculation formulas for calculating the virtual screen width, namely the first virtual screen width formula and the second virtual screen width formula. The first virtual screen width formula is used to calculate the virtual screen width when the actual margin of the UI component on the terminal screen is less than the default margin, and the second virtual screen width formula is used to calculate the virtual screen width when the actual margin of the UI component on the terminal screen is greater than the default margin. The first virtual screen width formula is: (W - Offsetpx) * 2 + Width = ScreenSizeX, and the second virtual screen width formula is: ScreenSizeX + 2 * (Offsetpx - W) = Width, where W is the virtual edge width of the virtual screen width, Offsetpx is the actual margin of the UI component on the terminal screen, Width is the actual width of the terminal screen, and ScreenSizeX is the virtual screen width.

[0064] In other embodiments of the invention, as Figure 7 shown, step S140 includes sub-steps S141 and S142.

[0065] S141. Calculate the actual size information of the waterfall flow in the terminal screen according to the virtual screen width;

[0066] S142. Adjust the parameters of the UI component according to the actual size information.

[0067] In this embodiment, the actual size information is the holding size information of the waterfall flow that can be adapted in the terminal screen. The formula used to calculate the actual size information is: L = Block_size[0] * ScreenSizeX, where L is the actual size information of the waterfall flow in the terminal screen, Block_size is the actual block size of the waterfall flow, and ScreenSizeX is the virtual screen width. After obtaining the actual size information of the waterfall flow in the terminal screen, the UI controls in the UI component can be adjusted in reverse, so that the adjusted UI controls can adapt to the waterfall flow of the terminal configuration model in the terminal screen.

[0068] S150. Configure the waterfall flow on the terminal screen according to the adjusted UI component.

[0069] Specifically, after the cloud server adjusts the UI controls in the UI component, the adjusted UI component can configure the waterfall flow on the terminal screen. Thus, when it is necessary to configure the waterfall flow on the terminal screen, only the UI component for configuring the waterfall flow needs to be adjusted accordingly, without pre-storing in the cloud server the waterfall flow configured for the terminal screen in advance, reducing the storage pressure on the cloud service. At the same time, it also avoids the secondary adaptation of the waterfall flow on the terminal screen, indirectly improving the efficiency of subsequent maintenance of the waterfall flow and reducing the cost of subsequent waterfall flow maintenance.

[0070] In the method for adapting the screen-end waterfall flow provided in the embodiments of the present invention, by receiving a request to configure a waterfall flow on the terminal screen for a preset UI component; obtaining the default margin of the UI component on the terminal screen; if the actual margin of the UI component on the terminal screen is equal to the default margin, configuring the waterfall flow on the terminal screen according to the UI component; if the actual margin is not equal to the default margin, adjusting the parameters of the UI component according to the virtual screen width required by the waterfall flow to obtain an adjusted UI component; and configuring the waterfall flow on the terminal screen according to the adjusted UI component. By this method, when configuring the waterfall flow for the screen-end of the terminal device, the present invention compares the default margin and the actual margin of the UI component on the terminal screen in advance to obtain whether the actual margin is equal to the default margin. If they are equal, the waterfall flow is directly configured on the terminal screen; if not, the parameters of the UI component are adjusted according to the virtual screen width of the terminal screen and the waterfall flow is configured on the terminal screen through the adjusted UI component, thereby solving the problem that the waterfall flow cannot be adapted to different-resolution screen-ends, indirectly improving the efficiency of subsequent maintenance of the waterfall flow, and reducing the cost of waterfall flow maintenance.

[0071] The embodiments of the present invention further provide a screen-end waterfall flow adaptation device 100, which is used to execute any one of the embodiments of the foregoing screen-end waterfall flow adaptation method.

[0072] Specifically, please refer to Figure 8 , Figure 8 which is a schematic block diagram of the screen-end waterfall flow adaptation device 100 provided by the embodiments of the present invention.

[0073] As Figure 8 shown, the screen-end waterfall flow adaptation device 100 includes: a receiving unit 110, a first obtaining unit 120, a first configuration unit 130, a first adjustment unit 140, and a second configuration unit 150.

[0074] The receiving unit 110 is used to receive a request to configure a waterfall flow on the terminal screen for a preset UI component.

[0075] A first acquisition unit 120, configured to acquire a default margin of the UI component on the terminal screen.

[0076] In another embodiment, the first acquisition unit 120 includes: a second acquisition unit and a third acquisition unit.

[0077] The second acquisition unit is configured to acquire default size information of the waterfall flow in the terminal screen; the third acquisition unit is configured to acquire the default margin according to the default size information.

[0078] In another embodiment, the adaptation device 100 of the screen - end waterfall flow further includes: a first calculation unit.

[0079] The first calculation unit is configured to calculate a boundary percentage of the waterfall flow in the terminal screen according to the default size information.

[0080] A first configuration unit 130, configured to configure the waterfall flow according to the UI component on the terminal screen if an actual margin of the UI component on the terminal screen is equal to the default margin.

[0081] A first adjustment unit 140, configured to adjust parameters of the UI component according to a virtual screen width required by the waterfall flow to obtain an adjusted UI component if the actual margin is not equal to the default margin.

[0082] In another embodiment, the adaptation device 100 of the screen - end waterfall flow further includes: a second calculation unit.

[0083] The second calculation unit is configured to calculate the virtual screen width according to the boundary percentage.

[0084] In another embodiment, the second calculation unit includes: a third calculation unit and a fourth acquisition unit.

[0085] The fourth acquisition unit is configured to acquire a virtual side width of the virtual screen width according to the boundary percentage; the third calculation unit is configured to calculate the virtual screen width according to the virtual side width.

[0086] In another embodiment, the third calculation unit includes: a first input unit and a second input unit.

[0087] The first input unit is configured to input the virtual side width, the actual margin, and an actual side width of the terminal screen into a first virtual screen width formula to obtain the virtual screen width if the actual margin is less than the default margin; the second input unit is configured to input the virtual side width, the actual margin, and the actual side width of the terminal screen into a second virtual screen width formula to obtain the virtual screen width if the actual margin is greater than the default margin.

[0088] In another embodiment, the first adjustment unit 140 includes: a fourth calculation unit and a second adjustment unit.

[0089] The fourth calculation unit is configured to calculate actual size information of the waterfall flow in the terminal screen according to the virtual screen width; the second adjustment unit is configured to adjust parameters of the UI component according to the actual size information.

[0090] The second configuration unit 150 is configured to configure the waterfall flow on the terminal screen according to the adjusted UI component.

[0091] The adaptation device 100 for the screen-side waterfall flow provided by the embodiment of the present invention is used to execute the above request for configuring the waterfall flow on the terminal screen by receiving a preset UI component; obtaining a default margin of the UI component on the terminal screen; if an actual margin of the UI component on the terminal screen is equal to the default margin, configuring the waterfall flow according to the UI component on the terminal screen; if the actual margin is not equal to the default margin, adjusting parameters of the UI component according to a virtual screen width required by the waterfall flow to obtain an adjusted UI component; and configuring the waterfall flow on the terminal screen according to the adjusted UI component.

[0092] It should be noted that those skilled in the art can clearly understand the specific implementation processes of the above adaptation device 100 for the screen-side waterfall flow and each unit, and can refer to the corresponding descriptions in the foregoing method embodiments. For the sake of convenience and brevity of description, they will not be elaborated herein.

[0093] The above adaptation device for the screen-side waterfall flow can be implemented in the form of a computer program, and the computer program can run on a computer device as shown in Figure 9 shown.

[0094] Please refer to Figure 9 , Figure 9 which is a schematic block diagram of a computer device provided by an embodiment of the present application. The computer device 500 may be a terminal. Among them, the terminal may be an electronic device with a communication function such as a smart phone, a tablet computer, a notebook computer, a desktop computer, a personal digital assistant, and a wearable device.

[0095] Refer to Figure 9 , the computer device 500 includes a processor 502, a memory, and a network interface 505 connected through a system bus 501. Among them, the memory may include a non-volatile storage medium 503 and an internal memory 504.

[0096] The non-volatile storage medium 503 can store an operating system 5031 and a computer program 5032. The computer program 5032 includes program instructions which, when executed, can cause the processor 502 to execute an adaptation method for a screen-end waterfall flow.

[0097] The processor 502 is used to provide computing and control capabilities to support the operation of the entire computer device 500.

[0098] The internal memory 504 provides an environment for the operation of the computer program 5032 in the non-volatile storage medium 503. When the computer program 5032 is executed by the processor 502, it can cause the processor 502 to execute an adaptation method for a screen-end waterfall flow.

[0099] The network interface 505 is used for network communication with other devices. Those skilled in the art can understand that Figure 9 the structure shown in is only a block diagram of some structures related to the solution of this application, and does not constitute a limitation on the computer device 500 to which the solution of this application is applied. The specific computer device 500 may include more or fewer components than those shown in the figure, or combine some components, or have different component arrangements.

[0100] Among them, the processor 502 is used to run the computer program 5032 stored in the memory to implement the following steps: receiving a request to configure a waterfall flow for a preset UI component on the terminal screen; obtaining the default margin of the UI component on the terminal screen; if the actual margin of the UI component on the terminal screen is equal to the default margin, configuring the waterfall flow according to the UI component on the terminal screen; if the actual margin is not equal to the default margin, adjusting the parameters of the UI component according to the virtual screen width required by the waterfall flow to obtain an adjusted UI component; configuring the waterfall flow on the terminal screen according to the adjusted UI component.

[0101] In one embodiment, when the processor 502 implements obtaining the default margin of the UI component on the terminal screen, it specifically implements the following steps: obtaining the default size information of the waterfall flow in the terminal screen; obtaining the default margin according to the default size information.

[0102] In one embodiment, after the processor 502 implements obtaining the default margin of the UI component on the terminal screen, it also implements the following steps: calculating the boundary percentage of the waterfall flow in the terminal screen according to the default size information.

[0103] In one embodiment, before the processor 502 adjusts the parameters of the UI component according to the virtual screen width required by the waterfall flow, the following steps are also implemented: calculating the virtual screen width according to the boundary percentage.

[0104] In one embodiment, when the processor 502 calculates the virtual screen width according to the boundary percentage, the following specific steps are implemented: obtaining the virtual side width of the virtual screen width according to the boundary percentage; calculating the virtual screen width according to the virtual side width.

[0105] In one embodiment, when the processor 502 calculates the virtual screen width according to the virtual side width, the following specific steps are implemented: if the actual margin is less than the default margin, inputting the virtual side width, the actual margin, and the actual side width of the terminal screen into the first virtual screen width formula to obtain the virtual screen width; if the actual margin is greater than the default margin, inputting the virtual side width, the actual margin, and the actual side width of the terminal screen into the second virtual screen width formula to obtain the virtual screen width.

[0106] In one embodiment, when the processor 502 adjusts the parameters of the UI component according to the virtual screen width required by the waterfall flow, the following specific steps are implemented: calculating the actual size information of the waterfall flow in the terminal screen according to the virtual screen width; adjusting the parameters of the UI component according to the actual size information.

[0107] It should be understood that in the embodiments of the present application, the processor 502 may be a central processing unit (CPU), and the processor 502 may also be other general-purpose processors, digital signal processors (DSPs), application specific integrated circuits (ASICs), off-the-shelf programmable gate arrays (FPGAs) or other programmable logic devices, discrete gate or transistor logic devices, discrete hardware components, etc. Among them, the general-purpose processor may be a microprocessor or the processor may also be any conventional processor, etc.

[0108] Those of ordinary skill in the art can understand that all or part of the processes of the methods in the above embodiments can be completed by instructing relevant hardware through a computer program. The computer program includes program instructions, and the computer program can be stored in a storage medium, and the storage medium is a computer-readable storage medium. The program instructions are executed by at least one processor in the computer system to implement the flow steps of the embodiments of the above methods.

[0109] Therefore, the present invention also provides a storage medium. The storage medium may be a computer-readable storage medium. The storage medium stores a computer program, wherein the computer program includes program instructions. When the program instructions are executed by a processor, the processor performs the following steps: receiving a request for configuring a waterfall flow on a terminal screen by a preset UI component; obtaining a default margin of the UI component on the terminal screen; if an actual margin of the UI component on the terminal screen is equal to the default margin, configuring the waterfall flow according to the UI component on the terminal screen; if the actual margin is not equal to the default margin, adjusting parameters of the UI component according to a virtual screen width required for the waterfall flow to obtain an adjusted UI component; and configuring the waterfall flow on the terminal screen according to the adjusted UI component.

[0110] In one embodiment, when the processor executes the program instructions to implement obtaining the default margin of the UI component on the terminal screen, the following steps are specifically implemented: obtaining default size information of the waterfall flow in the terminal screen; and obtaining the default margin according to the default size information.

[0111] In one embodiment, after the processor executes the program instructions to implement obtaining the default margin of the UI component on the terminal screen, the following steps are further implemented: calculating a boundary percentage of the waterfall flow in the terminal screen according to the default size information.

[0112] In one embodiment, before the processor executes the program instructions to implement adjusting the parameters of the UI component according to the virtual screen width required for the waterfall flow, the following steps are further implemented: calculating the virtual screen width according to the boundary percentage.

[0113] In one embodiment, when the processor executes the program instructions to implement calculating the virtual screen width according to the boundary percentage, the following steps are specifically implemented: obtaining a virtual side width of the virtual screen width according to the boundary percentage; and calculating the virtual screen width according to the virtual side width.

[0114] In one embodiment, when the processor executes the program instructions to implement calculating the virtual screen width according to the virtual side width, the following steps are specifically implemented: if the actual margin is less than the default margin, inputting the virtual side width, the actual margin, and an actual side width of the terminal screen into a first virtual screen width formula to obtain the virtual screen width; if the actual margin is greater than the default margin, inputting the virtual side width, the actual margin, and the actual side width of the terminal screen into a second virtual screen width formula to obtain the virtual screen width.

[0115] In one embodiment, when the processor executes the program instructions to adjust the parameters of the UI component according to the virtual screen width required by the waterfall flow, the following specific steps are implemented: calculate the actual size information of the waterfall flow in the terminal screen according to the virtual screen width; adjust the parameters of the UI component according to the actual size information.

[0116] The storage medium can be various computer-readable storage media such as a USB flash drive, a mobile hard disk, a read-only memory (ROM), a magnetic disk, or an optical disc, etc., which can store program codes.

[0117] Those of ordinary skill in the art can realize that the units and algorithm steps of each example described in combination with the embodiments disclosed herein can be implemented by electronic hardware, computer software, or a combination of both. To clearly illustrate the interchangeability of hardware and software, the composition and steps of each example have been generally described according to functions in the above description. Whether these functions are executed in a hardware or software manner depends on the specific application and design constraints of the technical solution. Professional technicians can use different methods to implement the described functions for each specific application, but such implementation should not be considered to exceed the scope of the present invention.

[0118] In several embodiments provided by the present invention, it should be understood that the disclosed devices and methods can be implemented in other ways. For example, the device embodiments described above are merely illustrative. For example, the division of each unit is only a logical function division, and there can be other division methods in actual implementation. For example, multiple units or components can be combined or integrated into another system, or some features can be ignored or not executed.

[0119] The steps in the method embodiments of the present invention can be adjusted, combined, and deleted according to actual needs. The units in the device embodiments of the present invention can be combined, divided, and deleted according to actual needs. In addition, the functional units in each embodiment of the present invention 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.

[0120] If the integrated unit is implemented in the form of a software functional unit and sold or used as an independent product, it can be stored in a storage medium. Based on such an understanding, the technical solution of the present invention, in essence, or the part that contributes to the prior art, or all or part of the technical solution, can be embodied in the form of a software product. The 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 terminal, or a network device, etc.) to execute all or part of the steps of the methods described in each embodiment of the present invention.

[0121] As described above, it is only the specific implementation manner of the present invention, but the protection scope of the present invention is not limited thereto. Any person skilled in the art within the technical scope disclosed by the present invention can easily think of various equivalent modifications or substitutions, and these modifications or substitutions should all be covered within the protection scope of the present invention. Therefore, the protection scope of the present invention shall be subject to the protection scope of the claims.

Claims

1. An adaptation method for the screen-end waterfall flow, characterized in that, including: Receiving a request to configure a waterfall flow for a preset UI component on a terminal screen; Obtaining the default margin of the UI component on the terminal screen, where the default margin is the margin preset by the UI component on a terminal screen with any resolution; If the actual margin of the UI component on the terminal screen is equal to the default margin, configuring the waterfall flow according to the UI component on the terminal screen; If the actual margin is not equal to the default margin, adjusting the parameters of the UI component according to the virtual screen width required for the waterfall flow to obtain an adjusted UI component. Adjusting the parameters of the UI component according to the virtual screen width required for the waterfall flow includes: Calculating the actual size information of the waterfall flow in the terminal screen according to the virtual screen width; Adjusting the parameters of the UI component according to the actual size information. The actual size information is the size information of the waterfall flow that can be adapted in the terminal screen. The formula for calculating the actual size information is: L = Block_size[0] * ScreenSizeX, where L is the actual size information of the waterfall flow in the terminal screen, Block_Size[] is the block size of the waterfall flow, and ScreenSizeX is the virtual screen width; Configuring the waterfall flow on the terminal screen according to the adjusted UI component.

2. The adaptation method of the screen-end waterfall flow according to claim 1, wherein The obtaining the default margin of the UI component on the terminal screen includes: Obtaining the default size information of the waterfall flow in the terminal screen; Obtaining the default margin according to the default size information.

3. The adaptation method of the screen-side waterfall flow according to claim 2, wherein After obtaining the default margin of the UI component on the terminal screen, it further includes: Calculating the boundary percentage of the waterfall flow in the terminal screen according to the default size information.

4. The adaptation method of the screen-side waterfall flow according to claim 3, wherein Before adjusting the parameters of the UI component according to the virtual screen width required for the waterfall flow, it further includes: Calculating the virtual screen width according to the boundary percentage.

5. The adaptation method of the screen-side waterfall flow according to claim 4, characterized in that The calculating the virtual screen width according to the boundary percentage includes: Obtaining the virtual edge width of the virtual screen width according to the boundary percentage; Calculating the virtual screen width according to the virtual edge width.

6. The adaptation method of the screen-side waterfall flow according to claim 5, characterized in that The calculating the virtual screen width according to the virtual edge width includes: If the actual margin is less than the default margin, inputting the virtual edge width, the actual margin, and the actual edge width of the terminal screen into the first virtual screen width formula to obtain the virtual screen width; If the actual margin is greater than the default margin, inputting the virtual edge width, the actual margin, and the actual edge width of the terminal screen into the second virtual screen width formula to obtain the virtual screen width.

7. An adaptation device for a screen-end waterfall flow, characterized in that, including: A receiving unit, configured to receive a request to configure a waterfall flow for a preset UI component on a terminal screen; A first obtaining unit, configured to obtain the default margin of the UI component on the terminal screen, where the default margin is the margin preset by the UI component on a terminal screen with any resolution; The first configuration unit is used to configure the waterfall flow on the terminal screen according to the UI component if the actual margin of the UI component on the terminal screen is equal to the default margin; The first adjustment unit is used to adjust the parameters of the UI component according to the virtual screen width required by the waterfall flow if the actual margin is not equal to the default margin, and obtain the adjusted UI component. The adjustment of the parameters of the UI component according to the virtual screen width required by the waterfall flow includes: Calculating the actual size information of the waterfall flow in the terminal screen according to the virtual screen width; Adjusting the parameters of the UI component according to the actual size information, where the actual size information is the size information of the waterfall flow that can be adapted in the terminal screen, and the formula for calculating the actual size information is: L = Block_size[0] * ScreenSizeX, where L is the actual size information of the waterfall flow in the terminal screen, Block_Size[] is the block size of the waterfall flow, and ScreenSizeX is the virtual screen width; The second configuration unit is used to configure the waterfall flow on the terminal screen according to the adjusted UI component.

8. A computer device, comprising a memory, a processor, and a computer program stored on the memory and executable on the processor, characterized in that, When the processor executes the computer program, it implements the adaptation method of the screen-terminal waterfall flow as described in any one of claims 1 to 6.

9. A computer-readable storage medium, characterized in that, The computer-readable storage medium stores a computer program, and when the computer program is executed by the processor, it causes the processor to execute the adaptation method of the screen-terminal waterfall flow as described in any one of claims 1 to 6.

Images