A code generation method, apparatus, device, and storage medium

Abstract

The application provides a code generation method and device, equipment and storage medium. The above method comprises: obtaining N target pages; parsing the N target pages to obtain N control trees corresponding to the N target pages; merging the N control trees according to the menu bar area and the content area of each target page to obtain a target control tree; and converting the target control tree into a front-end page code. In the application, N target pages including a menu bar area and a content area are obtained, N control trees corresponding to the N target pages are obtained, the N control trees are then merged to obtain a target control tree, and finally the target control tree is converted into a front-end page code. In this way, a multi-tab front-end interface with a menu bar switching function can be automatically generated in one code generation process, the generation mode of the front-end page code is enriched, and the code generation efficiency is improved.

Description

Technical Field

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

[0002] With the development of artificial intelligence technology, the field of software development has begun to use artificial intelligence technology to automatically generate code, in order to reduce the workload of software developers.

[0003] Currently, in the method of automatically generating front-end page code using application code generation tools, only the code for a single front-end interface can be generated. For multi-tab front-end interfaces with menu bar switching functions, existing code generation tools cannot generate the code for that front-end page in a single code generation process. Summary of the Invention

[0004] The main objective of this invention is to provide a code generation method, apparatus, device, and storage medium. The aim is to enrich the methods for generating front-end page code and improve the efficiency of code generation.

[0005] To achieve the above objectives, the present invention provides a code generation method, the method comprising: Obtain N target pages, each target page including a pre-marked menu bar area and a pre-marked content area, and the menu bar area included in each target page is the same, where N is a positive integer greater than 1; The N target pages are parsed to obtain N control trees that correspond one-to-one with the N target pages; Based on the menu bar area and the content area of ​​each target page, merge the N control trees to obtain the target control tree; The target control tree is converted into front-end page code.

[0006] Optionally, obtaining N target pages includes: Get N design pages; Receive a first input for any of the N design pages, and a second input for each design page; Based on the first input, the menu bar area pre-marked for each design page is determined, and based on N second inputs, the content area pre-marked for each design page is determined, resulting in N target pages.

[0007] Optionally, parsing the N target pages to obtain N control trees corresponding one-to-one with the N target pages includes: The N target pages are parsed to obtain the menu bar area and N content areas; A first node is generated based on the menu bar area, and N second nodes are generated based on the N content areas; Based on N page nodes, the first node, and the N second nodes, generate N control trees; The N control trees correspond one-to-one with the N target pages. The first node represents the menu bar area, and the second node represents the content area of ​​the corresponding target page. The node level of the page node is lower than the node levels of the first node and the second node.

[0008] Optionally, each control tree includes a page node, a first node, and a second node. The first node is used to represent the menu bar area, and the second node is used to represent the content area of ​​the corresponding target page. The node level corresponding to the page node is lower than the node levels corresponding to the first node and the second node. The step of merging the N control trees based on the menu bar area and the content area of ​​each target page to obtain the target control tree includes: Merge the N control trees to obtain a candidate control tree. The candidate control tree includes a root node, N page nodes, N first nodes, and N second nodes. The node level corresponding to the root node is lower than the node level corresponding to the page nodes. The node level corresponding to the page nodes is lower than the node levels corresponding to the first nodes and the second nodes. The N second nodes are encapsulated to obtain container nodes; Merge the N page nodes and the N first nodes to obtain the menu bar node; Construct the target control tree based on the root node, the menu bar node, the container node, and the N second nodes; Wherein, the node level corresponding to the root node in the target control tree is lower than the node level corresponding to the menu bar node and the container node, and the node level corresponding to the menu bar node and the container node is lower than the node level corresponding to the N second nodes.

[0009] Optionally, merging the N page nodes and the N first nodes to obtain the menu bar node includes: Obtain the target projection method of the menu bar area represented by the first node; Obtain the display properties of each control in the menu bar area represented by the first node; Merge the N page nodes and the N first nodes to obtain the menu bar node; The menu bar node is used to represent the menu bar interface. The projection method of the menu bar interface is the same as the target projection method. The display attributes of each control in the menu bar interface are determined based on the display attributes of each control in the menu bar area.

[0010] Optionally, the encapsulation of the N second nodes to obtain a container node includes: The multi-tab container control is invoked to encapsulate the N second nodes; Container nodes are generated based on the encapsulated multi-tab container control.

[0011] Optionally, converting the target control tree into front-end page code includes: The target control tree is converted into structured text using a pre-defined code generation tool. Determine the operating platform on which the front-end page code is applied; The code generation tool is used to convert the structured text into front-end page code corresponding to the operating platform.

[0012] Furthermore, to achieve the above objectives, the present invention also provides a code generation apparatus, the apparatus comprising: The acquisition module is used to acquire N target pages, each target page including a pre-marked menu bar area and a pre-marked content area, and the menu bar area included in each target page is the same, where N is a positive integer greater than 1; The parsing module is used to parse the N target pages to obtain N control trees that correspond one-to-one with the N target pages; The merging module is used to merge the N control trees according to the menu bar area and the content area of ​​each target page to obtain the target control tree; The conversion module is used to convert the target control tree into front-end page code.

[0013] To address the aforementioned technical problems, this application also provides a computer device that employs the following technical solution: The computer device includes a memory and a processor. The memory stores a computer program, and when the processor executes the computer program, it implements the steps of the code generation method proposed in any of the embodiments of this application.

[0014] To address the aforementioned technical problems, embodiments of this application also provide a computer-readable storage medium storing a computer program, which, when executed by a processor, implements the steps of any of the code generation methods proposed in the embodiments of this application.

[0015] This application provides a code generation method, apparatus, device, and storage medium. The method includes: acquiring N target pages, each target page including a pre-marked menu bar area and a pre-marked content area, and the menu bar area included in each target page is the same, where N is a positive integer greater than 1; parsing the N target pages to obtain N control trees corresponding one-to-one with the N target pages; merging the N control trees according to the menu bar area and the content area of ​​each target page to obtain a target control tree; and converting the target control tree into front-end page code. In this application, by acquiring N target pages including menu bar areas and content areas, obtaining N control trees corresponding to the N target pages, merging the N control trees to obtain the target control tree, and finally converting the target control tree into front-end page code, a multi-tab front-end interface with menu bar switching function can be automatically generated in a single code generation process, enriching the generation methods of front-end page code and improving the efficiency of code generation. Attached Figure Description

[0016] To more clearly illustrate the solutions in this application, the accompanying drawings used in the description of the embodiments of this application will be briefly introduced below. Obviously, the accompanying drawings described below are some embodiments of this application. For those skilled in the art, other drawings can be obtained based on these drawings without creative effort.

[0017] Figure 1 This is a flowchart illustrating the code generation method provided in an embodiment of this application; Figure 2 This is a schematic diagram of the control tree structure provided in the embodiments of this application; Figure 3 This is a schematic diagram of the candidate control tree structure provided in an embodiment of this application; Figure 4 This is a schematic diagram of the target control tree structure provided in the embodiments of this application; Figure 5 This is a schematic diagram of the structure of the code generation apparatus provided in the embodiments of this application; Figure 6 This is a basic structural block diagram of a computer device provided in the embodiments of this application. Detailed Implementation

[0018] The code generation method provided in this invention is applied to a code generation apparatus. Unless otherwise defined, all technical and scientific terms used herein have the same meaning as commonly understood by one of ordinary skill in the art to which this application pertains. The terminology used herein is for the purpose of describing specific embodiments only and is not intended to limit the application. The terms "comprising" and "having," and any variations thereof, in the specification, claims, and accompanying drawings of this application are intended to cover non-exclusive inclusion. The terms "first," "second," etc., in the specification, claims, or accompanying drawings of this application are used to distinguish different objects, not to describe a specific order.

[0019] In this document, the term "embodiment" means that a particular feature, structure, or characteristic described in connection with an embodiment may be included in at least one embodiment of this application. The appearance of this phrase in various places throughout the specification does not necessarily refer to the same embodiment, nor is it a separate or alternative embodiment mutually exclusive with other embodiments. It will be explicitly and implicitly understood by those skilled in the art that the embodiments described herein can be combined with other embodiments.

[0020] Please refer to Figure 1 The flowchart illustrates an embodiment of the code generation method according to this application. The code generation method provided in this application is applied to a code generation apparatus, and the method includes the following steps: Step 101: Obtain N target pages. Each target page includes a pre-marked menu bar area and a pre-marked content area. The menu bar areas included in each target page are the same. N is a positive integer greater than 1.

[0021] In this step, N target pages are obtained.

[0022] The target page includes a menu bar area and a content area, which are pre-marked, and the menu bar area is the same for each target page.

[0023] Step 102: parse the N target pages to obtain N control trees that correspond one-to-one with the N target pages.

[0024] In this step, for each target page, a parsing tool can be applied to traverse all controls on the target page. Based on the coordinate position of the control, it matches the range of the pre-marked menu bar area or content area, and groups the controls that fall into the menu bar area into the menu bar group and the controls that fall into the content area into the content group.

[0025] Furthermore, based on the parsing of N target pages, N control trees are constructed. For details on how to construct the control trees, please refer to subsequent examples.

[0026] Step 103: Based on the menu bar area and the content area of ​​each target page, merge the N control trees to obtain the target control tree.

[0027] In this step, after obtaining N control trees, the N control trees are merged according to the menu bar area and the N content areas to obtain the target control tree. For specific implementation details, please refer to the following embodiments.

[0028] Step 104: Convert the target control tree into front-end page code.

[0029] In this step, the target control tree is converted into front-end page code that can run on the front end.

[0030] Optionally, the target control tree can be first converted into an intermediate format of structured text, and then the corresponding transcoder can be called to convert the structured text into a code file that can be run on the operating platform.

[0031] In this embodiment, N target pages, including menu bar areas and content areas, are obtained, and N control trees corresponding to the N target pages are obtained. Then, the N control trees are merged to obtain the target control tree. Finally, the target control tree is converted into front-end page code. Through the above method, a multi-tab front-end interface with menu bar switching function can be automatically generated in one code generation process, which enriches the generation method of front-end page code and improves the efficiency of code generation.

[0032] Optionally, obtaining N target pages includes: Get N design pages; Receive a first input for any of the N design pages, and a second input for each design page; Based on the first input, the menu bar area pre-marked for each design page is determined, and based on N second inputs, the content area pre-marked for each design page is determined, resulting in N target pages.

[0033] In this embodiment, one optional implementation is to obtain N design pages, wherein the design pages are pages created by designers using design tools.

[0034] The first input mentioned above refers to the user's operation of marking the menu bar area on any of the N design pages. It should be understood that since all tabs in a multi-tab page share the same menu bar, marking the menu bar area only once on any one design page will automatically apply the scope of that menu bar area to all other design pages.

[0035] The second input mentioned above refers to the user's operation of marking content areas on each design page. Specifically, for each design page, the user selects the range of content areas on the design page by dragging the mouse, selecting with a box, or other similar methods.

[0036] In this embodiment, the position and size of the menu bar area are determined based on the first input, and the labeling information of the menu bar area is associated with each design page; the position and size of the content area of ​​each of the N design pages are determined based on the N second inputs, and are associated with the corresponding design pages respectively.

[0037] After the above annotation process, N annotated target pages are obtained. Each target page has its menu bar area and content area annotated.

[0038] In one alternative implementation, users are allowed to modify, delete, or re-annotate marked areas to accommodate iterative modifications to the design draft.

[0039] This embodiment provides an intuitive and convenient interaction method, enabling users to complete the annotation work of multi-tab pages through simple click and selection operations, thus improving the convenience of annotation operations.

[0040] Optionally, parsing the N target pages to obtain N control trees corresponding one-to-one with the N target pages includes: The N target pages are parsed to obtain the menu bar area and N content areas; A first node is generated based on the menu bar area, and N second nodes are generated based on the N content areas; Based on N page nodes, the first node, and the N second nodes, generate N control trees; The N control trees correspond one-to-one with the N target pages. The first node represents the menu bar area, and the second node represents the content area of ​​the corresponding target page. The node level of the page node is lower than the node levels of the first node and the second node.

[0041] In this embodiment, a page parsing tool can be used to parse N target pages, read the area annotation information of each target page, and obtain the menu bar area and N content areas.

[0042] For each target page, a first node is generated based on the menu bar area of ​​that target page. This first node is a container control node, meaning that it includes all controls, text, icons, etc., within the menu bar area.

[0043] For each target page, a second node is generated based on the content area of ​​that target page. This second node is also a container control node, meaning that it includes all controls, text, icons, etc., within that content area.

[0044] For each target page, create a page node as the root node of its control tree. Attach the first node of that target page as a child node to the page node; also attach the second node of that target page as a child node to the page node. Optionally, other area controls on the target page can also be attached as child nodes of the page node. For better understanding, please refer to [link to documentation]. Figure 2 , Figure 2 This is a schematic diagram of the control tree structure provided in the embodiments of this application. Figure 2 Three control trees are shown, each consisting of one page node, one first node, and one second node.

[0045] This embodiment parses the target page to obtain a control tree, realizing the transformation from the annotated target page to a structured control tree, laying the data foundation for subsequent control tree merging operations.

[0046] Optionally, each control tree includes a page node, a first node, and a second node. The first node is used to represent the menu bar area, and the second node is used to represent the content area of ​​the corresponding target page. The node level corresponding to the page node is lower than the node levels corresponding to the first node and the second node. The step of merging the N control trees based on the menu bar area and the content area of ​​each target page to obtain the target control tree includes: Merge the N control trees to obtain a candidate control tree. The candidate control tree includes a root node, N page nodes, N first nodes, and N second nodes. The node level corresponding to the root node is lower than the node level corresponding to the page nodes. The node level corresponding to the page nodes is lower than the node levels corresponding to the first nodes and the second nodes. The N second nodes are encapsulated to obtain container nodes; Merge the N page nodes and the N first nodes to obtain the menu bar node; Construct the target control tree based on the root node, the menu bar node, the container node, and the N second nodes; Wherein, the node level corresponding to the root node in the target control tree is lower than the node level corresponding to the menu bar node and the container node, and the node level corresponding to the menu bar node and the container node is lower than the node level corresponding to the N second nodes.

[0047] In this embodiment, a brand new root node can be created, and the root nodes of the N control trees, i.e., the N page nodes, can be used as child nodes of the new root node to obtain the candidate control tree.

[0048] For easier understanding, please refer to Figure 3 , Figure 3 This is a schematic diagram of the candidate control tree structure provided in an embodiment of this application. Figure 3 The structure of the candidate control tree shown is as follows: root node → 3 page nodes → the first and second nodes contained under each page node.

[0049] In this embodiment, a multi-tab container control can be invoked to uniformly encapsulate N second nodes, generating a single container node. The aforementioned multi-tab container control is a container control used to hold multiple tabs, such as TabView and ViewPager controls commonly used in mobile application development.

[0050] In this embodiment, N first nodes are extracted from the candidate control tree. These N first nodes are then comprehensively analyzed to extract the common menu bar structure and style, generating a unified menu bar node. For detailed implementation methods, please refer to subsequent embodiments.

[0051] In this embodiment, the root node, menu bar node, container node, and N second nodes are merged to construct the target control tree.

[0052] For easier understanding, please refer to Figure 4 , Figure 4 This is a schematic diagram of the target control tree structure provided in the embodiments of this application. Figure 4 The structure of the target control tree shown is: root node → menu bar node and container node → container node contains N second nodes.

[0053] In this embodiment, the above method is used to merge N independent control trees into a single target control tree with multi-tab switching logic. Optionally, merging the N page nodes and the N first nodes to obtain the menu bar node includes: Obtain the target projection method of the menu bar area represented by the first node; Obtain the display properties of each control in the menu bar area represented by the first node; Merge the N page nodes and the N first nodes to obtain the menu bar node; The menu bar node is used to represent the menu bar interface. The projection method of the menu bar interface is the same as the target projection method. The display attributes of each control in the menu bar interface are determined based on the display attributes of each control in the menu bar area.

[0054] In this embodiment, the distribution characteristics of each control in the menu bar area represented by the first node are obtained to determine whether the menu bar is horizontally or vertically laid out. If the tabs in the menu bar are arranged horizontally, the menu bar is horizontally laid out; if the tabs are arranged vertically, the menu bar is vertically laid out.

[0055] Based on the layout orientation determination, the corresponding target projection method is determined. Specifically, for a horizontal menu bar, a vertical projection method is used to divide the menu bar into multiple groups, that is, to arrange the various tabs in the menu bar along the horizontal direction.

[0056] For vertical menu bars, a horizontal projection method is used to divide the menu bar into multiple groups, that is, to arrange the various tab items along the vertical direction.

[0057] In this way, the target projection method of the menu bar area is determined to ensure that each independent tab item can be accurately segmented from the menu bar.

[0058] It should be noted that the above display attributes include, but are not limited to: the text content of the control, font size, font color, font weight, whether there is an underline, underline color, background color, icon, padding, and other style attributes.

[0059] In this embodiment, the display properties of each control in the menu bar area are obtained.

[0060] In this embodiment, the tabs in the N menu bars are aligned and matched according to the target projection method to ensure that corresponding tabs from different target pages can be correctly matched. The container size of each tab is uniformly adjusted to a consistent size to ensure that the menu bars do not shift in layout under different states.

[0061] Furthermore, a complete selected and unselected style configuration is generated for each tab item, and these configurations are stored in the corresponding tab item node, thereby organizing all tab item nodes into a single menu bar node.

[0062] In this embodiment, by using the target projection method represented by the first node and the display attributes of each control, the function of extracting the common menu bar style from multiple pages and generating a unified menu bar node is realized, ensuring that the final generated menu bar appears consistently across all tabs.

[0063] Optionally, the encapsulation of the N second nodes to obtain a container node includes: The multi-tab container control is invoked to encapsulate the N second nodes; Container nodes are generated based on the encapsulated multi-tab container control.

[0064] Optionally, the aforementioned multi-tab container control can be a TabView, ViewPager, or other controls commonly used in mobile application development.

[0065] In this embodiment, a multi-tab container control is created, and this multi-tab container control is called to encapsulate N second nodes. The encapsulated multi-tab container control is then converted into a node in the control tree, namely a container node. This container node serves as a direct child node of the root node in the target control tree, and is placed alongside the menu bar node.

[0066] In this embodiment, by encapsulating N second nodes to obtain container nodes, the function of integrating multiple independent content areas into a unified multi-tab container control is realized.

[0067] Optionally, converting the target control tree into front-end page code includes: The target control tree is converted into structured text using a pre-defined code generation tool. Determine the operating platform on which the front-end page code is applied; The code generation tool is used to convert the structured text into front-end page code corresponding to the operating platform.

[0068] In this embodiment, a preset code generation tool is used to convert the target control tree into structured text. Optionally, the structured text is JSON text.

[0069] Furthermore, the operating platform for the front-end page code is determined, including but not limited to iOS, Android, and HTML5 operating platforms. Optionally, the code generation tool also includes a transcoder, which can be invoked to convert the generated structured text into front-end page code corresponding to the operating system.

[0070] For example, for H5 operating platforms, a transcoder can be used to convert structured text into HTML code; for iOS operating platforms, a transcoder can be used to convert structured text into Swift code; and for Android operating platforms, a transcoder can be used to convert structured text into Kotlin code or Java code.

[0071] This embodiment realizes the automated conversion from the target control tree to front-end code for multiple platforms. The generated code can be run directly on the target platform, thereby enriching the way front-end page code is generated and improving the efficiency of code generation.

[0072] Further reference Figure 5 As a response to the above Figure 1 To implement the method shown, this application provides an embodiment of a code generation apparatus 500, which is similar to... Figure 1Corresponding to the method embodiments shown, this device can be specifically applied to various electronic devices.

[0073] An embodiment of the present invention provides a code generation device 500 comprising: The acquisition module 501 is used to acquire N target pages, each target page including a pre-marked menu bar area and a pre-marked content area, and the menu bar area included in each target page is the same, where N is a positive integer greater than 1; The parsing module 502 is used to parse the N target pages to obtain N control trees that correspond one-to-one with the N target pages; The merging module 503 is used to merge the N control trees according to the menu bar area and the content area of ​​each target page to obtain a target control tree; The conversion module 504 is used to convert the target control tree into front-end page code.

[0074] Optionally, the acquisition module 501 is specifically used for: Get N design pages; Receive a first input for any of the N design pages, and a second input for each design page; Based on the first input, the menu bar area pre-marked for each design page is determined, and based on N second inputs, the content area pre-marked for each design page is determined, resulting in N target pages.

[0075] Optionally, the parsing module 502 is specifically used for: The N target pages are parsed to obtain the menu bar area and N content areas; A first node is generated based on the menu bar area, and N second nodes are generated based on the N content areas; Based on N page nodes, the first node, and the N second nodes, generate N control trees; The N control trees correspond one-to-one with the N target pages. The first node represents the menu bar area, and the second node represents the content area of ​​the corresponding target page. The node level of the page node is lower than the node levels of the first node and the second node.

[0076] Optionally, each control tree includes a page node, a first node, and a second node. The first node is used to represent the menu bar area, and the second node is used to represent the content area of ​​the corresponding target page. The node level corresponding to the page node is lower than the node levels corresponding to the first node and the second node. The merging module 503 is specifically used for: Merge the N control trees to obtain a candidate control tree. The candidate control tree includes a root node, N page nodes, N first nodes, and N second nodes. The node level corresponding to the root node is lower than the node level corresponding to the page nodes. The node level corresponding to the page nodes is lower than the node levels corresponding to the first nodes and the second nodes. The N second nodes are encapsulated to obtain container nodes; Merge the N page nodes and the N first nodes to obtain the menu bar node; Construct the target control tree based on the root node, the menu bar node, the container node, and the N second nodes; Wherein, the node level corresponding to the root node in the target control tree is lower than the node level corresponding to the menu bar node and the container node, and the node level corresponding to the menu bar node and the container node is lower than the node level corresponding to the N second nodes.

[0077] Optionally, the merging module 503 is further specifically used for: Obtain the target projection method of the menu bar area represented by the first node; Obtain the display properties of each control in the menu bar area represented by the first node; Merge the N page nodes and the N first nodes to obtain the menu bar node; The menu bar node is used to represent the menu bar interface. The projection method of the menu bar interface is the same as the target projection method. The display attributes of each control in the menu bar interface are determined based on the display attributes of each control in the menu bar area.

[0078] Optionally, the merging module 503 is further specifically used for: The multi-tab container control is invoked to encapsulate the N second nodes; Container nodes are generated based on the encapsulated multi-tab container control.

[0079] Optionally, the conversion module 504 is specifically used for: The target control tree is converted into structured text using a pre-defined code generation tool. Determine the operating platform on which the front-end page code is applied; The code generation tool is used to convert the structured text into front-end page code corresponding to the operating platform.

[0080] To address the aforementioned technical problems, embodiments of this application also provide a computer device. Please refer to [link / reference needed]. Figure 6 , Figure 6This is a basic structural block diagram of the computer device in this embodiment.

[0081] The computer device 6 includes a memory 61, a processor 62, and a network interface 63 that are interconnected via a system bus. It should be noted that only the computer device 6 with components 61-63 is shown in the figure; however, it should be understood that it is not required to implement all the shown components, and more or fewer components can be implemented alternatively. Those skilled in the art will understand that the computer device described here is a device capable of automatically performing numerical calculations and / or information processing according to pre-set or stored instructions, and its hardware includes, but is not limited to, microprocessors, field-programmable gate arrays (FPGAs), digital signal processors (DSPs), embedded devices, etc.

[0082] The computer device can be a desktop computer, laptop, handheld computer, or cloud server, etc. The computer device can interact with the user via a keyboard, mouse, remote control, touchpad, or voice control.

[0083] The memory 61 includes at least one type of readable storage medium, including flash memory, hard disk, multimedia card, card-type memory (e.g., SD or DX memory), random access memory (RAM), static random access memory (SRAM), read-only memory (ROM), electrically erasable programmable read-only memory (EEPROM), programmable read-only memory (PROM), magnetic memory, magnetic disk, optical disk, etc. In some embodiments, the memory 61 may be an internal storage unit of the computer device 6, such as the hard disk or memory of the computer device 6. In other embodiments, the memory 61 may also be an external storage device of the computer device 6, such as a plug-in hard disk, smart media card (SMC), secure digital card (SD), flash card, etc., equipped on the computer device 6. Of course, the memory 61 may also include both the internal storage unit and its external storage device of the computer device 6. In this embodiment, the memory 61 is typically used to store the operating platform and various application software installed on the computer device 6, such as program code for code generation methods. In addition, the memory 61 can also be used to temporarily store various types of data that have been output or will be output.

[0084] In some embodiments, the processor 62 may be a central processing unit (CPU), a controller, a microcontroller, a microprocessor, or other data processing chip. The processor 62 is typically used to control the overall operation of the computer device 6. In this embodiment, the processor 62 is used to run program code stored in the memory 61 or process data, for example, to run the program code of the code generation method.

[0085] The network interface 63 may include a wireless network interface or a wired network interface, which is typically used to establish communication connections between the computer device 6 and other electronic devices.

[0086] This application also provides a computer-readable storage medium storing a computer program. When executed by a processor, the computer program implements the various processes of the code generation method embodiments described above and achieves the same technical effects. To avoid repetition, it will not be described again here. The computer-readable storage medium may include a read-only memory (ROM), a random access memory (RAM), a magnetic disk, or an optical disk.

[0087] Through the above description of the embodiments, those skilled in the art can clearly understand that the methods of the above embodiments can be implemented by means of software plus necessary general-purpose hardware online platforms. Of course, they can also be implemented by hardware, but in many cases the former is a better implementation method. Based on this understanding, the technical solution of this application, in essence, or the part that contributes to the prior art, can be embodied in the form of a software product. This computer software product is stored in a storage medium (such as ROM / RAM, magnetic disk, optical disk) and includes several instructions to cause a terminal device (which may be a mobile phone, computer, server, air conditioner, or network device, etc.) to execute the methods described in the various embodiments of this application.

[0088] This application can be used in a wide variety of general-purpose or special-purpose computer system environments or configurations. Examples include: personal computers, server computers, handheld or portable devices, tablet devices, multiprocessor systems, microprocessor-based systems, set-top boxes, programmable consumer electronics, network PCs, minicomputers, mainframe computers, and distributed computing environments including any of the above systems or devices. This application can be described in the general context of computer-executable instructions executed by a computer, such as program modules. Generally, program modules include routines, programs, objects, components, data structures, etc., that perform specific tasks or implement specific abstract data types. This application can also be practiced in distributed computing environments where tasks are performed by remote processing devices connected via a communication network. In distributed computing environments, program modules can reside in local and remote computer storage media, including storage devices.

[0089] Obviously, the embodiments described above are only some embodiments of this application, not all embodiments. The accompanying drawings show preferred embodiments of this application, but do not limit the patent scope of this application. This application can be implemented in many different forms; rather, the purpose of providing these embodiments is to provide a more thorough and comprehensive understanding of the disclosure of this application. Although this application has been described in detail with reference to the foregoing embodiments, those skilled in the art can still modify the technical solutions described in the foregoing specific embodiments, or make equivalent substitutions for some of the technical features. Any equivalent structures made using the content of this application's specification and drawings, directly or indirectly applied to other related technical fields, are similarly within the scope of patent protection of this application.

Claims

1. A code generation method, characterized in that, The method includes: Obtain N target pages, each target page including a pre-marked menu bar area and a pre-marked content area, and the menu bar area included in each target page is the same, where N is a positive integer greater than 1; The N target pages are parsed to obtain N control trees that correspond one-to-one with the N target pages; Based on the menu bar area and the content area of ​​each target page, merge the N control trees to obtain the target control tree; The target control tree is converted into front-end page code.

2. The method according to claim 1, characterized in that, The acquisition of N target pages includes: Get N design pages; Receive a first input for any of the N design pages, and a second input for each design page; Based on the first input, the menu bar area pre-marked for each design page is determined, and based on N second inputs, the content area pre-marked for each design page is determined, resulting in N target pages.

3. The method according to claim 1, characterized in that, The step of parsing the N target pages to obtain N control trees corresponding one-to-one with the N target pages includes: The N target pages are parsed to obtain the menu bar area and N content areas; A first node is generated based on the menu bar area, and N second nodes are generated based on the N content areas; Based on N page nodes, the first node, and the N second nodes, generate N control trees; The N control trees correspond one-to-one with the N target pages. The first node represents the menu bar area, and the second node represents the content area of ​​the corresponding target page. The node level of the page node is lower than the node levels of the first node and the second node.

4. The method according to claim 1, characterized in that, Each control tree includes a page node, a first node, and a second node. The first node is used to represent the menu bar area, and the second node is used to represent the content area of ​​the corresponding target page. The node level corresponding to the page node is lower than the node levels corresponding to the first node and the second node. The step of merging the N control trees based on the menu bar area and the content area of ​​each target page to obtain the target control tree includes: Merge the N control trees to obtain a candidate control tree. The candidate control tree includes a root node, N page nodes, N first nodes, and N second nodes. The node level corresponding to the root node is lower than the node level corresponding to the page nodes. The node level corresponding to the page nodes is lower than the node levels corresponding to the first nodes and the second nodes. The N second nodes are encapsulated to obtain container nodes; Merge the N page nodes and the N first nodes to obtain the menu bar node; Construct the target control tree based on the root node, the menu bar node, the container node, and the N second nodes; Wherein, the node level corresponding to the root node in the target control tree is lower than the node level corresponding to the menu bar node and the container node, and the node level corresponding to the menu bar node and the container node is lower than the node level corresponding to the N second nodes.

5. The method according to claim 4, characterized in that, The process of merging the N page nodes and the N first nodes to obtain the menu bar node includes: Obtain the target projection method of the menu bar area represented by the first node; Obtain the display properties of each control in the menu bar area represented by the first node; Merge the N page nodes and the N first nodes to obtain the menu bar node; The menu bar node is used to represent the menu bar interface. The projection method of the menu bar interface is the same as the target projection method. The display attributes of each control in the menu bar interface are determined based on the display attributes of each control in the menu bar area.

6. The method according to claim 4, characterized in that, The process of encapsulating the N second nodes to obtain container nodes includes: The multi-tab container control is invoked to encapsulate the N second nodes; Container nodes are generated based on the encapsulated multi-tab container control.

7. The method according to any one of claims 1 to 6, characterized in that, The step of converting the target control tree into front-end page code includes: The target control tree is converted into structured text using a pre-defined code generation tool. Determine the operating platform on which the front-end page code is applied; The code generation tool is used to convert the structured text into front-end page code corresponding to the operating platform.

8. A code generation device, characterized in that, The device includes: The acquisition module is used to acquire N target pages, each target page including a pre-marked menu bar area and a pre-marked content area, and the menu bar area included in each target page is the same, where N is a positive integer greater than 1; The parsing module is used to parse the N target pages to obtain N control trees that correspond one-to-one with the N target pages; The merging module is used to merge the N control trees according to the menu bar area and the content area of ​​each target page to obtain the target control tree; The conversion module is used to convert the target control tree into front-end page code.

9. A computer device, characterized in that, It includes a memory and a processor, wherein the memory stores a computer program, and the processor executes the computer program to implement the steps of the code generation method as described in any one of claims 1 to 7.

10. A computer-readable storage medium, characterized in that, The computer-readable storage medium stores a computer program that, when executed by a processor, implements the steps of the code generation method as described in any one of claims 1 to 7.

Images