Code generation method and device, computer equipment and storage medium

Abstract

The invention relates to the technical field of artificial intelligence, can be applied to service system platforms of medical health, financial science and technology and the like, and discloses a code generation method and device, computer equipment and a storage medium. A design file of a target project is obtained, the design file is analyzed, and element features of all design elements in the design file are extracted; on the basis of the element features, clustering processing is carried out on the design elements, and a clustering result is obtained; constructing an intermediate representation of the design file based on the clustering result; according to a preset code conversion strategy, converting the intermediate representation into a runnable code corresponding to the target project; therefore, the efficiency and accuracy of software project development can be effectively improved.

Description

Technical Field

[0001] This invention relates to the field of artificial intelligence technology, and specifically to a code generation method, apparatus, computer device, and computer-readable storage medium. Background Technology

[0002] Currently, front-end development is a crucial step in modern software development. Front-end developers need to convert design files (such as Sketch, Figma, etc.) provided by designers into executable front-end code (such as HTML, CSS, JavaScript, etc.). However, in existing software development processes, front-end developers often need to manually parse design files, extract and analyze the features of design elements, and then manually write executable front-end code accordingly. This process is not only time-consuming and labor-intensive but also prone to errors, failing to achieve full automation from design files to executable code. Furthermore, manual coding can lead to inconsistent code quality, non-compliance with best practices and standards, and negatively impact the accuracy, maintainability, and scalability of the project.

[0003] In the healthcare field, software application development must meet stringent compliance and accuracy requirements. The user interface (UI) design of medical software must not only conform to the operating habits of healthcare professionals but also ensure the accuracy and readability of information. For example, the user interfaces of medical record systems, telemedicine platforms, and medical devices all need to accurately reflect the design intent to ensure the accuracy and safety of medical procedures. Manually converting design documents into code is not only inefficient but may also introduce errors, affecting the reliability and compliance of medical software.

[0004] In the fintech field, software application development requires rapid response to market changes while ensuring high-quality and secure code. Fintech software user interfaces need to provide an intuitive user experience while ensuring the security and accuracy of transaction data. For example, mobile payment applications, online banking platforms, and financial analysis tools all need to precisely implement the functions and layouts specified in the design documents. Manually writing code is not only time-consuming but can also lead to inconsistent code quality, affecting the reliability and security of financial software.

[0005] Therefore, how to provide a code generation method, apparatus, computer device, and computer-readable storage medium to effectively improve the efficiency and accuracy of software project development is a problem that urgently needs to be solved by those skilled in the art. Summary of the Invention

[0006] In view of the shortcomings of the prior art, the purpose of this invention is to provide a code generation method, apparatus, computer device and computer-readable storage medium, aiming to solve the problem of how to effectively improve the efficiency and accuracy of software project development.

[0007] To achieve the above objectives, the present invention adopts the following technical solution:

[0008] In a first aspect, the present invention provides a code generation method, comprising:

[0009] Obtain the design files of the target project, parse the design files, and extract the element features of each design element in the design files;

[0010] Based on the aforementioned element characteristics, clustering is performed on each of the design elements to obtain clustering results;

[0011] Based on the clustering results, an intermediate representation of the design document is constructed;

[0012] According to a preset code conversion strategy, the intermediate representation is converted into the executable code corresponding to the target project.

[0013] Secondly, the present invention provides a code generation apparatus, comprising:

[0014] The acquisition module is used to acquire the design files of the target project, parse the design files, and extract the element features of each design element in the design files;

[0015] The clustering module is used to perform clustering processing on each of the design elements based on the element characteristics to obtain clustering results;

[0016] A construction module is used to construct an intermediate representation of the design file based on the clustering results;

[0017] The conversion module is used to convert the intermediate representation into executable code corresponding to the target project according to a preset code conversion strategy.

[0018] Thirdly, the present invention provides a computer device, including a memory, a processor, and a computer program stored in the memory and executable on the processor, wherein the processor executes the computer program to implement the code generation method described above.

[0019] Fourthly, the present invention provides a computer-readable storage medium storing a computer program, wherein the computer program, when executed by a processor, implements the code generation method described above.

[0020] Compared to existing technologies, this invention provides a code generation method, apparatus, computer device, and computer-readable storage medium. The method involves acquiring a design file for a target project, parsing the design file, and extracting element features of each design element. Based on these element features, the design elements are clustered to obtain clustering results. Based on the clustering results, an intermediate representation of the design file is constructed. According to a preset code conversion strategy, the intermediate representation is converted into executable code corresponding to the target project. Therefore, this invention effectively improves the efficiency and accuracy of software project development. Attached Figure Description

[0021] To more clearly illustrate the technical solutions in the embodiments of the present invention or the prior art, the drawings used in the description of the embodiments or the prior art will be briefly introduced below. Obviously, the drawings described below are only some embodiments recorded in the present invention. For those skilled in the art, other drawings can be obtained based on these drawings without creative effort.

[0022] Figure 1 This is a schematic diagram illustrating the application environment of a code generation method provided in an embodiment of the present invention.

[0023] Figure 2 This is a flowchart illustrating a code generation method according to an embodiment of the present invention.

[0024] Figure 3 This is a schematic diagram of a program module of a code generation device provided in an embodiment of the present invention.

[0025] Figure 4 This is a schematic diagram of the structure of a computer device provided in an embodiment of the present invention.

[0026] Figure 5 This is another structural schematic diagram of a computer device provided in an embodiment of the present invention. Detailed Implementation

[0027] The technical solutions of the embodiments of the present invention will be clearly and completely described below with reference to the accompanying drawings. Obviously, the described embodiments are only some, not all, of the embodiments of the present invention. Based on the embodiments of the present invention, all other embodiments obtained by those skilled in the art without creative effort are within the scope of protection of the present invention.

[0028] It should be understood that, when used in this specification and the appended claims, the term "comprising" indicates the presence of the described features, integrals, steps, operations, elements and / or components, but does not exclude the presence or addition of one or more other features, integrals, steps, operations, elements, components and / or collections thereof.

[0029] It should also be understood that the term “and / or” as used in this specification and the appended claims refers to any combination of one or more of the associated listed items and all possible combinations, and includes such combinations.

[0030] As used in this specification and the appended claims, the term "if" may be interpreted, depending on the context, as "when," "once," "in response to determination," or "in response to detection." Similarly, the phrase "if determined" or "if [the described condition or event] is detected" may be interpreted, depending on the context, as meaning "once determined," "in response to determination," "once [the described condition or event] is detected," or "in response to detection of [the described condition or event]."

[0031] Furthermore, in the description of this invention and the appended claims, the terms "first," "second," "third," etc., are used only to distinguish descriptions and should not be construed as indicating or implying relative importance.

[0032] References to "one embodiment" or "some embodiments" as described in this specification mean that one or more embodiments of the invention include a specific feature, structure, or characteristic described in connection with that embodiment. Therefore, the phrases "in one embodiment," "in some embodiments," "in other embodiments," "in still other embodiments," etc., appearing in different parts of this specification do not necessarily refer to the same embodiment, but rather mean "one or more, but not all, embodiments," unless otherwise specifically emphasized. The terms "comprising," "including," "having," and variations thereof mean "including but not limited to," unless otherwise specifically emphasized.

[0033] It should be understood that the sequence number of each step in the following embodiments does not imply the order of execution. The execution order of each process should be determined by its function and internal logic, and should not constitute any limitation on the implementation process of the embodiments of the present invention.

[0034] To illustrate the technical solution of the present invention, specific embodiments are described below.

[0035] An embodiment of the present invention provides a code generation method that can be applied to, for example... Figure 1In the application environment shown, the client and server communicate via a network. The client includes, but is not limited to, handheld computers, desktop computers, laptops, ultra-mobile personal computers (UMPCs), netbooks, cloud computing devices, and personal digital assistants (PDAs). The server can be a standalone server or a cloud server providing basic cloud computing services such as cloud services, cloud databases, cloud computing, cloud functions, cloud storage, network services, cloud communications, middleware services, domain name services, security services, content delivery networks (CDNs), and big data and artificial intelligence platforms.

[0036] Please see Figure 2 An embodiment of the present invention provides a code generation method, wherein the method includes the following steps:

[0037] S100. Obtain the design file of the target project, parse the design file, and extract the element features of each design element in the design file;

[0038] S200. Based on the element characteristics, cluster the design elements to obtain clustering results;

[0039] S300. Based on the clustering results, construct an intermediate representation of the design document;

[0040] S400. According to the preset code conversion strategy, the intermediate representation is converted into the executable code corresponding to the target project.

[0041] In practice, the code generation method of this embodiment significantly improves the efficiency and accuracy of software project development through automated and intelligent processing. Specifically:

[0042] 1. Automated parsing and feature extraction (S100):

[0043] This method eliminates the tedious process of manually parsing design documents by automatically analyzing them and extracting the features of design elements. This not only saves significant time and manpower but also reduces inaccuracies caused by human error. Automated extraction ensures that the features of all design elements are accurately identified and recorded, providing a solid foundation for subsequent steps.

[0044] 2. Intelligent clustering processing (S200):

[0045] Based on extracted element features, this method uses intelligent clustering to automatically identify the spatial relationships and hierarchical structure between design elements. This automated clustering process not only improves the efficiency of layout analysis but also ensures the accuracy of clustering results through optimized clustering algorithms. Intelligent clustering can identify elements with similar characteristics, thus providing a scientific basis for constructing a reasonable layout structure and reducing the complexity and error rate of manual layout analysis.

[0046] 3. Intermediate representation construction (S300):

[0047] One of the core innovations of this method is the construction of intermediate representations. By transforming clustering results into intermediate representations, this method provides a unified and structured description of the layout and style information of design documents. This intermediate representation not only supports multi-level component nesting and reuse but also flexibly adapts to different target code formats. The construction of intermediate representations makes the code generation process more modular and standardized, improving the efficiency and accuracy of code generation.

[0048] 4. Code Conversion and Generation (S400):

[0049] Based on a pre-defined code transformation strategy, the intermediate representation is converted into executable code corresponding to the target project. This process not only automates code generation but also ensures the quality and consistency of the generated code through the pre-defined transformation strategy. Support for multiple target formats (such as HTML / CSS, schema configurations for low-code platforms, etc.) makes this method widely applicable and can meet the needs of different projects. Automated code generation reduces the workload of manually writing code, reduces code quality issues caused by human error, and improves the accuracy, maintainability, and scalability of the project.

[0050] In other words, through the synergistic effect of the above steps, the code generation method of this invention achieves full-process automation from design documents to runnable code. This automated process not only significantly improves development efficiency but also reduces error rates by minimizing human intervention, ensuring code quality, accuracy, and consistency. In practical applications, this method helps development teams transform designs into actual products more quickly, while guaranteeing high product quality and reliability.

[0051] Understandably, the code generation method provided in this embodiment of the invention can be applied to code generation scenarios related to the medical and health field. The following is a specific example:

[0052] Application Background:

[0053] In the healthcare field, software application development must meet stringent compliance and accuracy requirements. For example, the user interfaces of electronic health record systems (EHRs), telemedicine platforms, and medical devices need to accurately reflect the design intent to ensure the accuracy and safety of medical procedures. Manually converting design documents into code is not only inefficient but can also introduce errors, impacting the reliability and compliance of healthcare software.

[0054] Specific examples:

[0055] Suppose a healthcare project requires the development of a telemedicine platform, including functions such as patient information entry, video consultation, and medical record retrieval. Designers used Sketch to design the user interface, and front-end developers need to convert these design files into executable front-end code.

[0056] 1. Obtain the design files of the target project, parse the design files, and extract the element features of each design element in the design files:

[0057] Developers obtain Sketch design files through the API interface.

[0058] The parser extracts structural information such as pages, artboards, and layers from the design file, as well as the geometric properties (such as position and size) and style properties (such as color, border, and shadow) of each layer.

[0059] 2. Based on the aforementioned element characteristics, cluster the design elements to obtain the clustering results:

[0060] The improved DBSCAN algorithm is used to spatially cluster design elements to determine the layout relationships between them.

[0061] For example, cluster buttons and text boxes in the video consultation interface into a group, ensuring that they maintain consistent spacing and alignment in the layout.

[0062] 3. Based on the clustering results, construct the intermediate representation of the design document:

[0063] Construct a hierarchical layout tree structure, where each node represents a design element, and the relationships between nodes represent the hierarchical relationships between elements.

[0064] The intermediate representation includes semantic component information, layout rules, style attributes, etc., to ensure that the subsequent code generator can understand and process it.

[0065] 4. Based on a preset code conversion strategy, convert the intermediate representation into executable code corresponding to the target project:

[0066] Based on a preset code conversion strategy, the intermediate representation is converted into HTML / CSS code.

[0067] The generated code conforms to best practices and standards in the healthcare industry, ensuring the accuracy and ease of use of the user interface.

[0068] Technical effects:

[0069] Through automated and intelligent code generation methods, development teams can quickly convert design documents into high-quality front-end code, reducing the workload and error rate of manual coding. This not only improves development efficiency but also ensures the reliability and compliance of medical software, contributing to enhanced patient experience and the quality of healthcare services.

[0070] Understandably, the code generation method provided in this embodiment of the invention can also be applied to code generation scenarios related to the fintech field. The following is a specific example:

[0071] Application Background:

[0072] In the fintech field, software application development requires rapid response to market changes while ensuring high-quality and secure code. For example, mobile payment applications, online banking platforms, and financial analytics tools all need to precisely implement the functionality and layout specified in the design documents. Manually writing code is not only time-consuming but can also lead to inconsistent code quality, impacting the performance and security of financial software.

[0073] Specific examples:

[0074] Suppose a fintech project requires the development of a mobile payment application, including features such as user login, payment processing, and transaction history retrieval. The designer used Figma to design the user interface, and the front-end developers need to convert these design files into working front-end code.

[0075] 1. Obtain the design files of the target project, parse the design files, and extract the element features of each design element in the design files:

[0076] Developers obtain Figma design files through the API interface.

[0077] The parser extracts structural information such as pages, artboards, and layers from the design file, as well as the geometric properties (such as position and size) and style properties (such as color, border, and shadow) of each layer.

[0078] 2. Based on the aforementioned element characteristics, cluster the design elements to obtain the clustering results:

[0079] The improved DBSCAN algorithm is used to spatially cluster design elements to determine the layout relationships between them.

[0080] For example, cluster input fields and buttons on the payment page into a group, ensuring they maintain consistent spacing and alignment in the layout.

[0081] 3. Based on the clustering results, construct the intermediate representation of the design document:

[0082] Construct a hierarchical layout tree structure, where each node represents a design element, and the relationships between nodes represent the hierarchical relationships between elements.

[0083] The intermediate representation includes semantic component information, layout rules, style attributes, etc., to ensure that the subsequent code generator can understand and process it.

[0084] 4. Based on a preset code conversion strategy, convert the intermediate representation into executable code corresponding to the target project:

[0085] Based on a preset code conversion strategy, the intermediate representation is converted into HTML / CSS code.

[0086] The generated code conforms to best practices and standards in the fintech industry, ensuring the accuracy and security of the user interface.

[0087] Technical effects:

[0088] Through automated and intelligent code generation methods, development teams can quickly convert design documents into high-quality front-end code, reducing the workload and error rate of manual coding. This not only improves development efficiency but also ensures the performance and security of financial software, contributing to enhanced user experience and market competitiveness.

[0089] Through the specific application examples in the two fields mentioned above, it can be seen that the code generation method of the present invention can significantly improve development efficiency and code quality in the fields of healthcare and fintech, and has broad application prospects and practical value.

[0090] Furthermore, in one embodiment, the code generation method, wherein obtaining the design file of the target project, parsing the design file, and extracting the element features of each design element in the design file specifically includes the following steps:

[0091] Obtain the design files of the target project through a pre-configured API interface;

[0092] The design documents are preprocessed;

[0093] The pre-configured parser is used to parse the pre-processed design file and extract the element features of each design element in the pre-processed design file.

[0094] In practice, the specific implementation process of the steps in this embodiment is roughly as follows:

[0095] Step 1: Obtain the design files of the target project through the pre-configured API interface.

[0096] 1. Configure the API interface:

[0097] Configure the API interface to support obtaining design files from various design tools (such as Sketch, Figma, Adobe XD, etc.).

[0098] Set up an authentication mechanism to ensure that only authorized users can access and download design files.

[0099] Configure the API interface parameters, including project ID, file path, version number, etc., to ensure that the correct design file can be obtained.

[0100] 2. Initiate an API request:

[0101] Make a request through the API interface to obtain the design files of the target project.

[0102] Use HTTP / HTTPS protocols for communication to ensure the security of data transmission.

[0103] The request includes the necessary parameters to ensure that the correct design files are obtained.

[0104] 3. Receive and store design files:

[0105] Receive the design file returned from the API interface and store it in a specified location on the local machine or server.

[0106] Record metadata about the design files, such as filename, size, and download time, to facilitate subsequent management and traceability.

[0107] Provides a logging function to record detailed information for each design file acquisition, facilitating troubleshooting and auditing.

[0108] Step 2: Preprocess the design files

[0109] 4. Verify the completeness and format of the design documents:

[0110] Verify the integrity and correct format of the design documents to ensure they are not corrupted and conform to the expected format.

[0111] Check the file extension, header, and other information to confirm the file type and format.

[0112] 5. Unzip the design files:

[0113] If the design file is in a compressed format (such as ZIP, RAR, etc.), decompress the design file and extract its contents.

[0114] Ensure the decompressed file structure is intact and that all necessary files and resources have been correctly extracted.

[0115] 6. Convert to a unified intermediate format:

[0116] The decompressed design files are converted into a unified intermediate format for subsequent parser processing.

[0117] For example, convert files generated by different design tools into JSON or XML format to ensure that the parser can read and process them correctly.

[0118] Step 3: Using a pre-configured parser, parse the pre-processed design file and extract the element features of each design element in the pre-processed design file.

[0119] 7. Configure the parser:

[0120] Configure the parser to support multiple design file formats, ensuring that it can parse design files generated by different tools.

[0121] Provides a configuration file for the parser, allowing users to adjust the parser's parameters and behavior as needed.

[0122] It supports a plugin mechanism, allowing users to extend the parser's functionality to support new design file formats.

[0123] 8. Analyze the design documents:

[0124] The pre-processed design file is parsed using the configured parser.

[0125] Extract structural information such as pages, artboards, and layers from the design file, as well as the geometric properties (such as position and size) and style properties (such as color, border, and shadow) of each layer.

[0126] It provides detailed parsing logs, recording every step of the parsing process, which facilitates troubleshooting and debugging.

[0127] 9. Extract elemental features:

[0128] Extract the geometric features of the design elements (such as center point, area, aspect ratio, etc.).

[0129] Analyze the types of design elements (such as text, graphics, bitmaps, combined layers, etc.).

[0130] Mark the visual complexity and interactive properties (such as click, hover, etc.) of design elements.

[0131] The above implementation process enables a complete workflow from acquiring design files to extracting design element features. These steps ensure the correct acquisition, preprocessing, and parsing of design files, providing accurate and consistent input data for subsequent code generation.

[0132] Furthermore, in one embodiment, the code generation method, wherein the step of clustering the design elements based on the element features to obtain clustering results specifically includes the following steps:

[0133] The element characteristics are standardized.

[0134] Based on the standardized element features, a clustering algorithm is determined.

[0135] The clustering algorithm is used to cluster each of the design elements to generate clustering results.

[0136] In practice, the specific implementation process of the steps in this embodiment is roughly as follows:

[0137] Step 1: Standardize the element features.

[0138] 1. Extract element feature values:

[0139] Extract the feature values ​​of each design element from the design file, including geometric features (such as position and size) and style features (such as color and border width).

[0140] Ensure that the extracted feature values ​​are accurate and complete, providing basic data for subsequent standardization processing.

[0141] 2. Select a standardization method:

[0142] Choose an appropriate standardization method based on the type and distribution of the eigenvalues. Common standardization methods include Z-score standardization and Min-Max standardization.

[0143] For example, for geometric features such as position and size, Min-Max normalization can be used to normalize the values ​​to the range [0,1]; for color values, their original format (such as hexadecimal) can be preserved.

[0144] 3. Apply standardized algorithms:

[0145] The selected standardization algorithm is applied to the extracted feature values ​​to transform all feature values ​​to the same dimension.

[0146] Ensure that the standardized feature values ​​are evenly distributed to facilitate subsequent clustering processing.

[0147] Step 2: Determine the clustering algorithm based on the standardized element features.

[0148] 4. Analyze the standardized features:

[0149] The standardized features are analyzed to determine the distribution of the data and the correlation between the features.

[0150] For example, visualization tools (such as scatter plots and heatmaps) can be used to observe the distribution of feature values ​​and understand the clustering of data.

[0151] 5. Select a clustering algorithm:

[0152] Based on the analysis results, select an appropriate clustering algorithm. Common clustering algorithms include K-Means, DBSCAN, and hierarchical clustering.

[0153] For example, if the data distribution is relatively uniform, the K-Means algorithm can be chosen; if the data distribution is uneven and there is noise and outliers, the DBSCAN algorithm can be chosen.

[0154] Configure the parameters of the clustering algorithm, such as the number of cluster centers (K value) in the K-Means algorithm, and the radius (ε) and minimum number of points (MinPts) in the DBSCAN algorithm.

[0155] Step 3: Based on the clustering algorithm, perform clustering processing on each design element to generate clustering results.

[0156] 6. Apply clustering algorithms:

[0157] The standardized feature values ​​are input into the selected clustering algorithm to perform clustering processing on the design elements.

[0158] For example, when using the K-Means algorithm, cluster centers are initialized, and each design element is assigned to the nearest cluster center through iterative optimization. When using the DBSCAN algorithm, core points, edge points, and noise points are identified based on the radius and minimum number of points parameters to form clusters.

[0159] 7. Generate clustering results:

[0160] Generate clustering results and record the cluster category to which each design element belongs and its position within the cluster.

[0161] For example, a clustering result table can be generated, recording information such as the ID of each element, the cluster category it belongs to, and the coordinates of the cluster center.

[0162] Provide visualization tools for clustering results, such as cluster diagrams and heatmaps, to help users view the clustering results intuitively.

[0163] 8. Optimize clustering results (optional):

[0164] The generated clustering results are optimized by adjusting the cluster boundaries to ensure the rationality and accuracy of the results. For example, edge elements are reassigned based on their similarity to neighboring clusters.

[0165] The above implementation process enables a complete process from standardizing element features to generating clustering results. These steps ensure the accuracy and consistency of the clustering process, providing a reasonable layout structure for subsequent code generation.

[0166] Furthermore, in one embodiment, the code generation method, wherein constructing an intermediate representation of the design file based on the clustering results specifically includes the following steps:

[0167] Based on the clustering results, analyze the layout relationships between the design elements and construct a layout tree;

[0168] Extract the style information of each design element, and generate a preliminary intermediate representation of the design file based on the layout tree and the style information of each design element;

[0169] The preliminary intermediate representation is optimized to obtain the final intermediate representation, thus completing the construction of the intermediate representation of the design document.

[0170] Furthermore, the code generation method, wherein converting the intermediate representation into executable code corresponding to the target project according to a preset code conversion strategy, specifically includes the following steps:

[0171] Determine the code conversion strategy based on the expected needs of the target project;

[0172] According to the code conversion strategy, the layout tree in the intermediate representation is converted to generate layout-related code snippets;

[0173] According to the code conversion strategy, the style information in the intermediate representation is converted into code to generate style-related code snippets;

[0174] The layout-related code snippets and the style-related code snippets are integrated to generate the executable code corresponding to the target project.

[0175] Furthermore, the code generation method, after integrating the layout-related code snippets and the style-related code snippets to generate the runnable code corresponding to the target project, further includes the following steps:

[0176] The executable code is verified according to a preset code verification strategy;

[0177] If the verification passes, test the executable code in the target environment;

[0178] A test report is generated based on the test results, and the test report is sent to the designated terminal.

[0179] Furthermore, the code generation method, wherein verifying the executable code according to a preset code verification strategy, further includes the following steps:

[0180] If the verification fails, record the failure factors that caused the runnable code to fail;

[0181] Based on the aforementioned failure factors, the executable code is modified.

[0182] The modified executable code is re-verified until it passes verification.

[0183] In practice, the specific implementation process of the steps in this embodiment is roughly as follows:

[0184] Step 1: Based on the clustering results, analyze the layout relationships between the design elements and construct a layout tree.

[0185] 1. Analyze the layout relationships:

[0186] Based on the clustering results, the spatial relationships between the design elements are analyzed to determine hierarchical relationships such as parent-child and sibling relationships.

[0187] Spatial analysis algorithms (such as bounding box overlap detection, center point distance calculation, etc.) are used to infer the hierarchical relationship between elements.

[0188] 2. Construct the layout tree:

[0189] Based on the inferred hierarchical relationships, a hierarchical layout tree structure is constructed.

[0190] Each node represents a design element, and the relationship between nodes represents the hierarchical relationship between elements.

[0191] Provides layout tree visualization tools to help users intuitively view and verify the layout tree structure.

[0192] 3. Optimize the layout tree:

[0193] The generated layout tree is optimized by adjusting the node positions and hierarchical relationships to ensure its rationality and accuracy.

[0194] Step 2: Extract the style information of each design element; based on the layout tree and the style information of each design element, generate a preliminary intermediate representation of the design file; optimize the preliminary intermediate representation to obtain the final intermediate representation, thus completing the construction of the intermediate representation of the design file.

[0195] 4. Extract style information:

[0196] Extract style information for each design element from the design file, including geometric properties (such as position and size) and style properties (such as color, border, and shadow).

[0197] The extracted style information is associated with each node in the layout tree.

[0198] 5. Construct intermediate representation:

[0199] After converting the layout tree and style information into a preliminary intermediate representation of the design file, the preliminary intermediate representation is optimized to obtain the final intermediate DSL representation, thus completing the construction of the intermediate DSL representation of the design file.

[0200] The intermediate DSL refers to the layout and style information used to describe the design file, supporting multi-level component nesting and reuse.

[0201] The intermediate DSL includes semantic component information, layout rules, style attributes, etc., to ensure that the subsequent code generator can understand and process it.

[0202] 6. Verify the intermediate representation:

[0203] The generated intermediate representation is validated to ensure that it conforms to the preset specifications and standards.

[0204] Provides a validation tool for intermediate representations, automatically checking for syntax errors or potential problems in the generated intermediate representations.

[0205] Step 3: Determine the code conversion strategy based on the expected requirements of the target project.

[0206] 7. Determine the target code format:

[0207] Based on the specific requirements of the target project (such as target platform, performance requirements, code style, etc.), determine the format of the target code, such as HTML / CSS, JavaScript, and schema configuration for low-code platforms.

[0208] A configuration interface is provided, allowing users to select and configure the format and characteristics of the target code according to their specific needs.

[0209] 8. Configure code conversion strategy:

[0210] Configure the corresponding code conversion strategy based on the selected target code format. For example, for HTML / CSS code, configure style generation rules, layout conversion rules, etc.

[0211] It provides a default conversion strategy template and allows users to customize and adjust it as needed.

[0212] Step 4: According to the code conversion strategy, perform code conversion on the layout tree in the intermediate representation to generate layout-related code snippets; according to the code conversion strategy, perform code conversion on the style information in the intermediate representation to generate style-related code snippets; integrate the layout-related code snippets and the style-related code snippets to generate the executable code corresponding to the target project.

[0213] 9. Convert intermediate representation:

[0214] Based on the configured code conversion strategy, the layout tree in the intermediate representation is converted to generate layout-related code snippets;

[0215] Based on the configured code conversion strategy, the style information in the intermediate representation is converted into code to generate style-related code snippets;

[0216] The layout-related code snippets and style-related code snippets are integrated to generate the executable target code corresponding to the target project.

[0217] For example, convert button elements to HTML button tags and apply the corresponding CSS styles.

[0218] Use a template engine (such as Jinja2 or Handlebars) to generate code snippets, ensuring that the generated code has good formatting and readability.

[0219] 10. Optimize the generated code:

[0220] The generated code is optimized, including code compression, merging style rules, and reducing redundant code.

[0221] Use code analysis tools to examine the generated code and ensure it conforms to the best practices and specifications of the target language.

[0222] Step 5: Verify the executable code according to the preset code verification strategy.

[0223] 11. Configure code verification strategy:

[0224] Configure code verification strategies based on the expected needs of the target project, including syntax checking, code style checking, and performance checking.

[0225] It provides a default verification strategy template and allows users to customize and adjust it as needed.

[0226] 12. Verify that the code is executable:

[0227] The generated executable code is verified according to the preset code verification strategy.

[0228] Use code analysis tools to automatically inspect the generated code, record the verification results and the problems found.

[0229] Step 6: If the verification passes, test the executable code in the target environment, generate a test report based on the test results, and send the test report to the designated terminal.

[0230] 13. Test the code in the target environment:

[0231] If the verification passes, the generated executable code will be tested in the target environment. The target environment includes, but is not limited to, browsers, mobile devices, and low-code platforms.

[0232] Use automated testing tools to ensure that the code displays and interacts correctly during actual operation.

[0233] 14. Generate test report:

[0234] A test report is generated based on the test results. The test report includes information such as the test environment, test results, problems found, and suggestions.

[0235] Provides a visual representation of test reports to help users quickly understand the test results.

[0236] 15. Send the test report:

[0237] The generated test report is sent to a designated terminal, which can be the developer's computer, mobile device, or project management platform, etc.

[0238] It supports multiple notification methods, such as email, instant messaging tools, and project management platforms.

[0239] Step 7: If the verification fails, record the failure factors of the executable code; modify the executable code according to the failure factors, and re-verify the modified executable code until the executable code passes the verification.

[0240] 16. Record the factors that led to failure:

[0241] If the verification fails, record the specific reasons for the failure of the runnable code verification. These reasons include syntax errors, code style issues, performance issues, etc.

[0242] Provide detailed error reports, recording the details and location of each problem.

[0243] 17. Provide repair suggestions:

[0244] Based on the factors causing the failure, detailed remedial recommendations (including solutions) are provided to quickly locate and resolve the problem.

[0245] 18. Modify the executable code:

[0246] Based on the repair recommendations, the executable code was modified. The modification process included:

[0247] Automatically generate code snippets for fixing problems and provide possible solutions.

[0248] Users can manually modify the code in the repair interface, and the system provides real-time syntax checking and code suggestions.

[0249] 19. Re-verify:

[0250] The modified executable code is re-verified until it passes verification. After successful verification, the executable code is tested in the target environment, and a test report is generated based on the test results. The test report is then sent to the designated terminal.

[0251] It provides a verification history, allowing users to view the results of each verification and the progress of the repair.

[0252] Through the above-described implementation process, the entire process from design documents to runnable code can be automated, ensuring the efficiency and accuracy of code generation. These steps not only improve development efficiency but also ensure, through automated verification and testing mechanisms, that the generated code conforms to the specifications of the target language and the requirements of the target project.

[0253] As can be seen from the above method embodiments, the code generation method provided by the present invention includes: obtaining the design file of the target project; parsing the design file and extracting the element features of each design element in the design file; performing clustering processing on each design element based on the element features to obtain a clustering result; constructing an intermediate representation of the design file based on the clustering result; and converting the intermediate representation into executable code corresponding to the target project according to a preset code conversion strategy. Thus, the method of the present invention can effectively improve the efficiency and accuracy of software project development.

[0254] It should be understood that although this application provides the method operation steps as described in the embodiments or flowcharts, conventional or non-inventive labor may include more or fewer operation steps, and these operation steps are not necessarily executed sequentially according to the order of the embodiments or flowcharts. The order of steps listed in the embodiments or flowcharts is merely one way of executing many steps and does not represent the only execution order. It should be noted that there is no necessary sequential order between the above steps. Those skilled in the art can understand from the description of the embodiments of the present invention that the above steps may have different execution orders in different embodiments, that is, they may be executed in parallel or in exchange, etc. Moreover, at least some steps in the embodiments or flowcharts may include multiple sub-steps or multiple stages. These sub-steps or stages are not necessarily completed at the same time, but may be executed at different times. The execution order of these sub-steps or stages is not necessarily sequential, but may be executed in turn, alternately, or synchronously with other steps or at least a part of the sub-steps or stages of other steps.

[0255] Based on the above method embodiments, please refer to Figure 3 Another embodiment of the present invention also provides a code generation apparatus, wherein the apparatus includes:

[0256] The acquisition module 11 is used to acquire the design file of the target project, parse the design file, and extract the element features of each design element in the design file;

[0257] Clustering module 12 is used to perform clustering processing on each of the design elements based on the element characteristics to obtain clustering results;

[0258] Module 13 is used to construct an intermediate representation of the design file based on the clustering results;

[0259] The conversion module 14 is used to convert the intermediate representation into the executable code corresponding to the target project according to a preset code conversion strategy.

[0260] Furthermore, in one embodiment, the code generation apparatus, wherein obtaining the design file of the target project, parsing the design file, and extracting the element features of each design element in the design file specifically includes:

[0261] Obtain the design files of the target project through a pre-configured API interface;

[0262] The design documents are preprocessed;

[0263] The pre-configured parser is used to parse the pre-processed design file and extract the element features of each design element in the pre-processed design file.

[0264] Furthermore, in one embodiment, the code generation apparatus, wherein the step of clustering the design elements based on the element features to obtain clustering results specifically includes:

[0265] The element characteristics are standardized.

[0266] Based on the standardized element features, a clustering algorithm is determined.

[0267] The clustering algorithm is used to cluster each of the design elements to generate clustering results.

[0268] Furthermore, in one embodiment, the code generation apparatus, wherein constructing an intermediate representation of the design document based on the clustering results specifically includes:

[0269] Based on the clustering results, analyze the layout relationships between the design elements and construct a layout tree;

[0270] Extract the style information of each design element, and generate a preliminary intermediate representation of the design file based on the layout tree and the style information of each design element;

[0271] The preliminary intermediate representation is optimized to obtain the final intermediate representation, thus completing the construction of the intermediate representation of the design document.

[0272] Furthermore, in the code generation device, the step of converting the intermediate representation into executable code corresponding to the target project according to a preset code conversion strategy specifically includes:

[0273] Determine the code conversion strategy based on the expected needs of the target project;

[0274] According to the code conversion strategy, the layout tree in the intermediate representation is converted to generate layout-related code snippets;

[0275] According to the code conversion strategy, the style information in the intermediate representation is converted into code to generate style-related code snippets;

[0276] The layout-related code snippets and the style-related code snippets are integrated to generate the executable code corresponding to the target project.

[0277] Furthermore, the code generation device, after integrating the layout-related code snippets and the style-related code snippets to generate the executable code corresponding to the target project, further includes:

[0278] The executable code is verified according to a preset code verification strategy;

[0279] If the verification passes, test the executable code in the target environment;

[0280] A test report is generated based on the test results, and the test report is sent to the designated terminal.

[0281] Furthermore, in the code generation apparatus, the step of verifying the executable code according to a preset code verification strategy further includes:

[0282] If the verification fails, record the failure factors that caused the runnable code to fail;

[0283] Based on the aforementioned failure factors, the executable code is modified.

[0284] The modified executable code is re-verified until it passes verification.

[0285] It should be noted that, in the device embodiments of the present invention, the information interaction and execution process between the above modules are based on the same concept as in the method embodiments of the present invention. For details on their specific functions and the resulting technical effects, please refer to the aforementioned method embodiments section, which will not be repeated here.

[0286] Based on the above method embodiments, another embodiment of the present invention also provides a computer device, which can be a server, and its internal structure diagram can be as follows. Figure 4 As shown. The computer device includes a processor, memory, network interface, and database connected via a system bus. The processor provides computing and control capabilities. The memory includes a non-volatile storage medium and internal memory. The non-volatile storage medium stores an operating system, computer programs, and a database. The internal memory provides an environment for the operation of the operating system and computer programs in the non-volatile storage medium. The network interface is used to communicate with external terminals via a network connection. When the computer program is executed by the processor, it implements the functions or steps of the code generation method server-side as described in any of the above method embodiments.

[0287] Based on the above method embodiments, another embodiment of the present invention also provides a computer device, which can be a client, and its internal structure diagram can be as follows. Figure 5As shown, the computer device includes a processor, memory, network interface, display screen, and input device connected via a system bus. The processor provides computing and control capabilities. The memory includes a non-volatile storage medium and internal memory. The non-volatile storage medium stores an operating system and computer programs. The internal memory provides an environment for the operation of the operating system and computer programs in the non-volatile storage medium. The network interface is used to communicate with external terminals via a network connection. When executed by the processor, the computer program implements the functions or steps of the code generation method on the client side as described in any of the above method embodiments.

[0288] Those skilled in the art will understand that Figure 4 and Figure 5 The structural schematic diagram shown is only a schematic diagram of a part of the structure related to the present invention and does not constitute a limitation on the computer device on which the present invention is applied. The specific computer device may include more components than shown in the figure, or combine certain components, or have different component arrangements.

[0289] The processor referred to herein can be a CPU, but it can also be other general-purpose processors, digital signal processors (DSPs), application-specific integrated circuits (ASICs), field-programmable gate arrays (FPGAs), or other programmable logic devices, discrete gate or transistor logic devices, discrete hardware components, etc. A general-purpose processor can be a microprocessor or any conventional processor.

[0290] The memory includes readable storage media, internal memory, etc., where internal memory can be the RAM of a computer device. Internal memory provides an environment for the operation of the operating system and computer-readable instructions stored in the readable storage media. The readable storage media can be the hard drive of the computer device, or in other embodiments, it can be an external storage device of the computer device, such as a plug-in hard drive, Smart Media Card (SMC), Secure Digital (SD) card, or Flash Card. Furthermore, the memory can include both internal storage units and external storage devices of the computer device. The memory is used to store the operating system, applications, bootloader, data, and other programs, such as program code for computer programs. The memory can also be used to temporarily store data that has been output or will be output.

[0291] Based on the above method embodiments, another embodiment of the present invention provides a computer-readable storage medium storing a computer program, wherein the computer program, when executed by a processor, implements the code generation method as described in any of the above method embodiments. The computer-readable storage medium may be non-volatile or volatile.

[0292] It should be noted that the functions or steps that can be achieved by the computer-readable storage medium or computer device, and the technical effects brought about by the functions / steps, can be referred to the relevant descriptions in the foregoing method embodiments. To avoid repetition, they will not be described one by one here.

[0293] Those skilled in the art will understand that all or part of the processes in the methods of the above embodiments can be implemented by a computer program instructing related hardware. The computer program can be stored in a non-volatile computer-readable storage medium, and when executed, it can include the processes of the embodiments of the above methods. Any references to memory, storage, databases, or other media used in the embodiments provided in this application can include non-volatile and / or volatile memory. Non-volatile memory can include read-only memory (ROM), programmable ROM (PROM), electrically programmable ROM (EPROM), electrically erasable programmable ROM (EEPROM), or flash memory. Volatile memory can include random access memory (RAM) or external cache memory. By way of illustration and not limitation, RAM is available in various forms, such as static RAM (SRAM), dynamic RAM (DRAM), synchronous DRAM (SDRAM), dual data rate SDRAM (DDRSDRAM), enhanced SDRAM (ESDRAM), synchronous link DRAM (SLDRAM), Rambus direct RAM (RDRAM), direct memory bus dynamic RAM (DRDRAM), and memory bus dynamic RAM (RDRAM), etc. The disclosed memory components or memories of the operating environment described herein are intended to include one or more of these and / or any other suitable types of memory.

[0294] Those skilled in the art will understand that, for the sake of convenience and brevity, the embodiments of the device of the present invention are only illustrated by the division of the above-mentioned functional units and modules. In practical applications, the above functions can be assigned to different functional units and modules as needed, that is, the internal structure of the device can be divided into different functional units or modules to complete all or part of the functions described above. The functional units and modules in the embodiments can be integrated into one processing unit, or each unit can exist physically separately, or two or more units can be integrated into one unit. The integrated unit can be implemented in hardware or as a software functional unit. Furthermore, the specific names of the functional units and modules are only for easy differentiation and are not intended to limit the scope of protection of the present invention. The specific working process of the units and modules in the above device can be referred to the corresponding process in the foregoing method embodiments, and will not be repeated here. If the integrated unit is implemented as a software functional unit and sold or used as an independent product, it can be stored in a computer-readable storage medium.

[0295] Those skilled in the art will recognize that the units and algorithm steps of the various examples described in conjunction with the embodiments disclosed herein can be implemented in electronic hardware, or a combination of computer software and electronic hardware. Whether these functions are implemented in hardware or software depends on the specific application and design constraints of the technical solution. Those skilled in the art can use different methods to implement the described functions for each specific application, but such implementations should not be considered beyond the scope of this invention.

[0296] In the embodiments provided by this invention, it should be understood that the disclosed apparatus / computer devices and methods can be implemented in other ways. For example, the apparatus / computer device embodiments described above are merely illustrative. For instance, the division of modules or units is only a logical functional division, and in actual implementation, there may be other division methods. For example, multiple units or components may be combined or integrated into another system, or some features may be ignored or not executed. Furthermore, the mutual coupling or direct coupling or communication connection shown or discussed may be through some interfaces; the indirect coupling or communication connection between apparatuses or units may be electrical, mechanical, or other forms.

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

[0298] It should be noted that if any software tools or components not belonging to this company appear in the embodiments of this application, they are merely illustrative examples and do not represent actual use. The above embodiments are only used to illustrate the technical solutions of the present invention, and not to limit them; although the present invention has been described in detail with reference to the foregoing embodiments, those skilled in the art should understand that modifications can still be made to the technical solutions described in the foregoing embodiments, or equivalent substitutions can be made to some of the technical features; and these modifications or substitutions do not cause the essence of the corresponding technical solutions to deviate from the spirit and scope of the technical solutions of the embodiments of the present invention, and should all be included within the protection scope of the present invention.

Claims

1. A code generation method, characterized in that, include: Obtain the design files of the target project, parse the design files, and extract the element features of each design element in the design files; Based on the aforementioned element characteristics, clustering is performed on each of the design elements to obtain clustering results; Based on the clustering results, an intermediate representation of the design document is constructed; According to a preset code conversion strategy, the intermediate representation is converted into the executable code corresponding to the target project.

2. The code generation method according to claim 1, characterized in that, The process of obtaining the design documents of the target project, parsing the design documents, and extracting the element features of each design element in the design documents includes: Obtain the design files of the target project through a pre-configured API interface; The design documents are preprocessed; The pre-configured parser is used to parse the pre-processed design file and extract the element features of each design element in the pre-processed design file.

3. The code generation method according to claim 1, characterized in that, The process of clustering the design elements based on their features to obtain clustering results includes: The element characteristics are standardized. Based on the standardized element features, a clustering algorithm is determined. The clustering algorithm is used to cluster each of the design elements to generate clustering results.

4. The code generation method according to claim 1, characterized in that, The process of constructing an intermediate representation of the design document based on the clustering results includes: Based on the clustering results, analyze the layout relationships between the design elements and construct a layout tree; Extract the style information of each design element, and generate a preliminary intermediate representation of the design file based on the layout tree and the style information of each design element; The preliminary intermediate representation is optimized to obtain the final intermediate representation, thus completing the construction of the intermediate representation of the design document.

5. The code generation method according to claim 4, characterized in that, The step of converting the intermediate representation into executable code corresponding to the target project according to a preset code conversion strategy includes: Determine the code conversion strategy based on the expected needs of the target project; According to the code conversion strategy, the layout tree in the intermediate representation is converted to generate layout-related code snippets; According to the code conversion strategy, the style information in the intermediate representation is converted into code to generate style-related code snippets; The layout-related code snippets and the style-related code snippets are integrated to generate the executable code corresponding to the target project.

6. The code generation method according to claim 5, characterized in that, After integrating the layout-related code snippets and the style-related code snippets to generate the executable code corresponding to the target project, the process further includes: The executable code is verified according to a preset code verification strategy; If the verification passes, test the executable code in the target environment; A test report is generated based on the test results, and the test report is sent to the designated terminal.

7. The code generation method according to claim 6, characterized in that, The step of verifying the executable code according to a preset code verification strategy further includes: If the verification fails, record the failure factors that caused the runnable code to fail; Based on the aforementioned failure factors, the executable code is modified. The modified executable code is re-verified until it passes verification.

8. A code generation device, characterized in that, include: The acquisition module is used to acquire the design files of the target project, parse the design files, and extract the element features of each design element in the design files; The clustering module is used to perform clustering processing on each of the design elements based on the element characteristics to obtain clustering results; A construction module is used to construct an intermediate representation of the design file based on the clustering results; The conversion module is used to convert the intermediate representation into executable code corresponding to the target project according to a preset code conversion strategy.

9. A computer device comprising a memory, a processor, and a computer program stored in the memory and executable on the processor, characterized in that, When the processor executes the computer program, it implements the code generation method as described in any one of claims 1-7.

10. A computer-readable storage medium storing a computer program, characterized in that, When the computer program is executed by a processor, it implements the code generation method as described in any one of claims 1-7.

Images