Method for automatically combining display pages based on style attributes and related device

By acquiring and optimizing style sets in the style library, page styles are automatically combined, solving the problem of cumbersome operations in existing technologies, achieving precise control over similar cards, and reducing code modification and development workload.

CN115756692BActive Publication Date: 2025-12-23CHINA PING AN PROPERTY INSURANCE CO LTD
View PDF 1 Cites 0 Cited by

Patent Information

Application Number
CN202211430922.7
Authority / Receiving Office
CN · China
Patent Type
Patents(China)
Current Assignee / Owner
Filing Date
2022-11-15
Publication Date
2025-12-23
Estimated Expiration
2042-11-15

AI Technical Summary

Technical Problem

Existing technologies involve cumbersome operations when modifying the style of page components, are not reusable or universal, and make it difficult to achieve precise control over similar cards without modifying the original code logic.

Method used

By acquiring the overall style set of the preset public style library and the target display card, the original style set is judged and optimized to generate the target display card, and the interface display page is generated according to the preset layout format. The page style is automatically combined using the style library.

Benefits of technology

It enables more precise control over the conversion between similar cards without modifying the original code logic, reducing the workload of developers.

✦ Generated by Eureka AI based on patent content.

Smart Images

  • Figure CN115756692B_ABST
    Figure CN115756692B_ABST
Patent Text Reader

Abstract

The embodiment of the application belongs to the field of UI design and medical application, is applied to the field of quick page file editing, and relates to a method for automatically combining and displaying a page based on style attributes and related equipment thereof, which comprises the following steps: obtaining a public style library and an overall style set of a target display card; obtaining an initialized original style set; taking the overall style set of the target display card as a reference style, selecting corresponding basic components from the style library, operating the original style set, and generating the target display card according to a final operation result of the original style set; and performing page layout on each target display card used according to a preset layout format, and generating an interface display page. The application controls the combination of attributes of the smallest constituent unit of the interface, generates the target display card in sequence, and then generates the interface display page through the target display card, so that more accurate control of the conversion between similar cards can be achieved without modifying the original code logic.
Need to check novelty before this filing date? Find Prior Art

Description

TECHNICAL FIELD

[0001] The present application relates to the technical field of UI design and page file quick editing, and in particular to a method for automatically combining and displaying a page based on style attributes and related equipment thereof. BACKGROUND

[0002] For similar page component units (sub-cards), the existing method for changing the attribute style of a card to its target similar card is to modify the original logic and control the display through a large number of parameters, which can solve the above problems, but this method is complicated to operate, cannot be reused, and is not universal.

[0003] Taking medical epidemic prevention as an example, various epidemic prevention mini-programs effectively help people prevent diseases in the epidemic prevention process, for example: the latest release interface, if there are more style variants, such as controlling the color of the assistant title, controlling the background, controlling the text color of the newly diagnosed, the text size, etc., how can we achieve more accurate control of the conversion between similar cards without modifying the original code logic. SUMMARY

[0004] The purpose of the embodiments of the present application is to provide a method for automatically combining and displaying a page based on style attributes and related equipment thereof, so as to achieve more accurate control of the conversion between similar cards without modifying the original code logic.

[0005] To solve the above technical problems, the embodiments of the present application provide a method for automatically combining and displaying a page based on style attributes, which adopts the following technical solutions:

[0006] A method for automatically combining and displaying a page based on style attributes, comprising the following steps:

[0007] Obtain a preset common style library and a whole style set of a target display card, wherein the common style library contains all preset basic components;

[0008] Obtain an initialized original style set;

[0009] According to a page generation instruction, select corresponding basic components from the common style library with the whole style set of the target display card as a reference style, operate the original style set, and generate a target display card according to the final operation result of the original style set;

[0010] According to a preset layout format, perform page layout on each target display card used to generate an interface display page.

[0011] Further, the step of operating the original style set comprises:

[0012] determining the relationship between the original style set and the overall style set of the target display card, and performing an optimization operation on the elements in the original style set according to the determination result.

[0013] Further, the overall style set includes attribute names and attribute values of basic components of styles of each sub-component unit constituting the target display card; the step of determining the relationship between the original style set and the overall style set of the target display card, and performing an optimization operation on the elements in the original style set according to the determination result, comprises:

[0014] comparing the attribute names in the original style set with the attribute names in the overall style set of the target display card to determine whether all the attribute names in the original style set are contained in the overall style set of the target display card;

[0015] If all the attribute names in the original style set are contained in the overall style set of the target display card, it is determined whether the attribute values corresponding to the attribute names in the original style set are the same as the attribute values corresponding to the attribute names in the overall style set of the target display card;

[0016] If not, the corresponding attribute values are obtained to perform a replacement operation;

[0017] If yes, attribute names not belonging to the original style set in the overall style set of the target display card are obtained, and the corresponding basic components are obtained from the common style library and added to the original style set according to the attribute names.

[0018] Further, after the step of determining whether all the attribute names in the original style set are contained in the overall style set of the target display card, the method further comprises:

[0019] If not all the attribute names in the original style set are contained in the overall style set of the target display card, the corresponding distinguishing elements are deleted, wherein the distinguishing elements represent attribute names and attribute values corresponding to the attribute names that are contained in the original style set but not contained in the overall style set of the target display card;

[0020] The attribute names in the original style set that are the same as those in the overall style set of the target display card are identified, and it is determined whether the attribute values corresponding to the attribute names in the original style set are the same as the attribute values corresponding to the attribute names in the overall style set of the target display card;

[0021] If not, the corresponding attribute values are obtained to perform a replacement operation;

[0022] If the same, get the attribute name in the overall style set of the target display card which does not belong to the original style set, and add the corresponding basic component to the original style set according to the attribute name from the common style library.

[0023] Further, the step of obtaining the corresponding attribute value for replacement operation specifically includes:

[0024] obtaining the attribute value corresponding to the attribute name from the overall style set of the target display card;

[0025] and replacing the attribute value to the attribute value corresponding to the attribute name in the original style set.

[0026] Further, the step of obtaining the attribute name in the overall style set of the target display card which does not belong to the original style set, and adding the corresponding basic component to the original style set according to the attribute name from the common style library specifically includes:

[0027] obtaining the attribute name in the overall style set of the target display card which does not belong to the original style set;

[0028] according to the attribute name and the preset adding order, sequentially adding the basic component corresponding to each attribute name to the original style set from the common style library;

[0029] according to the attribute name and the adding order, sequentially adding the attribute value corresponding to the current attribute name to the original style set from the overall style set of the target display card until the number of elements in the original style set is the same as the number of elements in the overall style set of the target display card, and the adding operation on the original style set is completed.

[0030] Further, the step of adding the attribute value corresponding to the current attribute name to the original style set from the overall style set of the target display card specifically includes:

[0031] taking the current attribute name as a retrieval key field, taking the common style library as a retrieval source, finding the attribute value corresponding to the current attribute name, and adding the attribute value to the original style set.

[0032] To solve the above technical problems, the embodiment of the application further provides a device for automatically combining a display page based on style attributes, which adopts the following technical scheme:

[0033] A device for automatically combining a display page based on style attributes, comprising:

[0034] The reference style acquisition module is configured to acquire a preset common style library and a whole style set of a target display card, wherein the common style library contains all preset basic components;

[0035] The original style acquisition module is configured to acquire an initialized original style set;

[0036] The target display card generation module is configured to select corresponding basic components from the common style library according to a page generation instruction and the whole style set of the target display card as a reference style, operate the original style set, and generate a target display card according to a final operation result of the original style set;

[0037] The interface display page generation module is configured to perform page layout on each target display card according to a preset layout format, and generate an interface display page.

[0038] To solve the above technical problems, the embodiment of the present application further provides a computer device, which adopts the technical scheme as follows:

[0039] A computer device includes a memory and a processor, the memory stores computer readable instructions, and the processor implements the steps of the method for automatically combining a display page based on style attributes as described above when executing the computer readable instructions.

[0040] To solve the above technical problems, the embodiment of the present application further provides a computer readable storage medium, which adopts the technical scheme as follows:

[0041] A computer readable storage medium stores computer readable instructions, and the computer readable instructions are executed by a processor to implement the steps of the method for automatically combining a display page based on style attributes as described above.

[0042] Compared with the prior art, the embodiment of the present application has the following beneficial effects:

[0043] The method for automatically combining a display page based on style attributes provided in the embodiments of the present application comprises the following steps: obtaining a whole style set of a target display card, wherein the whole style set comprises style sets of each lower-level component unit constituting the target display card, and the style set comprises attribute names and attribute values of basic components of the style of each lower-level component unit constituting the target display card; obtaining a style library comprising all preset basic components, wherein the style library comprises all preset basic components; obtaining an initialized original style set; selecting corresponding basic components from the style library according to a page generation instruction and the whole style set of the target display card as a reference style, operating the original style set, and generating the target display card according to a final operation result of the original style set; and performing page layout on each target display card used according to a preset layout format, and generating an interface display page. The present application controls the attributes of the smallest component unit of the interface, generates the target display card in sequence, and generates the interface display page through the target display card, so that the conversion between similar cards can be controlled more accurately without modifying the original code logic. BRIEF DESCRIPTION OF DRAWINGS

[0044] In order to more clearly illustrate the scheme in the present application, the drawings needed in the description of the embodiments of the present application will be briefly introduced. Obviously, the drawings in the following description are some embodiments of the present application, and other drawings can be obtained by those skilled in the art without creative labor.

[0045] Figure 1 is an exemplary system architecture diagram to which the present application can be applied;

[0046] Figure 2 a flowchart of one embodiment of the method for automatically combining a display page based on style attributes according to the present application;

[0047] Figure 3 a structural schematic diagram of one embodiment of the device for automatically combining a display page based on style attributes according to the present application;

[0048] Figure 4 is Figure 3 a structural schematic diagram of one specific embodiment of 303 shown in the figure;

[0049] Figure 5 is Figure 4 a structural schematic diagram of one specific embodiment of 401 shown in the figure;

[0050] Figure 6 is Figure 4 a structural schematic diagram of one specific embodiment of 402 shown in the figure;

[0051] Figure 7 Structure diagram of one embodiment of the computer device according to the present application. DETAILED DESCRIPTION

[0052] Unless otherwise defined, all technical and scientific terms used herein have the same meaning as commonly understood by one of ordinary skill in the art to which this application belongs; the terminology used in the description herein is for describing particular embodiments only and is not intended to be limiting of the application; the description herein and the claims of the application and the above description of the drawings herein is not intended to be complete descriptions of all features of the application; the terminology used herein is for the purpose of describing particular embodiments only and is not intended to limit the scope of the application. Numerous embodiments of the application will be described with reference to the drawings, and one skilled in the art will, upon attaining an understanding of the nature of the application by reading the following description, readily devise their own embodiments of the application without the use of the following claims.

[0053] Reference herein to "an embodiment" means that a particular feature, structure, or characteristic described in connection with the embodiment is included in at least one embodiment of the application. The appearances of the phrase "in an embodiment" in various places in the specification are not necessarily all referring to the same embodiment, nor are they necessarily all directed to the same

[0054] For those skilled in the art to better understand the technical solutions of the present application, the technical solutions in the embodiments of the present application will be described clearly and completely in conjunction with the drawings.

[0055] As shown in Figure 1 The system architecture 100 can include terminal devices 101, 102, 103, a network 104, and a server 105. The network 104 is a medium for providing a communication link between the terminal devices 101, 102, 103 and the server 105. The network 104 can include various connection types, such as wired, wireless communication links, or optical fiber cables, etc.

[0056] A user can use the terminal devices 101, 102, 103 to interact with the server 105 through the network 104 to receive or send messages, etc. Various communication client applications can be installed on the terminal devices 101, 102, 103, such as web browser applications, shopping applications, search applications, instant messaging tools, email clients, social platform software, etc.

[0057] The terminal devices 101, 102, and 103 can be various electronic devices with display screens and supporting web browsing, including but not limited to smart phones, tablet computers, e-book readers, MP3 (Moving Picture Experts Group Audio Layer III) players, MP4 (Moving Picture Experts Group Audio Layer IV) players, laptop portable computers, desktop computers, and the like.

[0058] The server 105 can be a server providing various services, such as a background server providing support for a page displayed on the terminal devices 101, 102, and 103.

[0059] It should be noted that the method for automatically combining a display page based on style attributes provided in the embodiments of the present application is generally executed by a server / terminal device, and accordingly, the device for automatically combining a display page based on style attributes is generally arranged in a server / terminal device.

[0060] It should be understood that Figure 1 The number of terminal devices, networks, and servers in

[0061] With reference to Figure 2 , a flowchart of one embodiment of the method for automatically combining a display page based on style attributes according to the present application is shown. The method for automatically combining a display page based on style attributes includes the following steps:

[0062] In step 201, a preset common style library and an overall style set of a target display card are obtained.

[0063] In this embodiment, the overall style set includes a style set of each lower-level component unit constituting the target display card.

[0064] The style set of each lower-level component unit constituting the target display card includes picture and picture layering styles, display text and display text layering styles, lists and list layering styles, carousel styles of pictures or text within a page, and the like.

[0065] By obtaining the overall style set of the target display card, it is convenient to provide a layering style reference for converting an initial display card into a target display card, so that the initial display card follows the reference style to be gradually converted into the target display card. The initial display card is "a certain card" in the background technology, and the target display card is "a target similar card" in the background technology.

[0066] In the embodiment, the style set includes attribute names and attribute values of basic components of styles of each lower-level component unit constituting the target display card.

[0067] The attribute names and attribute values of basic components of styles of each lower-level component unit constituting the target display card, taking a certain lower-level component picture in the target display card as an example, the basic components of the style of the picture can be understood as the attribute names and attribute values of the corresponding layer style of the picture, for example, the attribute name "src" corresponding to the access path of the picture and the specific address pointing as the attribute value, for example, the attribute name "height" corresponding to the height of the picture and the specific height value as the attribute value, for example, the attribute name "width" corresponding to the width of the picture and the specific width value as the attribute value.

[0068] By saving the attribute names and attribute values in the set in the key-value format, it is convenient to determine whether the attribute value needs to be updated or the attribute name needs to be supplemented or deleted during the conversion of the initial display card to the target display card, and to quickly determine whether the attribute name needs to be supplemented or deleted during the conversion of the initial display card to the target display card., it is convenient to perform lookup operation by attribute name during automatic combination.

[0069] In the embodiment, the common style library includes all preset basic components.

[0070] In the embodiment, the common style library can be a platform library that includes all attribute names in the layer style by default, ensuring the diversity of basic components and the multiple selectivity of target attribute styles.

[0071] Step 202, obtaining an initialized original style set.

[0072] In the embodiment, the common style library and the single element in the original style set are both key-value pair format data, wherein the key-value pair is composed of an attribute name of a page content style and an attribute value corresponding to the attribute name, and the specific format is [attribute name: attribute value].

[0073] In the embodiment, the attribute name and its corresponding attribute value are set in pairs in the key:value format. In another embodiment of the embodiment, the attribute name and its corresponding attribute value in the style library can also be in the format of {key:[value1, value2,..., valuen]}, which enumerates the selectable attribute values in the attribute value sequence. The interface developer can freely select according to the preset requirements during automatic combination of the layer style. By setting the single element in the style library and the original style set as key-value pair format data, it is convenient for the interface developer to make a free choice, and ensures the sufficiency of the target value during attribute value selection.

[0074] In step 203, according to the page generation instruction, a corresponding basic component is selected from the common style library with the overall style set of the target display card as a reference style, the original style set is operated, and the target display card is generated according to the final operation result of the original style set.

[0075] In this embodiment, the step of operating the original style set includes judging the relationship between the elements in the original style set and the overall style set of the target display card, and performing an optimization operation on the elements in the original style set according to the judgment result.

[0076] By judging the relationship between the elements in the original style set and the overall style set of the target display card, the optimization operation is performed on the elements in the original style set, which avoids directly changing the source logic code through code development during interface development, but through comparison principle, the different attribute names and attribute values between the two are cyclically retrieved without changing the source logic code, and then configuration replacement is performed, which avoids changing the source logic code and ensures the reuse of the source logic code multiple times. At the same time, the style library can also be cyclically reused in the form of comparison combination after updating, reducing the workload of the developer.

[0077] In this embodiment, the step of judging the relationship between the elements in the original style set and the overall style set of the target display card, and performing an optimization operation on the elements in the original style set according to the judgment result includes: comparing the attribute names in the original style set with the attribute names in the overall style set of the target display card, judging whether the attribute names in the original style set are all contained in the overall style set of the target display card, if the attribute names in the original style set are all contained in the overall style set of the target display card, judging whether the attribute values corresponding to the attribute names in the original style set are the same as the corresponding attribute values in the overall style set of the target display card, if not, obtaining the corresponding attribute values for replacement operation, and if yes, obtaining the attribute names in the overall style set of the target display card that do not belong to the original style set, and adding the corresponding basic components obtained from the common style library according to the attribute names to the original style set.

[0078] In the embodiment, the step of judging the relationship between the elements in the original style set and the overall style set of the target display card, and performing optimization operation on the elements in the original style set according to the judgment result further comprises: if the attribute names in the original style set are not all contained in the overall style set of the target display card, deleting the distinguished elements corresponding to the attribute names, wherein the distinguished elements represent the attribute names and the attribute values corresponding to the attribute names that are contained in the original style set but not contained in the overall style set of the target display card; identifying the attribute names in the original style set that are the same as those in the overall style set of the target display card, and judging whether the attribute values corresponding to the attribute names in the original style set are the same as the attribute values corresponding to the attribute names in the overall style set of the target display card; if not, obtaining the corresponding attribute values to perform replacement operation; if yes, obtaining the attribute names in the overall style set of the target display card that are not in the original style set, and adding the corresponding basic components from the common style library to the original style set according to the attribute names.

[0079] In the embodiment, the step of obtaining the corresponding attribute values to perform replacement operation specifically comprises: obtaining the attribute values corresponding to the attribute names from the overall style set of the target display card; and replacing the attribute values in the original style set corresponding to the attribute names with the attribute values.

[0080] In the embodiment, the step of obtaining the attribute names in the overall style set of the target display card that are not in the original style set, and adding the corresponding basic components from the common style library to the original style set according to the attribute names specifically comprises: obtaining the attribute names in the overall style set of the target display card that are not in the original style set; sequentially obtaining the basic components corresponding to each attribute name from the style library according to the attribute names and a preset adding order, and adding the basic components to the original style set; and sequentially obtaining the attribute values corresponding to the current attribute name from the overall style set of the target display card according to the attribute names and the adding order, and adding the attribute values to the original style set, until the number of elements in the original style set is the same as that in the overall style set of the target display card, and the adding operation on the original style set is completed.

[0081] In the embodiment, the step of obtaining the attribute values corresponding to the current attribute name from the overall style set of the target display card and adding the attribute values to the original style set specifically comprises: taking the current attribute name as a search key field, and taking the common style library as a search source, to find the attribute values corresponding to the current attribute name, and adding the attribute values to the original style set

[0082] The adding operation of the elements in the original style set is completed, that is, the conversion from the original style set to the overall style set of the target display card is completed, by the way of cyclic adding until the number of elements in the original style set is the same as the number of elements in the overall style set of the target display card.

[0083] In step 204, the target display cards used are page laid out according to a preset layout format, and an interface display page is generated.

[0084] The application obtains the overall style set of the target display card, wherein the overall style set includes the style set of each subordinate component unit constituting the target display card, and the style set includes the attribute name and attribute value of the basic component of the style of each subordinate component unit constituting the target display card. A style library including all preset basic components is obtained, wherein the style library contains all preset basic components. An initialized original style set is obtained. According to a page generation instruction, the corresponding basic component is selected from the style library with reference to the overall style set of the target display card, the original style set is operated, and the target display card is generated according to the final operation result of the original style set. The target display cards used are page laid out according to a preset layout format, and an interface display page is generated. The application controls the combination of the attributes of the smallest component units of the interface in sequence to generate the target display card, and then generates the interface display page through the target display card, so that the conversion between similar cards can be controlled more accurately without modifying the original code logic.

[0085] The embodiments of the application can acquire and process related data based on artificial intelligence technology. Artificial intelligence (AI) is the use of digital computers or computer-controlled machines to simulate, extend and expand human intelligence, perceive the environment, acquire knowledge and use knowledge to obtain the best results.

[0086] The basic technology of artificial intelligence generally includes technologies such as sensors, special artificial intelligence chips, cloud computing, distributed storage, big data processing technology, operation / interaction system, mechatronics, etc. The software technology of artificial intelligence mainly includes computer vision technology, robot technology, biometric technology, speech processing technology, natural language processing technology, and machine learning / deep learning, etc.

[0087] In this embodiment, a smart managed model can be used to perform fine-grained control between front-end UI display units. Specifically, the overall style set of the target display card is pre-entered into the smart managed model. The public style library is used as the model's retrieval library, and the initial style set is used as the input value. Layered style updates are performed through comparison and filtering and preset update and replacement conditions until the number of elements in the initial style set is the same as the number of elements in the style set of the target display card. The model is then output, and the updated initial style set is output. Using a machine model to replace manual updates reduces the workload of interface developers and later interface operation personnel.

[0088] Further reference Figure 3 As a response to the above Figure 2 The implementation of the method shown in this application provides an embodiment of a device for automatically combining and displaying pages based on style attributes. This device embodiment is similar to... Figure 2 Corresponding to the method embodiments shown, this device can be specifically applied to various electronic devices.

[0089] like Figure 3 As shown, the device 300 for automatically combining and displaying pages based on style attributes described in this embodiment includes: a reference style acquisition module 301, an original style acquisition module 302, a target display card generation module 303, and an interface display page generation module 304. Wherein:

[0090] The reference style acquisition module 301 is used to acquire the overall style set of the preset public style library and the target display card, wherein the public style library contains all preset basic components;

[0091] The original style acquisition module 302 is used to acquire the initialized original style set;

[0092] The target display card generation module 303 is used to select corresponding basic components from the public style library according to the page generation instructions, with the overall style set of the target display card as a reference style, to operate on the original style set, and generate the target display card according to the final operation result of the original style set.

[0093] The interface display page generation module 304 is used to arrange the pages of each target display card according to the preset layout format and generate the interface display page.

[0094] Continue to refer to Figure 4 , Figure 4 yes Figure 3 The diagram shows a specific embodiment of the target display card generation module 303, which includes a judgment submodule 401 and an optimization submodule 402. Wherein:

[0095] The judgment submodule 401 is used to determine the relationship between the elements in the original style set and the overall style set of the target display card.

[0096] The optimization submodule 402 is used to perform optimization operations on the elements in the original style set based on the judgment result.

[0097] Continue to refer to Figure 5 , Figure 5 yes Figure 4 The diagram shows a specific embodiment of the structure of 401. The judgment submodule 401 includes: a first judgment unit 501, a second judgment unit 502, and a third judgment unit 503. Wherein:

[0098] The first judgment unit 501 is used to compare the attribute names in the original style set with the attribute names in the overall style set of the target display card to determine whether all the attribute names in the original style set are included in the overall style set of the target display card.

[0099] The second judgment unit 502 is used to determine whether the attribute value corresponding to the attribute name in the original style set is the same as the corresponding attribute value in the overall style set of the target display card if all the attribute names in the original style set are included in the overall style set of the target display card.

[0100] The third judgment unit 503 is used to delete the corresponding distinguishing element if the attribute names in the original style set are not all included in the overall style set of the target display card, identify the attribute names in the original style set that are the same as those in the overall style set of the target display card, and determine whether the attribute value corresponding to the attribute name in the original style set is the same as the corresponding attribute value in the overall style set of the target display card.

[0101] Continue to refer to Figure 6 , Figure 6 yes Figure 4 The diagram shows a specific embodiment of the optimization submodule 402, which includes a first optimization unit 601 and a second optimization unit 602.

[0102] in:

[0103] The first optimization unit 601 is used to obtain the corresponding attribute value and perform a replacement operation if the attribute value corresponding to the attribute name in the original style set is different from the attribute value corresponding to the overall style set of the target display card. Specifically, it includes: obtaining the attribute value corresponding to the attribute name from the overall style set of the target display card and replacing the attribute value with the attribute value corresponding to the attribute name in the original style set.

[0104] The second optimization unit 602 is configured to acquire attribute names in the overall style set of the target display card that do not belong to the attribute names in the original style set, and add corresponding basic components from the common style library to the original style set according to the attribute names, if the attribute values corresponding to the attribute names in the original style set are the same as the attribute values corresponding to the attribute names in the overall style set of the target display card.

[0105] The conversion between similar cards is automatically controlled more accurately through the plurality of judgment subunits and the optimization subunit.

[0106] The application obtains an overall style set of a target display card, wherein the overall style set includes style sets of each subordinate component unit constituting the target display card, and the style set includes attribute names and attribute values of basic components of the style of each subordinate component unit constituting the target display card. A style library including all preset basic components is obtained, wherein the style library contains all preset basic components. An original style set is initialized. According to a page generation instruction, corresponding basic components are selected from the style library with reference to the overall style set of the target display card as a reference style, the original style set is operated, and a target display card is generated according to a final operation result of the original style set. Each target display card used is laid out according to a preset layout format, and an interface display page is generated. The application controls the combination of attributes of the smallest interface component unit, generates target display cards in sequence, and generates an interface display page through the target display cards, so that the conversion between similar cards is automatically controlled more accurately without modifying the original code logic.

[0107] Persons skilled in the art can understand that all or part of the processes in the above-mentioned embodiments can be completed by computer readable instructions instructing related hardware, and the computer readable instructions can be stored in a computer readable storage medium. When the program is executed, the processes of the above-mentioned embodiments can be included. The storage medium can be a non-volatile storage medium such as a magnetic disc, an optical disc, a read-only memory (ROM), or a random access memory (RAM).

[0108] It should be understood that although each step in the flowchart of the accompanying drawings is shown in sequence according to the direction of the arrow, these steps are not necessarily executed in sequence according to the direction of the arrow. Unless explicitly stated herein, the execution of these steps is not strictly limited in sequence, and they can be executed in other sequences. Moreover, at least part of the steps in the flowchart of the accompanying drawings can include multiple sub-steps or multiple stages, which are not necessarily executed at the same time, but can be executed at different times, and the execution sequence is not necessarily sequential, but can be alternately or alternately executed with at least part of other steps or sub-steps or stages of other steps.

[0109] To solve the above technical problems, the embodiments of the present application further provide a computer device. For details, please refer to Figure 7 , Figure 7 The basic structure block diagram of the computer device of the present embodiment is shown in FIG. 7.

[0110] The computer device 7 includes a memory 71, a processor 72, and a network interface 73, which are connected to each other through a system bus. It should be noted that only the computer device 7 with components 71-73 is shown in the figure, but it should be understood that it is not required to implement all the shown components, and more or fewer components can be alternatively implemented. Among them, those skilled in the art can understand that the computer device here is a device that can automatically perform numerical calculation and / or information processing according to pre-set or stored instructions, and its hardware includes but is not limited to microprocessors, application specific integrated circuits (ASICs), field programmable gate arrays (FPGAs), digital signal processors (DSPs), embedded devices, etc.

[0111] The computer device can be a desktop computer, a notebook computer, a palm computer, a cloud server, and other computing devices. The computer device can interact with the user through a keyboard, a mouse, a remote controller, a touchpad, a voice control device, and other means.

[0112] The memory 71 includes at least one type of readable storage medium, such as a flash memory, a hard disk, a multimedia card, a card-type memory (e.g., an SD or DX memory, etc.), a random access memory (RAM), a static random access memory (SRAM), a read-only memory (ROM), an electrically erasable programmable read-only memory (EEPROM), a programmable read-only memory (PROM), a magnetic memory, a magnetic disk, an optical disk, etc. In some embodiments, the memory 71 can be an internal storage unit of the computer device 7, such as a hard disk or a memory of the computer device 7. In other embodiments, the memory 71 can also be an external storage device of the computer device 7, such as a plug-in hard disk, a smart media card (SMC), a secure digital (SD) card, a flash card, etc. equipped on the computer device 7. Of course, the memory 71 can also include both an internal storage unit and an external storage device of the computer device 7. In this embodiment, the memory 71 is generally used to store an operating system and various application software installed on the computer device 7, such as computer readable instructions of the method for automatically combining a display page based on style attributes, etc. In addition, the memory 71 can also be used to temporarily store various data that has been output or will be output.

[0113] The processor 72 can be a central processing unit (CPU), a controller, a microcontroller, a microprocessor, or other data processing chip in some embodiments. The processor 72 is generally used to control the overall operation of the computer device 7. In this embodiment, the processor 72 is used to run computer readable instructions or process data stored in the memory 71, such as computer readable instructions of the method for automatically combining a display page based on style attributes.

[0114] The network interface 73 can include a wireless network interface or a wired network interface, which is generally used to establish a communication connection between the computer device 7 and other electronic devices.

[0115] The computer device provided in the embodiment belongs to the technical field of UI design. The application obtains an overall style set of a target display card, wherein the overall style set includes style sets of each lower-level component unit constituting the target display card, and the style set includes attribute names and attribute values of basic components of the style of each lower-level component unit constituting the target display card. A style library including all preset basic components is obtained, wherein the style library contains all preset basic components. An initialized original style set is obtained. According to a page generation instruction, corresponding basic components are selected from the style library with the overall style set of the target display card as a reference style, the original style set is operated, and a target display card is generated according to a final operation result of the original style set. Each target display card used is laid out according to a preset layout format, and an interface display page is generated. The application controls the attributes of the smallest component units of the interface in combination, generates target display cards in sequence, and generates an interface display page through the target display cards, thereby ensuring that the conversion between similar cards can be automatically and more accurately controlled without modifying original code logic.

[0116] The application also provides another implementation, namely providing a computer readable storage medium storing computer readable instructions, which can be executed by a processor to make the processor execute the steps of the method for automatically combining a display page based on style attributes as described above.

[0117] The computer readable storage medium provided in the embodiment belongs to the technical field of UI design. The application obtains an overall style set of a target display card, wherein the overall style set includes style sets of each lower-level component unit constituting the target display card, and the style set includes attribute names and attribute values of basic components of the style of each lower-level component unit constituting the target display card. A style library including all preset basic components is obtained, wherein the style library contains all preset basic components. An initialized original style set is obtained. According to a page generation instruction, corresponding basic components are selected from the style library with the overall style set of the target display card as a reference style, the original style set is operated, and a target display card is generated according to a final operation result of the original style set. Each target display card used is laid out according to a preset layout format, and an interface display page is generated. The application controls the attributes of the smallest component units of the interface in combination, generates target display cards in sequence, and generates an interface display page through the target display cards, thereby ensuring that the conversion between similar cards can be automatically and more accurately controlled without modifying original code logic.

[0118] Those skilled in the art can clearly understand the above-mentioned embodiment method can be realized by means of software and the necessary general hardware platform, of course, it can also be realized by hardware, but in many cases, the former is a better embodiment. Based on such understanding, the technical solutions of the present application can be embodied in the form of a software product, which is stored in a storage medium (such as ROM / RAM, magnetic disk, optical disk) and includes a plurality of instructions for making a terminal device (which can be a mobile phone, computer, server, air conditioner, or network device, etc.) execute the method described in each embodiment of the present application.

[0119] Obviously, the above-described embodiments are only some of the embodiments of the present application, not all the embodiments, and the preferred embodiments of the present application are given in the drawings, but do not limit the patent scope of the present application. The present application can be implemented in many different forms, and conversely, the purpose of providing these embodiments is to make the disclosure of the present application more thorough and comprehensive. Although the present application has been described in detail with reference to the foregoing embodiments, those skilled in the art can still modify the technical solutions recorded in the foregoing specific embodiments, or make equivalent replacements to some of the technical features. Any equivalent structure made by using the content of the specification and drawings, directly or indirectly applied to other related technical fields, is also within the scope of the patent protection of the present application.

Claims

1. A method for automatically combining and displaying pages based on style attributes, characterized in that, The method comprises the following steps: obtaining a preset common style library and a whole style set of a target display card, wherein the common style library contains all preset basic components, and the whole style set of the target display card comprises attribute names and attribute values of basic components of styles of each lower-level component unit constituting the target display card; obtaining an initialized original style set, wherein the original style set comprises attribute names and attribute values of basic components of styles of each lower-level component unit constituting the target display card; selecting corresponding basic components from the common style library according to the whole style set of the target display card as a reference style, operating the original style set, and generating the target display card according to a final operation result of the original style set, wherein the operation of the original style set comprises the following steps: comparing attribute names in the original style set with attribute names in the whole style set of the target display card to determine whether all attribute names in the original style set are contained in the whole style set of the target display card; if all attribute names in the original style set are contained in the whole style set of the target display card, determining whether attribute values corresponding to the attribute names in the original style set are the same as attribute values corresponding to the attribute names in the whole style set of the target display card; if not, obtaining corresponding attribute values for replacement operation; if yes, obtaining attribute names in the whole style set of the target display card that are not in the original style set, and adding corresponding basic components obtained from the common style library according to the attribute names to the original style set; if not all attribute names in the original style set are contained in the whole style set of the target display card, deleting corresponding distinguishing elements, wherein the distinguishing elements represent attribute names and attribute values corresponding to the attribute names that are contained in the original style set but not contained in the whole style set of the target display card; identifying attribute names in the original style set that are the same as attribute names in the whole style set of the target display card, and determining whether attribute values corresponding to the attribute names in the original style set are the same as attribute values corresponding to the attribute names in the whole style set of the target display card; if not, obtaining corresponding attribute values for replacement operation; if yes, obtaining attribute names in the whole style set of the target display card that are not in the original style set, and adding corresponding basic components obtained from the common style library according to the attribute names to the original style set; performing page layout on each target display card according to a preset layout format to generate an interface display page.

2. The method for automatically combining a display page based on style attributes according to claim 1, wherein, The operation of the original style set comprises the following steps: determining a relationship between elements in the original style set and the whole style set of the target display card, and performing optimization operation on the elements in the original style set according to a determination result.

3. The method for automatically assembling a display page based on style attributes according to claim 1, wherein, The replacement operation of the corresponding attribute values comprises the following steps: acquiring an attribute value corresponding to the attribute name from the overall style set of the target display card; and replacing the attribute value into the attribute value corresponding to the attribute name in the original style set.

4. The method for automatically assembling a display page based on style attributes according to claim 1, wherein, The step of acquiring the attribute name not in the original style set from the overall style set of the target display card and acquiring the corresponding basic component from the public style library according to the attribute name and adding it to the original style set, specifically includes: acquiring the attribute name not in the original style set from the overall style set of the target display card; According to the attribute name and the preset adding order, the basic component corresponding to each attribute name is sequentially acquired from the public style library and added to the original style set; According to the attribute name and the adding order, the attribute value corresponding to the current attribute name is sequentially acquired from the overall style set of the target display card and added to the original style set, until the number of elements in the original style set is the same as the number of elements in the overall style set of the target display card, the adding operation of the original style set is completed.

5. The method for automatically combining a presentation page based on style attributes according to claim 4, wherein, The step of acquiring the attribute value corresponding to the current attribute name from the overall style set of the target display card and adding it to the original style set, specifically includes: Taking the current attribute name as the retrieval key field and the public style library as the retrieval source, the attribute value corresponding to the current attribute name is found and added to the original style set.

6. An apparatus for automatically assembling a presentation page based on style attributes, the apparatus comprising: a presentation page assembler configured to: receive a presentation page specification; and automatically assemble the presentation page based on the presentation page specification. It includes: The reference style acquisition module is used for acquiring a preset public style library and an overall style set of a target display card, wherein the public style library contains all preset basic components, and the overall style set includes attribute names and attribute values of basic components of styles of each lower-level component unit constituting the target display card. The original style acquisition module is used for acquiring an initialized original style set, and the initialized original style set includes initialized attribute names and attribute values of basic components of styles of each lower-level component unit. The target display card generation module is used for generating a target display card according to a page generation instruction, taking the overall style set of the target display card as a reference style, selecting corresponding basic components from the public style library, operating the original style set, and generating a target display card according to the final operation result of the original style set, wherein the step of operating the original style set specifically includes: According to the attribute name in the original style set and the attribute name in the overall style set of the target display card, comparison is performed to determine whether the attribute name in the original style set is completely contained in the overall style set of the target display card; If all the attribute names in the original style set are contained in the overall style set of the target display card, it is determined whether the attribute values corresponding to the attribute names in the original style set are the same as the attribute values corresponding to the attribute names in the overall style set of the target display card; if not, the corresponding attribute values are obtained to perform a replacement operation; if yes, attribute names not in the original style set are obtained from the overall style set of the target display card, and corresponding basic components are obtained from the common style library according to the attribute names and added to the original style set; If all the attribute names in the original style set are contained in the overall style set of the target display card, it is determined whether the attribute values corresponding to the attribute names in the original style set are the same as the attribute values corresponding to the attribute names in the overall style set of the target display card; if not, the corresponding attribute values are obtained to perform a replacement operation; if yes, attribute names not in the original style set are obtained from the overall style set of the target display card, and corresponding basic components are obtained from the common style library according to the attribute names and added to the original style set; The interface display page generation module is configured to perform page layout on each target display card according to a preset layout format, and generate an interface display page. 7.A computer device, comprising a memory and a processor, wherein the memory stores computer readable instructions, and the processor executes the computer readable instructions to implement the steps of the method for automatically combining a display page based on style attributes according to any one of claims 1 to 5.

8. A computer-readable storage medium, characterized in that, The computer readable storage medium stores computer readable instructions, and the computer readable instructions are executed by the processor to implement the steps of the method for automatically combining a display page based on style attributes according to any one of claims 1 to 5.

Citation Information

Patent Citations

  • Page switching method and device, server and storage medium

    CN112596845A