System interface generation method and device, electronic equipment and storage medium

Abstract

Embodiments of the invention provide a system interface generation method and apparatus, an electronic device and a storage medium. The method comprises the steps of receiving input data in a JSON format for preset data exchange; generating a data exchange JSON file based on the input data; converting the JSON file into a page file set, wherein the page file set comprises a cascading style sheet and a hypertext markup language file; and generating a system interface based on the cascading style sheet and the hypertext markup language file. The method comprises the following steps: taking a cascading style sheet and a hypertext markup language file as a set; one JSON file can comprise data of a cascading style sheet and a hypertext markup language file, so that the cascading style sheet and the hypertext markup language file can be obtained based on conversion of one JSON file, and the content and style of a page can be defined; the problems that a traditional cascading style sheet and a hypertext markup language file are poor in readability and high in splitting performance are solved. And a complete system interface can be automatically drawn through the JSON file.

Description

Technical Field

[0001] The present invention relates to the field of computer software technology, and in particular to a system interface generation method, a system interface generation device, an electronic device and a storage medium. Background Art

[0002] At present, the Internet industry is developing rapidly, and computer software has also become an important part of the Internet industry. In addition to project managers, the development of computer software often requires product managers, software front-end development engineers, software back-end development engineers, UI (User Interface) designers and software test engineers. However, when designing and developing software, there may be a lack of product managers and UI designers, and it is only completed by project managers and front-end and back-end development engineers. For users, the usability of software is largely determined by product managers and UI designers. Product managers will output product interface prototypes after user research, and UI designers will beautify product prototypes. However, since front-end R&D engineers blindly develop pages without prototypes, it is bound to lead to page layouts and symbol styles that are not beautiful enough, which will eventually lead to continuous rework and reconstruction by R&D engineers, directly affecting the progress of project development; and the traditional page rendering methods, cascading style sheets and hypertext markup language files, have poor readability and strong fragmentation. Summary of the invention

[0003] In view of the above problems, embodiments of the present invention are proposed to provide a system interface generation method, a system interface generation device, an electronic device and a storage medium that overcome the above problems or at least partially solve the above problems.

[0004] In order to solve the above problems, in a first aspect of the present invention, an embodiment of the present invention discloses a system interface generation method, comprising:

[0005] Receive input data in JSON format for preset data exchange;

[0006] Generate a data exchange JSON file based on the input data;

[0007] Convert the JSON file into a collection of page files, wherein the collection of page files includes a cascading style sheet and a hypertext markup language file;

[0008] A system interface is generated based on the cascading style sheet and the hypertext markup language file.

[0009] Optionally, the JSON format includes: a page name attribute and a template attribute; the template attribute includes: a template name attribute, a module type attribute, a template style attribute and a value attribute; the value attribute includes data object data.

[0010] Optionally, when the module type attribute is a table, the data object data includes a field name and a field type;

[0011] When the module type attribute is a normal box, the data object data includes a string type text;

[0012] When the module type attribute is an input box, the data object data includes the input box type and the input box display text;

[0013] When the module type attribute is a selection box, the data object data includes the selection box type and the selection box display text.

[0014] Optionally, the step of converting the JSON file into a collection of page files includes:

[0015] The JSON file is input into a preset classification model to generate a collection of page files.

[0016] Optionally, the preset classification model is trained by the following steps:

[0017] Get historical data;

[0018] Based on the JSON format, convert the historical data into JSON file information;

[0019] Mapping the cascading style sheets and hypertext markup language files in the historical data with the JSON file information to generate model training label data;

[0020] Mapping the hypertext markup language file in the historical data with the JSON file information to generate a label mapping dictionary;

[0021] The initial classification model is trained based on the label mapping dictionary, the model training label data and the JSON file information until a preset error condition is met, thereby generating the preset classification model.

[0022] Optionally, the step of training the initial classification model based on the label mapping dictionary, the model training label data and the JSON file information until a preset error condition is met, and generating the preset classification model includes:

[0023] Combining the label mapping dictionary, the model training label data and the JSON file information to generate a total data set;

[0024] The total data set is used to train the initial classification model until a preset error condition is met, thereby generating the preset classification model.

[0025] Optionally, the initial classification model includes a deterministic renderer, a neural network architecture Transformer model with a self-attention mechanism, and an aggregator.

[0026] In a second aspect of the present invention, an embodiment of the present invention discloses a system interface generating device, comprising:

[0027] A receiving module, used for receiving input data in a JSON format for a preset data exchange;

[0028] A generating module, used for generating a data exchange JSON file based on the input data;

[0029] A conversion module, used to convert the JSON file into a collection of page files, wherein the collection of page files includes a cascading style sheet and a hypertext markup language file;

[0030] The rendering module is used to generate a system interface based on the cascading style sheet and the hypertext markup language file.

[0031] According to a third aspect of the present invention, an embodiment of the present invention discloses an electronic device, comprising a processor, a memory, and a computer program stored in the memory and capable of running on the processor, wherein the computer program implements the steps of the system interface generation method as described above when executed by the processor.

[0032] In a fourth aspect of the present invention, an embodiment of the present invention discloses a computer-readable storage medium, on which a computer program is stored, and when the computer program is executed by a processor, the steps of the system interface generation method described above are implemented.

[0033] The embodiments of the present invention include the following advantages:

[0034] The embodiment of the present invention receives input data in a preset data exchange JSON format; generates a data exchange JSON file based on the input data; converts the JSON file into a page file collection, the page file collection includes a cascading style sheet and an hypertext markup language file; and generates a system interface based on the cascading style sheet and the hypertext markup language file. By treating the cascading style sheet and the hypertext markup language file as a collection; a JSON file can include the data of the cascading style sheet and the hypertext markup language file, so that the cascading style sheet and the hypertext markup language file can be converted based on a JSON file, the content and style of the page can be defined; the problem of poor readability and strong fragmentation of traditional cascading style sheets and hypertext markup language files is solved; and a complete system interface can be automatically drawn through the JSON file, which can improve project development efficiency. BRIEF DESCRIPTION OF THE DRAWINGS

[0035] Figure 1 It is a flow chart of steps of an embodiment of a system interface generation method of the present invention;

[0036] Figure 2 is a flowchart of another embodiment of a system interface generation method of the present invention;

[0037] Figure 3 It is a schematic diagram of a model training process of the present invention;

[0038] Figure 4 is a flowchart of an example of a method for generating a system interface according to the present invention;

[0039] Figure 5 It is a structural block diagram of an embodiment of a system interface generating device of the present invention;

[0040] Figure 6 is a structural block diagram of an electronic device provided by an embodiment of the present invention;

[0041] Figure 7 It is a structural block diagram of a storage medium provided by an embodiment of the present invention. DETAILED DESCRIPTION

[0042] In order to make the above-mentioned objects, features and advantages of the present invention more obvious and easy to understand, the present invention is further described in detail below with reference to the accompanying drawings and specific embodiments.

[0043] Reference Figure 1 , shows a flowchart of a method for generating a system interface according to an embodiment of the present invention, wherein the method for generating a system interface may specifically include the following steps:

[0044] Step 101, receiving input data in JSON format for preset data exchange;

[0045] In the embodiment of the present invention, a JSON format input file can be predefined, and relevant personnel can write various contents in the preset data exchange JSON format. Input data in the preset data exchange JSON format can be received.

[0046] The JSON data in the JSON format is expressed in the form of key-value pairs, and each key-value pair is separated by a comma.

[0047] The key is a string wrapped in double quotes; the value can be any type of JSON data type, including string, number, Boolean value, array, object, or null.

[0048] The data types in JSON format include the following:

[0049] String: A sequence of Unicode characters enclosed in double quotes.

[0050] Number: Integer or floating point number, no need to enclose in double quotes.

[0051] Boolean: A value that represents true or false.

[0052] Array: An ordered collection of values ​​enclosed in square brackets. Each value is separated by a comma. The value can be any type of JSON data type, including objects and arrays.

[0053] Object: A collection of key-value pairs enclosed in curly braces, with each key-value pair separated by commas. The key is a string and the value can be any type of JSON data type.

[0054] Null: indicates a null value or missing value and does not need to be enclosed in double quotes.

[0055] Step 102, generating a data exchange JSON file based on the input data;

[0056] Write specific values ​​for each attribute in the JSON format based on the input data to generate a complete JSON file.

[0057] Step 103, converting the JSON file into a collection of page files, wherein the collection of page files includes a cascading style sheet and a hypertext markup language file;

[0058] Then, based on the attribute contents in the JSON file, it can be converted into corresponding cascading style sheets and hypertext markup language files to generate a collection of page files.

[0059] Among them, Cascading Style Sheets (CSS) usually have the extension ".css". The file content contains a series of style rules, each of which consists of a selector and a group of declarations.

[0060] The selector is used to specify the HTML (Hypertext Markup Language) element to which the style is applied, while the declaration defines the specific style attributes and values. The selector includes the following:

[0061] Type selector: Selects elements based on the type of HTML element, such as p selects all paragraph elements.

[0062] Class selector: selects elements based on their class attribute, such as .classname selects all elements whose class is classname.

[0063] ID (identity) selector: selects elements based on their id attribute, such as #idname selects the element whose id is idname.

[0064] Descendant selectors, child selectors, attribute selectors, pseudo-class selectors, etc.: used to select elements more precisely.

[0065] Among them, Hypertext Markup Language is a file based on HTML (HyperText Markup Language). HTML files usually have the extension ".html" or ".htm". The file content contains a series of HTML tags, which are used to define the structure and content of the web page. The basic structure of an HTML document includes a document type declaration, a root element, a header element, and a body element. HTML tags can contain attributes, which provide additional information about the tag.

[0066] Step 104: Generate a system interface based on the cascading style sheet and the hypertext markup language file.

[0067] After obtaining the cascading style sheet and the hypertext markup language file, the cascading style sheet and the hypertext markup language file can be written into the files of the relevant project, and the corresponding files of the relevant project are compiled and rendered to generate the system interface.

[0068] The embodiment of the present invention receives input data in a preset data exchange JSON format; generates a data exchange JSON file based on the input data; converts the JSON file into a page file collection, the page file collection includes a cascading style sheet and an hypertext markup language file; and generates a system interface based on the cascading style sheet and the hypertext markup language file. By treating the cascading style sheet and the hypertext markup language file as a collection; a JSON file can include the data of the cascading style sheet and the hypertext markup language file, so that the cascading style sheet and the hypertext markup language file can be converted based on a JSON file, the content and style of the page can be defined; the problem of poor readability and strong fragmentation of traditional cascading style sheets and hypertext markup language files is solved; and a complete system interface can be automatically drawn through the JSON file, which can improve project development efficiency.

[0069] Reference Figure 2 , shows a flowchart of another embodiment of a system interface generation method of the present invention, wherein the system interface generation method may specifically include the following steps:

[0070] Step 201, receiving input data in a preset data exchange JSON format;

[0071] Input data for each attribute in the JSON format may be received to determine each content corresponding to the system interface to be generated.

[0072] In an optional embodiment of the present invention, the JSON format includes: a page name attribute and a template attribute; the template attribute includes: a template name attribute, a module type attribute, a template style attribute and a value attribute; the value attribute includes data object data.

[0073] In an embodiment of the present invention, the outermost layer of a single JSON format may include a page name attribute and a template attribute. For example, the page name attribute corresponds to the page name of the interface, that is, the specific value of the page name attribute is the interface name. The template attribute represents the attribute template of each item of the interface. The value of the template attribute is the specific content filled in the page.

[0074] For example, the page name attribute is the name attribute; the template attribute is the template attribute; the corresponding code example is:

[0075]

[0076] The template attributes can specifically include: template name attribute, module type attribute, template style attribute and value attribute. The template name attribute corresponds to the name of the template. The module type attribute corresponds to the type of the template; the template style attribute corresponds to the style of the template; and the value attribute is the specific value of each attribute in the template. That is, the template name attribute is used to describe the name of the current module, the module type attribute is used to describe the class of the current module, and the template style attribute is used to describe the style of the current module. The format of the template style attribute can be completely consistent with the CSS syntax, so that the position, size, color and other styles of the current module can be more clearly expressed; the value attribute is used to describe the content in the current module, and the value attribute includes data object data. The specific format can be determined according to the value of the module type attribute.

[0077] For example, the template name attribute is identified by the name attribute, the module type attribute is identified by the class attribute, the template style attribute is identified by the style attribute, and the numerical attribute is identified by the value attribute. The corresponding JSON format of the header menu bar is:

[0078]

[0079]

[0080] Specifically, when the module type attribute is a table, the data object data includes a field name and a field type;

[0081] When the module type attribute is a table, the value attribute of the table object is a list, which describes the fields of the table. The data object data includes the field name and field type. Therefore, the table can be rendered according to the field name and field type based on the value of the value attribute, and a table prototype can be generated.

[0082] The corresponding expression can be:

[0083]

[0084]

[0085] When the module type attribute is a normal box, the data object data includes a string type text;

[0086] When the module type attribute is a normal box, the value attribute of the normal box object is a string type text, which represents the content rendered in the current module. In addition to representing normal text content, normal boxes can also be used as buttons, links, etc. depending on the template style attributes. If the module type attribute is represented by class and the normal box is represented by Normal, an example is as follows:

[0087]

[0088] When the module type attribute is an input box, the data object data includes the input box type and the input box display text;

[0089] When the module type attribute is input box, the data object data includes two attributes: input box type and input box display text. Input box types can include ordinary single-line input box, rich text edit input box and password input box. Input box display text is the text content displayed in the box when no text is entered.

[0090] For example, the module type attribute is represented by class, the input box is represented by Input, the input box type is represented by type, and the input box display text is represented by text. "normal" represents a normal single-line input box, "area" represents a rich text edit input box, and "password" represents a password input box.

[0091] An example is as follows:

[0092]

[0093] When the module type attribute is a selection box, the data object data includes the selection box type and the selection box display text.

[0094] When the module type attribute is a selection box, the data object data includes the selection box type and the selection box display text. The selection box type can include single selection and multiple selection. The selection box display text is the text displayed in the selection box when no content is selected.

[0095] For example, the module type attribute is represented by class, the selection box is represented by select, the selection box type is represented by type, and the selection box display text is represented by text. There are two types, "normal" and "multi", which represent single selection and multiple selection respectively. An example is as follows:

[0096]

[0097]

[0098] Step 202, generating a data exchange JSON file based on the input data;

[0099] Write the input data and the value corresponding to each attribute into a file in JSON format to generate a JSON file.

[0100] Step 203, inputting the JSON file into a preset classification model to generate a page file collection, wherein the page file collection includes a cascading style sheet and a hypertext markup language file;

[0101] In the embodiment of the present invention, the JSON file can be used as an input to a preset classification model, and the preset classification model is used to fit and output the JSON file, thereby improving the efficiency and accuracy of generating the JSON file.

[0102] In an optional embodiment of the present invention, the preset classification model is trained through the following steps: obtaining historical data; converting the historical data into JSON file information based on the JSON format; mapping the cascading style sheets and hypertext markup language files in the historical data with the JSON file information to generate model training label data; mapping the hypertext markup language files in the historical data with the JSON file information to generate a label mapping dictionary; training the initial classification model based on the label mapping dictionary, the model training label data and the JSON file information until a preset error condition is met to generate the preset classification model.

[0103] In an embodiment of the present invention, historical data can be obtained; the historical data includes real css files and HTML files. The historical data can be converted according to the above-mentioned JSON format to generate corresponding JSON file information. The cascading style sheet and hypertext markup language file in the historical data are mapped with the JSON file information to generate model training label data; then the hypertext markup language file in the historical data is mapped with the JSON file information to generate a label mapping dictionary. Finally, the initial classification model is trained based on the label mapping dictionary, model training label data and JSON file information until the preset error condition is met to generate a preset classification model. The preset error condition can be determined according to the actual training requirements, and the embodiment of the present invention is not specifically limited. Among them, the initial classification model includes a deterministic renderer, a neural network architecture Transformer model of the self-attention mechanism, and an aggregator. That is, the initial classification model can be composed of a deterministic renderer, a Transformer model and an aggregator.

[0104] Specifically, the initial classification model is trained based on the label mapping dictionary, the model training label data and the JSON file information until a preset error condition is met, and the step of generating the preset classification model includes: combining the label mapping dictionary, the model training label data and the JSON file information to generate a total data set; using the total data set to train the initial classification model until a preset error condition is met, to generate the preset classification model.

[0105] In an embodiment of the present invention, a total data set can be generated by combining the signature mapping dictionary, model training label data and JSON file information; the input and output data are represented by the total data set. The initial classification model is trained using the total data set until a preset error condition is met, and a preset classification model is generated.

[0106] In order to make it clear to those skilled in the art, the model training ancient city in the embodiment of the present invention is described by an example. Figure 3 :

[0107] Step 1: Create a JSON template rule, that is, preset the JSON format.

[0108] Step 2: Generate model training output data. Deep learning models such as Transformer require repeated training and learning through a large amount of real web page data to obtain the best page layout effect. First, collect a large number of requirement documents and use JSON format to roughly write the JSON file content of each page, and store these file contents in the MongoDB document database. A JSON file of a complete page is used as a variable x. It should be noted that these JSON files only need to roughly describe the content of the component itself. For the "style" attribute, that is, the style attribute, you only need to write a rough description. The subsequent complete style css file is generated by the model.

[0109] Step 3, generate model training label data. The series of JSON files written in step 2 can only represent the approximate content of the page. They can indicate that there are labels, menus, tables, buttons on the page, and can also represent simple styles such as button color and menu font size. However, the specific layout information of each component on the page is not marked in the JSON file in the database. The specific layout position information needs to be obtained through model training. Therefore, complete page layout information needs to be added to the label of the training data. Real html and css files can be used as training labels. The front-end programmer needs to use the JSON file information obtained in step 2, combined with the real UI design draft, to restore the JSON file into html and css files, forming a mapping of a JSON file to a complete set of html and css files. The mapping of this set of html and css files is used as a label, and the html set Y = y1, y2, y3...y n and the css set Z = z1,z2,z3...z n Stored in MongoDB.

[0110] Step 4: Generate a label mapping dictionary. In the JSON file generated in step 2, there are some attributes that can completely determine the label of the HTML file. For example, when the class in the JSON file is Input, it means the input box, and the corresponding HTML must be " <input> ", and the attributes in the input tag can also be determined according to the content in the JSON file, so each class category can generate a certain html tag according to the corresponding attribute. The determined html tag part can be written as a mapping dictionary c1, c2, c3...c m , where m is the number of classes in the JSON format. After setting the mapping dictionaries, store them in MongoDB.

[0111] Step 5: Build a learning model and train it. A combination model of a deterministic renderer, a Transformer model, and an aggregator is used as the training model. The input of the model is a JSON file X = x1, x2, x3...x n and label mapping dictionary C = c1, c2, c3…c m The collection matrix Generally, the number of training files is greater than the number of attributes in the label mapping dictionary, so the extra parts are filled with 0 to make the length and width of the matrix consistent. Labels can be divided into html labels and css labels, forming a collection matrix of Finally, the input and output are combined to obtain the total data set

[0112] After the total data set is input into the model, it is first passed through the deterministic renderer. In the deterministic renderer, the class dictionary X of the JSON file set and the mapping dictionary C can be combined to obtain a certain html tag, and then the corresponding attributes are added to the html tag according to the type and value fields. If the JSON file contains a style attribute, a corresponding determined css file is generated, and the output determined html file vector is recorded as p = p1, p2, p3...p n , the determined css file vector is recorded as q=q1,q2,q3...q n Then the total input data set M is repeatedly trained through the Transformer model to obtain the trained html

[0113] ″″″″″

[0114] File vector p=p1,p2,p3...p n With the css file vector q=q1,q2,q3...q n Finally, these data are passed through the aggregator, and the trained html file vector and the determined html vector are combined to obtain the set P, and the trained css file vector and the determined css file vector are combined to obtain the set Q. P and Q are the final training output results. The average difference between P and Y can be defined as Where n is the number of training samples, For the output of a single html file p i The corresponding html file y i The number of errors is the sum of the number of html tag differences and the number of tag nesting errors. yi is the total number of html tags in the real html data; this scheme defines the average difference between Q and Z as Where n is the number of training samples, For the output of a single css file qi Corresponding to the real css file z i The number of errors is the sum of the number of CSS attribute differences and the number of CSS attribute errors. is the total number of CSS attributes in the real CSS data. The total difference between Html and CSS is D = Δ html +Δ css ,

[0115] When the sum of the difference between P and Y and the difference between Q and Z is small enough, that is, D reaches the error standard, the model training is completed.

[0116] Step 204: Generate a system interface based on the cascading style sheet and the hypertext markup language file.

[0117] After obtaining the cascading style sheet and the hypertext markup language file, the cascading style sheet and the hypertext markup language file can be written into the files of the relevant project, and the corresponding files of the relevant project are compiled and rendered to generate the system interface.

[0118] The embodiment of the present invention receives input data in JSON format for preset data exchange; generates a data exchange JSON file based on the input data; inputs the JSON file into a preset classification model to generate a page file collection, the page file collection includes a cascading style sheet and an hypertext markup language file; and generates a system interface based on the cascading style sheet and the hypertext markup language file. By treating the cascading style sheet and the hypertext markup language file as a collection; a JSON file can include the data of the cascading style sheet and the hypertext markup language file, so that the cascading style sheet and the hypertext markup language file can be converted based on a JSON file, the content and style of the page can be defined; the problem of poor readability and strong fragmentation of traditional cascading style sheets and hypertext markup language files is solved; and a complete system interface can be automatically drawn through the JSON file, which can improve project development efficiency. A neural network model composed of a deterministic renderer, Transformer model and aggregator was also established for training and use. It can generate complete cascading style sheets and hypertext markup language files based on the defined page JSON file, and the style and layout are automatically generated, which solves the problem that front-end programmers have poor control over the overall layout and style in the absence of prototype diagrams and the steps for writing CSS style files are cumbersome.

[0119] In order to make the implementation process of the embodiment of the present invention clear to those skilled in the art, an example is used to illustrate the following:

[0120] You can refer to Figure 4First, write a JSON file according to the template rules (preset JSON format). Then input the JSON file into the renderer, transformer and aggregator model to generate Html and css files. Finally, render the web page based on the Html and css files to achieve web page generation.

[0121] It should be noted that, for the sake of simplicity, the method embodiments are described as a series of action combinations, but those skilled in the art should be aware that the embodiments of the present invention are not limited by the order of the actions described, because according to the embodiments of the present invention, certain steps can be performed in other orders or simultaneously. Secondly, those skilled in the art should also be aware that the embodiments described in the specification are all preferred embodiments, and the actions involved are not necessarily required by the embodiments of the present invention.

[0122] Reference Figure 5 , shows a structural block diagram of an embodiment of a system interface generation device of the present invention, and the system interface generation device may specifically include the following modules:

[0123] The receiving module 501 is used to receive input data in a preset data exchange JSON format;

[0124] A generating module 502, configured to generate a data exchange JSON file based on the input data;

[0125] A conversion module 503, used to convert the JSON file into a collection of page files, wherein the collection of page files includes a cascading style sheet and a hypertext markup language file;

[0126] The rendering module 504 is used to generate a system interface based on the cascading style sheet and the hypertext markup language file.

[0127] In an optional embodiment of the present invention, the JSON format includes: a page name attribute and a template attribute; the template attribute includes: a template name attribute, a module type attribute, a template style attribute and a value attribute; the value attribute includes data object data.

[0128] In an optional embodiment of the present invention, when the module type attribute is a table, the data object data includes a field name and a field type;

[0129] When the module type attribute is a normal box, the data object data includes a string type text;

[0130] When the module type attribute is an input box, the data object data includes the input box type and the input box display text;

[0131] When the module type attribute is a selection box, the data object data includes the selection box type and the selection box display text.

[0132] In an optional embodiment of the present invention, the conversion module 503 includes:

[0133] The conversion submodule is used to input the JSON file into a preset classification model to generate a collection of page files.

[0134] In an optional embodiment of the present invention, the preset classification model is trained by the following steps:

[0135] Get historical data;

[0136] Based on the JSON format, convert the historical data into JSON file information;

[0137] Mapping the cascading style sheets and hypertext markup language files in the historical data with the JSON file information to generate model training label data;

[0138] Mapping the hypertext markup language file in the historical data with the JSON file information to generate a label mapping dictionary;

[0139] The initial classification model is trained based on the label mapping dictionary, the model training label data and the JSON file information until a preset error condition is met, thereby generating the preset classification model.

[0140] In an optional embodiment of the present invention, the step of training the initial classification model based on the label mapping dictionary, the model training label data and the JSON file information until a preset error condition is met, and generating the preset classification model includes:

[0141] Combining the label mapping dictionary, the model training label data and the JSON file information to generate a total data set;

[0142] The total data set is used to train the initial classification model until a preset error condition is met, thereby generating the preset classification model.

[0143] In an optional embodiment of the present invention, the initial classification model includes a deterministic renderer, a neural network architecture Transformer model with a self-attention mechanism, and an aggregator.

[0144] The embodiment of the present invention receives input data in a preset data exchange JSON format; generates a data exchange JSON file based on the input data; converts the JSON file into a page file collection, the page file collection includes a cascading style sheet and an hypertext markup language file; and generates a system interface based on the cascading style sheet and the hypertext markup language file. By treating the cascading style sheet and the hypertext markup language file as a collection; a JSON file can include the data of the cascading style sheet and the hypertext markup language file, so that the cascading style sheet and the hypertext markup language file can be converted based on a JSON file, the content and style of the page can be defined; the problem of poor readability and strong fragmentation of traditional cascading style sheets and hypertext markup language files is solved; and a complete system interface can be automatically drawn through the JSON file, which can improve project development efficiency.

[0145] As for the device embodiment, since it is basically similar to the method embodiment, the description is relatively simple, and the relevant parts can be referred to the partial description of the method embodiment.

[0146] Reference Figure 6 , an embodiment of the present invention further provides an electronic device, including:

[0147] A processor 601 and a storage medium 602, wherein the storage medium 602 stores a computer program executable by the processor 601, and when the electronic device is running, the processor 601 executes the computer program to perform the system interface generation method as described in any one of the embodiments of the present invention.

[0148] The system interface generation method comprises:

[0149] Receive input data in JSON format for preset data exchange;

[0150] Generate a data exchange JSON file based on the input data;

[0151] Convert the JSON file into a collection of page files, wherein the collection of page files includes a cascading style sheet and a hypertext markup language file;

[0152] A system interface is generated based on the cascading style sheet and the hypertext markup language file.

[0153] Optionally, the JSON format includes: a page name attribute and a template attribute; the template attribute includes: a template name attribute, a module type attribute, a template style attribute and a value attribute; the value attribute includes data object data.

[0154] Optionally, when the module type attribute is a table, the data object data includes a field name and a field type;

[0155] When the module type attribute is a normal box, the data object data includes a string type text;

[0156] When the module type attribute is an input box, the data object data includes the input box type and the input box display text;

[0157] When the module type attribute is a selection box, the data object data includes the selection box type and the selection box display text.

[0158] Optionally, the step of converting the JSON file into a collection of page files includes:

[0159] The JSON file is input into a preset classification model to generate a collection of page files.

[0160] Optionally, the preset classification model is trained by the following steps:

[0161] Get historical data;

[0162] Based on the JSON format, convert the historical data into JSON file information;

[0163] Mapping the cascading style sheets and hypertext markup language files in the historical data with the JSON file information to generate model training label data;

[0164] Mapping the hypertext markup language file in the historical data with the JSON file information to generate a label mapping dictionary;

[0165] The initial classification model is trained based on the label mapping dictionary, the model training label data and the JSON file information until a preset error condition is met, thereby generating the preset classification model.

[0166] Optionally, the step of training the initial classification model based on the label mapping dictionary, the model training label data and the JSON file information until a preset error condition is met, and generating the preset classification model includes:

[0167] Combining the label mapping dictionary, the model training label data and the JSON file information to generate a total data set;

[0168] The total data set is used to train the initial classification model until a preset error condition is met, thereby generating the preset classification model.

[0169] Optionally, the initial classification model includes a deterministic renderer, a neural network architecture Transformer model with a self-attention mechanism, and an aggregator.

[0170] The embodiment of the present invention receives input data in a preset data exchange JSON format; generates a data exchange JSON file based on the input data; converts the JSON file into a page file collection, the page file collection includes a cascading style sheet and an hypertext markup language file; and generates a system interface based on the cascading style sheet and the hypertext markup language file. By treating the cascading style sheet and the hypertext markup language file as a collection; a JSON file can include the data of the cascading style sheet and the hypertext markup language file, so that the cascading style sheet and the hypertext markup language file can be converted based on a JSON file, the content and style of the page can be defined; the problem of poor readability and strong fragmentation of traditional cascading style sheets and hypertext markup language files is solved; and a complete system interface can be automatically drawn through the JSON file, which can improve project development efficiency.

[0171] The memory may include a random access memory (RAM) or a non-volatile memory, such as at least one disk memory. Optionally, the memory may also be at least one storage device located away from the processor.

[0172] The above-mentioned processor can be a general-purpose processor, including a central processing unit (CPU), a network processor (NP), etc.; it can also be a digital signal processor (DSP), an application specific integrated circuit (ASIC), a field programmable gate array (FPGA) or other programmable logic devices, discrete gate or transistor logic devices, discrete hardware components.

[0173] Reference Figure 7 The embodiment of the present invention further provides a computer-readable storage medium 701, on which a computer program is stored. When the computer program is executed by a processor, the system interface generation method as described in any one of the embodiments of the present invention is executed.

[0174] The system interface generation method comprises:

[0175] Receive input data in JSON format for preset data exchange;

[0176] Generate a data exchange JSON file based on the input data;

[0177] Convert the JSON file into a collection of page files, wherein the collection of page files includes a cascading style sheet and a hypertext markup language file;

[0178] A system interface is generated based on the cascading style sheet and the hypertext markup language file.

[0179] Optionally, the JSON format includes: a page name attribute and a template attribute; the template attribute includes: a template name attribute, a module type attribute, a template style attribute and a value attribute; the value attribute includes data object data.

[0180] Optionally, when the module type attribute is a table, the data object data includes a field name and a field type;

[0181] When the module type attribute is a normal box, the data object data includes a string type text;

[0182] When the module type attribute is an input box, the data object data includes the input box type and the input box display text;

[0183] When the module type attribute is a selection box, the data object data includes the selection box type and the selection box display text.

[0184] Optionally, the step of converting the JSON file into a collection of page files includes:

[0185] The JSON file is input into a preset classification model to generate a collection of page files.

[0186] Optionally, the preset classification model is trained by the following steps:

[0187] Get historical data;

[0188] Based on the JSON format, convert the historical data into JSON file information;

[0189] Mapping the cascading style sheets and hypertext markup language files in the historical data with the JSON file information to generate model training label data;

[0190] Mapping the hypertext markup language file in the historical data with the JSON file information to generate a label mapping dictionary;

[0191] The initial classification model is trained based on the label mapping dictionary, the model training label data and the JSON file information until a preset error condition is met, thereby generating the preset classification model.

[0192] Optionally, the step of training the initial classification model based on the label mapping dictionary, the model training label data and the JSON file information until a preset error condition is met, and generating the preset classification model includes:

[0193] Combining the label mapping dictionary, the model training label data and the JSON file information to generate a total data set;

[0194] The total data set is used to train the initial classification model until a preset error condition is met, thereby generating the preset classification model.

[0195] Optionally, the initial classification model includes a deterministic renderer, a neural network architecture Transformer model with a self-attention mechanism, and an aggregator.

[0196] The embodiment of the present invention receives input data in a preset data exchange JSON format; generates a data exchange JSON file based on the input data; converts the JSON file into a page file collection, the page file collection includes a cascading style sheet and an hypertext markup language file; and generates a system interface based on the cascading style sheet and the hypertext markup language file. By treating the cascading style sheet and the hypertext markup language file as a collection; a JSON file can include the data of the cascading style sheet and the hypertext markup language file, so that the cascading style sheet and the hypertext markup language file can be converted based on a JSON file, the content and style of the page can be defined; the problem of poor readability and strong fragmentation of traditional cascading style sheets and hypertext markup language files is solved; and a complete system interface can be automatically drawn through the JSON file, which can improve project development efficiency.

[0197] The various embodiments in this specification are described in a progressive manner, and each embodiment focuses on the differences from other embodiments. The same or similar parts between the various embodiments can be referenced to each other.

[0198] It will be appreciated by those skilled in the art that the embodiments of the present invention may be provided as methods, devices, or computer program products. Therefore, the embodiments of the present invention may take the form of a complete hardware embodiment, a complete software embodiment, or an embodiment combining software and hardware. Moreover, the embodiments of the present invention may take the form of a computer program product implemented on one or more computer-usable storage media (including but not limited to disk storage, CD-ROM, optical storage, etc.) containing computer-usable program codes.

[0199] The embodiments of the present invention are described with reference to the flowcharts and / or block diagrams of the methods, terminal devices (systems), and computer program products according to the embodiments of the present invention. It should be understood that each process and / or block in the flowchart and / or block diagram, as well as the combination of the processes and / or blocks in the flowchart and / or block diagram, can be implemented by computer program instructions. These computer program instructions can be provided to a processor of a general-purpose computer, a special-purpose computer, an embedded processor, or other programmable data processing terminal device to generate a machine, so that the instructions executed by the processor of the computer or other programmable data processing terminal device generate instructions for implementing the processes in the flowchart and / or block diagram. Figure 1 A process or multiple processes and / or boxes Figure 1 A device that provides the functions specified in a block or multiple blocks.

[0200] These computer program instructions may also be stored in a computer-readable memory capable of directing a computer or other programmable data processing terminal device to operate in a specific manner, so that the instructions stored in the computer-readable memory produce a manufactured product including an instruction device, which implements the process Figure 1 A process or multiple processes and / or boxes Figure 1 A function specified in one or more boxes.

[0201] These computer program instructions can also be loaded onto a computer or other programmable data processing terminal device so that a series of operating steps are executed on the computer or other programmable terminal device to produce a computer-implemented process, thereby providing instructions for executing on the computer or other programmable terminal device to implement the process. Figure 1 A process or multiple processes and / or boxes Figure 1 The steps for the functions specified in one or more boxes.

[0202] Although the preferred embodiments of the present invention have been described, those skilled in the art may make additional changes and modifications to these embodiments once they have learned the basic creative concept. Therefore, the appended claims are intended to be interpreted as including the preferred embodiments and all changes and modifications that fall within the scope of the embodiments of the present invention.

[0203] Finally, it should be noted that, in this article, relational terms such as first and second, etc. are only used to distinguish one entity or operation from another entity or operation, and do not necessarily require or imply any such actual relationship or order between these entities or operations. Moreover, the terms "include", "comprise" or any other variants thereof are intended to cover non-exclusive inclusion, so that a process, method, article or terminal device including a series of elements includes not only those elements, but also other elements not explicitly listed, or also includes elements inherent to such process, method, article or terminal device. In the absence of further restrictions, the elements defined by the sentence "comprise a ..." do not exclude the existence of other identical elements in the process, method, article or terminal device including the elements.

[0204] The system interface generation method, the system interface generation device, the electronic device and the storage medium provided by the present invention are introduced in detail above. The principle and implementation mode of the present invention are explained in this article by using specific examples. The description of the above embodiments is only used to help understand the method of the present invention and its core idea. At the same time, for the general technical personnel in this field, according to the idea of ​​the present invention, there will be changes in the specific implementation mode and the scope of application. In summary, the content of this specification should not be understood as limiting the present invention.

Claims

1. A system interface generation method, characterized in that: include: Receive input data in JSON format for preset data exchange; Generate a data exchange JSON file based on the input data; Convert the JSON file into a collection of page files, wherein the collection of page files includes a cascading style sheet and a hypertext markup language file; A system interface is generated based on the cascading style sheet and the hypertext markup language file.

2. The method according to claim 1, characterized in that The JSON format includes: a page name attribute and a template attribute; the template attribute includes: a template name attribute, a module type attribute, a template style attribute and a value attribute; the value attribute includes data object data.

3. The method according to claim 2, characterized in that When the module type attribute is a table, the data object data includes a field name and a field type; When the module type attribute is a normal box, the data object data includes a string type text; When the module type attribute is an input box, the data object data includes the input box type and the input box display text; When the module type attribute is a selection box, the data object data includes the selection box type and the selection box display text.

4. The method according to claim 1, characterized in that: The step of converting the JSON file into a collection of page files includes: The JSON file is input into a preset classification model to generate a collection of page files.

5. The method according to claim 4, characterized in that The preset classification model is trained by the following steps: Get historical data; Based on the JSON format, convert the historical data into JSON file information; Mapping the cascading style sheets and hypertext markup language files in the historical data with the JSON file information to generate model training label data; Mapping the hypertext markup language file in the historical data with the JSON file information to generate a label mapping dictionary; The initial classification model is trained based on the label mapping dictionary, the model training label data and the JSON file information until a preset error condition is met, thereby generating the preset classification model.

6. The method according to claim 5, characterized in that The step of training the initial classification model based on the label mapping dictionary, the model training label data and the JSON file information until a preset error condition is met, and generating the preset classification model comprises: Combining the label mapping dictionary, the model training label data and the JSON file information to generate a total data set; The total data set is used to train the initial classification model until a preset error condition is met, thereby generating the preset classification model.

7. The method according to claim 5, characterized in that The initial classification model includes a deterministic renderer, a neural network architecture Transformer model with a self-attention mechanism, and an aggregator.

8. A system interface generation device, characterized in that: include: A receiving module, used for receiving input data in a JSON format for a preset data exchange; A generation module, used for generating a data exchange JSON file based on the input data; A conversion module, used to convert the JSON file into a collection of page files, wherein the collection of page files includes a cascading style sheet and a hypertext markup language file; The rendering module is used to generate a system interface based on the cascading style sheet and the hypertext markup language file.

9. An electronic device, characterized in that: The method comprises a processor, a memory and a computer program stored in the memory and capable of running on the processor, wherein the computer program implements the steps of the system interface generation method according to any one of claims 1 to 7 when executed by the processor.

10. 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 a processor, the steps of generating a system interface according to any one of claims 1 to 7 are implemented.

Images