Cross-platform page code generation method based on large model

By employing multi-model collaborative parsing and dynamic compensation techniques, combined with platform adaptation rule bases and sandbox testing, the parsing deviation and compatibility issues in cross-platform page code generation have been resolved, achieving efficient and accurate cross-platform code generation and continuous optimization.

CN121900755APending Publication Date: 2026-04-21CHENG DU ZHONG KE JI YUN RUAN JIAN YOU XIAN GONG SI
View PDF 0 Cites 1 Cited by

Patent Information

Authority / Receiving Office
CN · China
Patent Type
Applications(China)
Current Assignee / Owner
CHENG DU ZHONG KE JI YUN RUAN JIAN YOU XIAN GONG SI
Filing Date
2025-12-10
Publication Date
2026-04-21

AI Technical Summary

Technical Problem

Existing technologies for cross-platform page code generation suffer from large parsing deviations, poor platform compatibility, and uncontrollable code quality due to single-model parsing and a lack of cross-platform adaptation rules, making it difficult to achieve efficient and accurate multi-platform code generation.

Method used

The UI design diagram is parsed collaboratively using multiple dedicated large models. Real-time cross-validation and dynamic compensation are performed using a multi-model mutual verification mechanism. The transformation is carried out through predefined standard specifications and platform adaptation rule base to generate a page object description tree. The code quality is optimized through sandbox testing and automatic correction mechanisms.

Benefits of technology

It improves the accuracy and robustness of the conversion from design drawings to structured data, enables automatic adaptation of components, styles and APIs across platforms, and ensures the reliability and continuous optimization capabilities of the generated code.

✦ Generated by Eureka AI based on patent content.

Smart Images

  • Figure CN121900755A_ABST
    Figure CN121900755A_ABST
Patent Text Reader

Abstract

The invention discloses a cross-platform page code generation method based on a large model, and relates to the technical field of front-end development, and the method comprises the following steps: cooperatively analyzing a UI design drawing through a plurality of special large models, and carrying out real-time cross validation and dynamic compensation on an analysis result by adopting a multi-model mutual verification mechanism; based on a predefined standard specification, dynamic adjustment is carried out through a platform adaptation rule base; generating a page object description tree embedded with the input / output processing function; cross-platform page codes are generated through a code generation engine, and sandbox testing and automatic correction are executed; outputting a target platform code by utilizing a unified compiling engine; an adaptive optimization loop is constructed based on test feedback. According to the method, through integration of multi-model collaborative analysis, platform rule dynamic adaptation, sandbox verification and closed-loop optimization, the problems of large analysis deviation, poor cross-platform compatibility, uncontrollable code quality and the like are solved, and end-to-end high-quality automatic generation from a design drawing to multi-platform codes is realized.
Need to check novelty before this filing date? Find Prior Art

Description

Technical Field

[0001] This invention relates to the field of front-end development technology, and in particular to a cross-platform page code generation method based on a large model. Background Technology

[0002] With the rapid development of internet technology, users are accessing web content on increasingly diverse devices, including desktop computers, tablets, smartphones, and smart TVs. To ensure a good user experience across different devices, developers need to write cross-platform page code that can display correctly on various platforms and screen sizes.

[0003] Currently, in cross-platform page code generation, due to the reliance on single model parsing and static rule conversion, it is impossible to perform collaborative parsing and dynamic compensation of multi-dimensional elements in UI design drawings. Furthermore, the lack of cross-platform adaptation rules and automated verification mechanisms leads to problems such as large parsing deviations, poor platform compatibility, and uncontrollable generated code quality, making it difficult to achieve efficient and accurate generation from design drawings to multi-platform code.

[0004] Therefore, a cross-platform page code generation method based on a large model is proposed to solve the above problems. Summary of the Invention

[0005] The main objective of this invention is to provide a cross-platform page code generation method based on a large model to solve the problems mentioned in the background above.

[0006] To achieve the above objectives, the technical solution adopted by the present invention is as follows: a cross-platform page code generation method based on a large model, the method comprising the following steps: S1. The UI design drawings uploaded by users are parsed collaboratively by multiple dedicated large models to generate structured data containing element coordinates, types, sizes and hierarchical relationships. A multi-model mutual verification mechanism is used to perform real-time cross-validation and dynamic compensation of the parsing results. S2. The structured data is transformed based on predefined standard specifications, including component element specifications, style attribute specifications, event logic specifications, and storage data specifications. The standard specifications are dynamically adjusted through a platform adaptation rule base to adapt to different target platforms. S3. Generate a page object description tree based on the converted structured data. The description tree includes a node structure, attribute mapping table, event hooks and data source, and embeds input / output processing functions and pre- / post-conditions of events during the generation process. S4. The page object description tree is parsed layer by layer through the code generation engine to generate cross-platform page code, and sandbox testing and automatic correction are performed, including static analysis, dynamic sandbox simulation and generation of rule base alternatives based on error types. S5. Use a unified compilation engine to compile the corrected page code into target platform code, including mini-programs, H5, and native apps; S6. Based on sandbox test results and user feedback data, the image parsing model parameters and platform adaptation rules are dynamically updated through an adaptive optimization engine, forming a continuous improvement cycle for code generation quality based on test feedback.

[0007] Preferably, the collaborative parsing of the UI design diagram in S1 includes the following steps: S11. Call multiple dedicated large models based on the Bailian platform, including layout recognition model, component detection model and text semantic model, to parse the layout relationship, component elements and text content in the design diagram respectively; S12. Implement a multi-model cross-validation mechanism to perform real-time cross-validation on the output results of the layout recognition model, component detection model and text semantic model. If a parsing conflict is detected, a dynamic compensation algorithm is triggered. S13. Automatically adjust the coordinates and hierarchy of conflicting elements based on component weight priority, and output a structured JSON data stream with confidence score.

[0008] Preferably, the dynamic compensation algorithm in S12 includes the following steps: S121. Calculate the weight priority of each component in the layout, and dynamically allocate adjustment coefficients based on element type and layout importance; S122. Recalculate element coordinates using a conflict resolution strategy to ensure layout consistency; S123. Output structured data with confidence scores to provide a basis for error correction in subsequent processing.

[0009] Preferably, the dynamic adjustment of the platform adaptation rule base in S2 includes the following steps: S21. Establish a multi-platform component mapping table, define the correspondence between general components and target platform component tags, and support custom component extensions; S22. Configure style conversion rules to dynamically convert design units to style units applicable to the target platform, including px, dp, and rpx; S23. Maintain a global API conversion list and identify and replace platform-incompatible API calls.

[0010] Preferably, the maintenance of the global API transformation list in S23 includes the following steps: S231. Disable the API through the rule engine matching platform and map it to an equivalent interface; S232. Use abstract syntax trees to analyze code structure, identify and replace incompatible calls; S233: Record conversion logs to support conversion path backtracking and rule optimization.

[0011] Preferably, generating the page object description tree in step S3 includes the following steps: S31. Organize the parsed component nesting relationship in a tree structure, associate each node with an attribute mapping table, and bind visual attributes to CSS variables; S32. Mark the triggering conditions and associated data fields of the interaction logic in the event hook, and bind the pre-condition / post-condition validation functions; S33. Add input / output processing functions to component nodes, including numerical range constraints and callback event bindings, to generate an enhanced description tree structure.

[0012] Preferably, the pre- / post-condition binding of the event hook in S32 includes the following steps: S321. Bind validation functions to form submission events to ensure data compliance; S322. Inject timeout and retry mechanisms into asynchronous operation events; S323. Ensure the consistency between the event triggering order and the data flow through dependency analysis.

[0013] Preferably, the sandbox testing and automatic correction in S4 includes the following steps: S41. After generating the page code, perform static analysis and automatically inject test stubs for dynamic testing requirements; S42. Simulate user operation paths using a dynamic sandbox to verify the correctness of event logic and interaction responses; S43. If the test fails, the rule base is called to generate an alternative solution based on the error type, and the solution is iteratively corrected until it passes the verification.

[0014] Preferably, the output of the unified compilation engine in S5 includes the following steps: S51. Dynamically select the compilation strategy based on the characteristics of the target platform and send the intermediate code into the compilation engine; S52. Output WXML, WXSS, and JS packages for the WeChat Mini Program platform; S53. Generate HTML, CSS, and JS single-page applications for the H5 platform; S54, for native App platforms, is packaged into a system installation package using a native rendering engine.

[0015] Preferably, the adaptive optimization engine in S6 includes the following steps: S61. Collect error type and frequency data in sandbox testing and build an error pattern knowledge base; S62. Use reinforcement learning algorithms to dynamically adjust the attention weights and platform adaptation rules of the image parsing model; S63. Regularly update model parameters and rule base, and push them to the code generation pipeline to achieve closed-loop optimization.

[0016] The present invention has the following beneficial effects: 1. In this invention, multiple dedicated large models are used to collaboratively parse UI design drawings, and a multi-model mutual verification mechanism is adopted to perform real-time cross-validation and dynamic compensation of the parsing results. This can effectively identify and correct problems such as layout conflicts and component identification deviations, and solve the problems of inaccurate element positioning and low structural restoration caused by the limited parsing capabilities of a single model. This significantly improves the accuracy and robustness of the conversion from design drawings to structured data.

[0017] 2. In this invention, by combining predefined standard specifications with a platform adaptation rule library to dynamically adjust conversion rules, cross-platform automatic adaptation of components, styles and APIs is achieved. It can accurately handle differences between multiple platforms, solve the problems of poor compatibility and high cost of repeated adaptation caused by the lack of platform characteristics in traditional methods, and improve the consistency of code generation and development efficiency.

[0018] 3. In this invention, static analysis and dynamic verification of the generated code are performed through sandbox testing and automatic correction mechanisms. Combined with an adaptive optimization engine that dynamically updates model parameters and rule base based on test feedback, a closed-loop optimization cycle is formed. This solves the problems of uncontrollable code quality, frequent errors, and inability to self-improve in existing technologies, ensuring the reliability of the generated code and the continuous optimization capability of the system. Attached Figure Description

[0020] Figure 1 This is a flowchart illustrating a cross-platform page code generation method based on a large model, according to the present invention. Detailed Implementation

[0022] 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 embodiments of the present invention, and not all embodiments. 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.

[0023] Please see Figure 1 This invention provides a technical solution: a cross-platform page code generation method based on a large model, the method comprising the following steps: S1. The UI design drawings uploaded by users are parsed collaboratively by multiple dedicated large models to generate structured data containing element coordinates, types, sizes and hierarchical relationships. A multi-model mutual verification mechanism is used to perform real-time cross-validation and dynamic compensation of the parsing results. S2. Transform structured data based on predefined standard specifications, including component element specifications, style attribute specifications, event logic specifications, and storage data specifications. The standard specifications are dynamically adjusted through a platform adaptation rule base to adapt to different target platforms. S3. Generate a page object description tree based on the converted structured data. The description tree includes node structure, attribute mapping table, event hooks and data source, and embeds input / output processing functions and pre / post conditions of events during the generation process. S4. The code generation engine parses the page object description tree layer by layer to generate cross-platform page code, and performs sandbox testing and automatic correction, including static analysis, dynamic sandbox simulation and generation of rule base alternatives based on error types. S5. Use a unified compilation engine to compile the corrected page code into target platform code, including mini-programs, H5, and native apps; S6. Based on sandbox test results and user feedback data, the image parsing model parameters and platform adaptation rules are dynamically updated through an adaptive optimization engine, forming a continuous improvement cycle for code generation quality based on test feedback.

[0024] The collaborative parsing of UI design drafts in S1 includes the following steps: S11. Call multiple dedicated large models based on the Bailian platform, including layout recognition model, component detection model and text semantic model, to parse the layout relationships, component elements and text content in the design drawing, including the following steps: S111. The layout recognition model uses a Transformer-based visual encoder to encode the UI design, outputting the bounding box coordinates of each visual element and its hierarchical position in the view tree. The bounding box is determined by the coordinates of its top-left corner. and the coordinates of the bottom right corner Define the screen area of ​​an element. The calculation formula is: ; S112. The component detection model identifies basic UI element types based on the YOLOv8 architecture. (such as buttons, input boxes, text labels) and their visual style attribute set It also outputs the confidence score for each detection result.

[0025] S113. The text semantic model extracts all text content from the design drawings using PaddleOCR technology. And use the BERT model to generate corresponding semantic vectors. ( (For vector dimensions), while establishing an association mapping between text and corresponding component nodes. .

[0026] S12. Implement a multi-model cross-validation mechanism to perform real-time cross-validation on the output results of the layout recognition model, component detection model, and text semantic model. If a parsing conflict is detected, a dynamic compensation algorithm is triggered, including the following steps: S121. Define layout conflict detection metrics: For the same UI element, calculate the intersection-union ratio (IUU) of the bounding boxes output by the layout recognition model and the component detection model. ): ; in To calculate the area of ​​the region, The bounding box output by the layout recognition model The bounding boxes output by the component detection model; Set conflict threshold ,like If so, it is determined to be a layout conflict; S122. Define the text-component consistency verification metric: For components containing text, verify whether the text content extracted by the text semantic model logically matches the component type identified by the component detection model (e.g., a button component should contain actionable text), and the matching degree. The judgment is made based on a predefined rule base; if a match is found... Otherwise, it is 0; S123. If any verification index fails, the dynamic compensation algorithm is triggered.

[0027] S13. Automatically adjust the coordinates and hierarchy of conflicting elements based on component weight priority, and output a structured JSON data stream with confidence score.

[0028] The dynamic compensation algorithm in S12 includes the following steps: S121. Calculate the weight priority of each component in the layout, and dynamically allocate adjustment coefficients based on element type and layout importance, including the following steps: S1211, Define the element type importance coefficient Based on the component interaction attributes preset: Button is set to 1.2, Input is set to 1.1, Label is set to 0.8, and Container is set to 1.0.

[0029] S1212, Calculate the layout importance coefficient The formula is: ; in For the component's screen area, The total area of ​​the design drawing. The distance is the Euclidean distance from the center of the component to the center of the design drawing. This is the balance coefficient; Overall weight The calculation formula is: ; in The harmonic coefficient; S122. Recalculate element coordinates using a conflict resolution strategy to ensure layout consistency, including the following steps: S1221. For components with coordinate conflicts, collect the bounding box coordinate sets output by each model. ,in , Number of conflict models; S1222. The final coordinates are calculated using the weighted centroid method, and the formula is as follows: ; ; in, For the first The comprehensive weights corresponding to each model (if the same model outputs multiple conflict boxes, then the average weight of that element under that model is taken). S1223. Based on the final coordinates and the original width and height of the component, regenerate the bounding box and adjust its position in the hierarchy tree to ensure no overlap and compliance with the relative constraints of the original layout. S123. Output structured data with confidence scores to provide a basis for error correction in subsequent processing, including the following steps: S1231. Calculate the analytical confidence score for each component based on the calculated difference. : ; in The conflict indicator factor is 1.0 when there is no conflict and 0.7 when there is a conflict but after compensation. These are the confidence scores output by the layout recognition model, component detection model, and text semantic model, respectively. S1232, Weight Final coordinates, hierarchical relationships, and confidence scores Encapsulate as a structured JSON object; S1233. The structured data of all components is sorted in spatial order and output as a JSON array, which serves as the input for subsequent standard specification conversion.

[0030] The dynamic adjustment of the platform adaptation rule base in S2 includes the following steps: S21. Establish a multi-platform component mapping table, define the correspondence between general components and target platform component tags, and support custom component extensions; S22. Configure style conversion rules to dynamically convert design units to style units applicable to the target platform, including px, dp, and rpx, including the following steps: S221. Define the baseline design draft size as width. The following conversion formulas are formulated to take into account the screen characteristics and rendering mechanisms of different target platforms: Convert to pixels (px): ; in, The unit value for points in the design draft. This is the base scaling factor for the H5 version, typically taken as... , The current device logical pixel width; Convert to dp units: ; in, The scaling factor is designed (usually 160 / 72). For device screen density; Convert to rpx units: ; S222: The system has a built-in dynamic scaling factor calculation engine that can calculate the key parameters in the above conversion formula in real time based on the device screen width, pixel density and device type, so as to achieve responsive style adaptation.

[0031] S23. Maintain a global API conversion list and identify and replace platform-incompatible API calls.

[0032] Maintaining the global API transformation manifest in S23 includes the following steps: S231. Disable the API through the rule engine matching platform and map it to an equivalent interface, including the following steps: S2311. Establish a global API conversion rule base, with each rule defined as a four-tuple: ,in: API identifiers appearing in the source code For the target platform identifier, For the target platform equivalent API, For matching conditional expressions; S2312. Rule matching adopts a weighted scoring mechanism for API call nodes identified in the source code. Calculate its relationship with the rule Match degree: ; in The name similarity function is calculated using normalized edit distance: ; This is a context matching function that checks whether the current compilation context matches the target platform. This is a conditional evaluation function that returns 1 if a node satisfies the conditional expression, and 0 otherwise. Let be the weighting coefficient, satisfying The default values ​​are 0.5, 0.3, and 0.2 respectively; When the matching degree exceeds the threshold When this happens, the API replacement operation is triggered.

[0033] S232. Use an abstract syntax tree to analyze the code structure, identify and replace incompatible calls, including the following steps: S2321. Construct an Abstract Syntax Tree (AST) for the generated intermediate code, and use a depth-first traversal algorithm to identify all function call nodes. For each call node... Extract its calling expression and parameter list ; S2322, Define API call feature vector ,in For node type, for the name of the called function, For the number of parameters, To invoke context encoding, a rule-based classifier is used to determine whether an API is incompatible with the target platform. The classification decision function is as follows: ; S2323. For API call nodes determined to be incompatible, perform an AST node replacement operation. The replacement operation includes: Modify the node type and identifier to the equivalent API; Adjust the parameter list mapping (based on the parameter mapping table in the rule base); Preserve the original call semantics and generate a new AST subtree; S233: Record conversion logs to support conversion path backtracking and rule optimization.

[0034] Generating a page object description tree in S3 includes the following steps: S31. Organize the parsed component nesting relationships into a tree structure, associate each node with an attribute mapping table, and bind visual attributes to CSS variables, including the following steps: S311. Based on the output structured JSON data stream, construct the initial flat component list. The tree structure is reconstructed using a parent-child relationship determination algorithm to determine the components. For components The necessary and sufficient condition for a child node is: ; in, The bounding box representing the component (by...) definition), This indicates a strict spatial containment relationship (i.e., the child component is completely within the boundary of the parent component and does not contain the bounding box of any intermediate component). S312, for each node in the tree Generate attribute mapping table This mapping table defines the visual attributes from the design draft. In the end variable The conversion relationship, for key attributes such as color and size, is defined by the following formula: ; in, It is a transformation function. For the target platform type; S313. Generate the attribute mapping table As a node The metadata appended forms a complete description tree infrastructure. ; S32. Mark the triggering conditions and associated data fields of the interaction logic in the event hook, and bind the pre-condition / post-condition validation functions; S33. Add input / output processing functions to component nodes, including numerical range constraints and callback event bindings, to generate an enhanced description tree structure, including the following steps: S331. Input Processing: For input components, automatically infer or extract numerical constraints from design specifications based on their type and context, and generate a processing function for each constraint. For example, for numerical range constraints, the function is defined as: ; in, , and These are the preset minimum and maximum values; S332. Output Processing: Define an output channel for the component. When the component's internal state changes or a specific event is triggered, the bound callback function is called. Callback binding uses a publish-subscribe pattern, using a unique event identifier. The system automatically generates template code for callback functions, which includes interface definitions for event parameters and data payloads.

[0035] S333, Use the above input / output processing functions as nodes. The method members are integrated into the description tree nodes to form the final enhanced page object description tree. .

[0036] The precondition / postcondition binding of event hooks in S32 includes the following steps: S321. Bind validation functions to form submission events to ensure data compliance, including the following steps: S3211. Identify all form submission events on the page and extract the associated set of form fields. For each field It automatically generates or matches a predefined set of validation rules based on its component type, attribute annotations, and design specifications. Each rule Defined as a pair ,in To verify the conditional function, Error message when verification fails; S3212. Constructing a form-level validation function This function performs validation on all fields in parallel and returns the global validation status and detailed error information. Define the fields. The comprehensive verification results are as follows: ; in For fields The current value, This represents the logical AND operation, which only occurs if all rules are met (i.e., ...). The field will only pass validation if the condition is met. S3213, Logical AND of global form validation status with all field validation results: ; And Binding to a form submit event is a precondition only. Logic execution is only allowed when the time is right. S3214. Pre-defined standard validation functions for common validation rules (such as required fields, email format, phone number format, numerical range, etc.). For example, the numerical range validation function is defined as: ; in and These are the lower bound and the upper bound, respectively; S322. Inject timeout and retry mechanisms into asynchronous operation events, including the following steps: S3221. For events marked as asynchronous operations, automatically inject timeout control logic. Assume the estimated maximum timeout for the asynchronous operation is... Then the timeout threshold Calculated dynamically according to the following formula: ; in and These are the minimum and maximum timeout thresholds allowed by the system. For safety, the default value is 1.5; S3222. Implement the exponential backoff retry strategy, assuming a maximum number of retries. The initial retry interval is Then the first Second retry ( (waiting interval) for: ; in As a backoff factor, it is usually set to 2. At the same time, a random jitter factor is introduced. (Value range 0-0.2) To avoid retry storms, the actual interval is adjusted as follows: ; S3223. Encapsulate the timeout and retry logic into a default postcondition handling function for asynchronous events. This function monitors the operation status, automatically triggers retries when a timeout or failure occurs, and executes a failure callback after the maximum number of retries has been reached.

[0037] S323. Ensure the consistency of event triggering order with data flow through dependency analysis, including the following steps: S3231. Construct a page event dependency graph. Among them, vertex set Represents all event hooks, edge sets This indicates the dependency relationship between events, for two events. A directed edge is established if any of the following conditions are met. : Sequence dependency: events Must be in the event It can only be triggered after completion (either explicitly declared or implicit in business logic); Data dependency: Events The input data depends on the event. The output data, i.e. ; S3232. Use the topological sorting algorithm to detect whether there are cycles in the dependency graph. If a cycle exists, identify the set of events with circular dependencies. If a design error is detected, a design error is reported; otherwise, one or more valid event trigger sequences are calculated. ; Based on the dependency analysis results, for each event Automatically generate dynamic preconditions to ensure that all dependent preconditions have been successfully executed. The condition expression is: ; in For the event In dependency graph The set of all direct predecessor events; S3233. The generated dynamic preconditions are merged with the original static conditions of the event to form complete event triggering preconditions, thereby ensuring the consistency of the event triggering order and data flow at runtime.

[0038] Sandbox testing and auto-correction in S4 include the following steps: S41. After generating the page code, perform static analysis and automatically inject test stubs for dynamic testing needs, including the following steps: S411. Static Analysis: Perform lexical, syntactic, and semantic analysis on the generated cross-platform page code, construct the abstract syntax tree (AST) and control flow graph (CFG) of the code, define the defect detection function Dstatic(node), and calculate the potential defect risk value Rrisk for each AST node. ; in, The total number of predefined static rules (including undefined variables, platform-disabled APIs, type mismatches, etc.). For the first Rule 1 Assign a severity weight to the rule. For indicator functions (if a node violates the rules) Returns 1 if the condition is met, otherwise returns 0. Exceeding the threshold When this happens, mark the code segment containing that node as high-risk; S412, Test Stub Injection: Based on event hooks and interaction paths in the page object description tree, automatically generate dynamic test stub code for each interaction event that needs to be tested. Create the corresponding test stub function Its core is to simulate event triggering and collect responses. The test stub injection point is determined according to the node type of CFG, and the calculation formula is as follows: ; in, This is the set of nodes for controlling the flow graph. The injected stub code will record the call parameters, execution context, and return value for subsequent verification. S42. Simulate user operation paths using a dynamic sandbox to verify the correctness of event logic and interaction responses, including the following steps: S421. User interaction path modeling: Extract all possible user interaction sequences from the page description tree and construct a state-based interaction path model. ,in The state of the page (defined by the DOM tree and component data state). For user action events; S422, Sandbox Execution: Loads page code and injected test stubs in an isolated sandbox environment, following a pre-defined path model. Trigger events sequentially and monitor the following key metrics: Event trigger success rate: Calculate the ratio of the number of events that are actually successfully triggered to the expected number of events; State transition correctness: Compare with expected states Compared with the actual state The degree of difference is defined by the state difference function. ; in For the set of key state variables, A value comparison function (returns 0 or 1 for scalars, and calculates normalized distance for objects); Response time compliance: Ensure response time for each event Less than the acceptable threshold ; S423. Verify logical correctness: Check whether the event handling function updates data, calls APIs, or navigates the page as expected. Compare the data collected through test stubs with the expected output and calculate the logical consistency rate. ; S43. If the test fails, the rule base is called to generate an alternative solution based on the error type, and the solution is iteratively corrected until it passes the verification.

[0039] The output of the unified compilation engine in S5 includes the following steps: S51. Dynamically select the compilation strategy based on the characteristics of the target platform and send the intermediate code into the compilation engine, including the following steps: S511. Establish the platform characteristic matrix Each row corresponds to a target platform (such as WeChat Mini Program, H5, iOS, Android), and each column represents a platform characteristic metric (such as supported file types, style preprocessors, API sets, performance constraints, etc.). Obtained through platform specification documents and actual measurement data, and then normalized; S512, For the enhanced page object description tree to be compiled Extract its technology stack feature vector ,in Indicates the first The degree of dependence on or intensity of use of platform features (such as whether specific CSS features are used, whether platform-specific APIs are called, etc.). S513, The decision function for dynamically selecting the optimal compilation strategy is defined as follows: ; in A set of available compilation strategies (such as direct compilation, code splitting compilation, incremental compilation, etc.); To estimate performance scores, based on the policy The weighted average of historical compilation output performance metrics (such as first screen loading time and interaction response time); This is a penalty term for strategy complexity, which is positively correlated with compilation time and resource consumption; For adjustable weighting coefficients, satisfying The default values ​​are 0.5, 0.3, and 0.2 respectively; S514. Based on the selected optimal compilation strategy The intermediate code undergoes adaptive transformations (such as code splitting, resource inlining, and syntax degradation) and is then fed into the corresponding compilation engine pipeline. S52. Output WXML, WXSS, and JS packages for the WeChat Mini Program platform; S53. Generate HTML, CSS, and JS single-page applications for the H5 platform; S54, for native App platforms, is packaged into a system installation package using a native rendering engine.

[0040] The adaptive optimization engine in S6 includes the following steps: S61. Collect error type and frequency data in sandbox testing and build an error pattern knowledge base; S62. Use reinforcement learning algorithms to dynamically adjust the attention weights and platform adaptation rules of the image parsing model; S63. Regularly update model parameters and rule base, and push them to the code generation pipeline to achieve closed-loop optimization.

[0041] It should be noted that, in this document, relational terms such as "first" and "second" are used only to distinguish one entity or operation from another, and do not necessarily require or imply any such actual relationship or order between these entities or operations. Furthermore, the terms "comprising," "including," or any other variations thereof are intended to cover non-exclusive inclusion, such that a process, method, article, or apparatus that comprises a list of elements includes not only those elements but also other elements not expressly listed, or elements inherent to such a process, method, article, or apparatus.

[0042] Although embodiments of the invention have been shown and described, it will be understood by those skilled in the art that various changes, modifications, substitutions and variations can be made to these embodiments without departing from the principles and spirit of the invention, the scope of which is defined by the appended claims and their equivalents.

Claims

1. A cross-platform page code generation method based on a large model, characterized in that, The method includes the following steps: S1. The UI design drawings uploaded by users are parsed collaboratively by multiple dedicated large models to generate structured data containing element coordinates, types, sizes and hierarchical relationships. A multi-model mutual verification mechanism is used to perform real-time cross-validation and dynamic compensation of the parsing results. S2. The structured data is transformed based on predefined standard specifications, including component element specifications, style attribute specifications, event logic specifications, and storage data specifications. The standard specifications are dynamically adjusted through a platform adaptation rule base to adapt to different target platforms. S3. Generate a page object description tree based on the converted structured data. The description tree includes a node structure, attribute mapping table, event hooks and data source, and embeds input / output processing functions and pre- / post-conditions of events during the generation process. S4. The page object description tree is parsed layer by layer through the code generation engine to generate cross-platform page code, and sandbox testing and automatic correction are performed, including static analysis, dynamic sandbox simulation and generation of rule base alternatives based on error types. S5. Use a unified compilation engine to compile the corrected page code into target platform code, including mini-programs, H5, and native apps; S6. Based on sandbox test results and user feedback data, the image parsing model parameters and platform adaptation rules are dynamically updated through an adaptive optimization engine, forming a continuous improvement cycle for code generation quality based on test feedback.

2. The method for generating cross-platform page code based on a large model according to claim 1, characterized in that: The collaborative parsing of the UI design diagram in S1 includes the following steps: S11. Call multiple dedicated large models based on the Bailian platform, including layout recognition model, component detection model and text semantic model, to parse the layout relationship, component elements and text content in the design diagram respectively; S12. Implement a multi-model cross-validation mechanism to perform real-time cross-validation on the output results of the layout recognition model, component detection model and text semantic model. If a parsing conflict is detected, a dynamic compensation algorithm is triggered. S13. Automatically adjust the coordinates and hierarchy of conflicting elements based on component weight priority, and output a structured JSON data stream with confidence score.

3. The method for generating cross-platform page code based on a large model according to claim 2, characterized in that: The dynamic compensation algorithm in S12 includes the following steps: S121. Calculate the weight priority of each component in the layout, and dynamically allocate adjustment coefficients based on element type and layout importance; S122. Recalculate element coordinates using a conflict resolution strategy to ensure layout consistency; S123. Output structured data with confidence scores to provide a basis for error correction in subsequent processing.

4. The method for generating cross-platform page code based on a large model according to claim 1, characterized in that: The dynamic adjustment of the platform adaptation rule base in S2 includes the following steps: S21. Establish a multi-platform component mapping table, define the correspondence between general components and target platform component tags, and support custom component extensions; S22. Configure style conversion rules to dynamically convert design units to style units applicable to the target platform, including px, dp, and rpx; S23. Maintain a global API conversion list and identify and replace platform-incompatible API calls.

5. The method for generating cross-platform page code based on a large model according to claim 4, characterized in that: The maintenance of the global API transformation list in S23 includes the following steps: S231. Disable the API through the rule engine matching platform and map it to an equivalent interface; S232. Use abstract syntax trees to analyze code structure, identify and replace incompatible calls; S233: Record conversion logs to support conversion path backtracking and rule optimization.

6. The method for generating cross-platform page code based on a large model according to claim 1, characterized in that: The process of generating a page object description tree in S3 includes the following steps: S31. Organize the parsed component nesting relationship in a tree structure, associate each node with an attribute mapping table, and bind visual attributes to CSS variables; S32. Mark the triggering conditions and associated data fields of the interaction logic in the event hook, and bind the pre-condition / post-condition validation functions; S33. Add input / output processing functions to component nodes, including numerical range constraints and callback event bindings, to generate an enhanced description tree structure.

7. The method for generating cross-platform page code based on a large model according to claim 6, characterized in that: The pre- / post-condition binding of the event hook in S32 includes the following steps: S321. Bind validation functions to form submission events to ensure data compliance; S322. Inject timeout and retry mechanisms into asynchronous operation events; S323. Ensure the consistency between the event triggering order and the data flow through dependency analysis.

8. The method for generating cross-platform page code based on a large model according to claim 1, characterized in that: The sandbox testing and automatic correction in S4 include the following steps: S41. After generating the page code, perform static analysis and automatically inject test stubs for dynamic testing requirements; S42. Simulate user operation paths using a dynamic sandbox to verify the correctness of event logic and interaction responses; S43. If the test fails, the rule base is called to generate an alternative solution based on the error type, and the solution is iteratively corrected until it passes the verification.

9. The method for generating cross-platform page code based on a large model according to claim 1, characterized in that: The output of the unified compilation engine in S5 includes the following steps: S51. Dynamically select the compilation strategy based on the characteristics of the target platform and send the intermediate code into the compilation engine; S52. Output WXML, WXSS, and JS packages for the WeChat Mini Program platform; S53. Generate HTML, CSS, and JS single-page applications for the H5 platform; S54, for native App platforms, is packaged into a system installation package using a native rendering engine.

10. The method for generating cross-platform page code based on a large model according to claim 1, characterized in that: The adaptive optimization engine in S6 includes the following steps: S61. Collect error type and frequency data in sandbox testing and build an error pattern knowledge base; S62. Use reinforcement learning algorithms to dynamically adjust the attention weights and platform adaptation rules of the image parsing model; S63. Regularly update model parameters and rule base, and push them to the code generation pipeline to achieve closed-loop optimization.

Citation Information

Cited By

  • A declarative ui automation cross-platform translation method

    CN122331956A