Interface code automatic generation method based on syntax tree
By using syntax trees to generate UI code in the Unity engine, the development process of the UI and the program is decoupled, solving the problem of long development time and low efficiency caused by the coupling of UI and program, and achieving efficient code generation and management.
Patent Information
- Authority / Receiving Office
- CN · China
- Patent Type
- Patents(China)
- Current Assignee / Owner
- ZHEJIANG HUAYE NETWORK TECH CO LTD
- Filing Date
- 2023-01-10
- Publication Date
- 2026-04-10
AI Technical Summary
In game interface development, the coupling between the interface and the program is complex, resulting in long development time and low efficiency, and making it difficult to decouple the workload between different roles.
The method of automatically generating interface code based on syntax tree is adopted. By creating interface prefabs in the Unity engine and attaching UIEntity and UIComponent scripts, a syntax tree is generated and finally Lua code is generated, thus decoupling the interface and the program.
It improved game development efficiency, reduced repetitive work, standardized coding practices, and facilitated code management and adjustments.
Smart Images

Figure CN117331552B_ABST
Abstract
Description
TECHNICAL FIELD
[0001] The application belongs to the technical field of software, and relates to a code generation method, in particular to an interface code automatic generation method based on a syntax tree. BACKGROUND
[0002] At present, a large number of game software uses interfaces to interact with users, and the interfaces in the game often occupy a lot of development time because of the large number and complicated functions, and the interfaces are often associated and coupled with each other, which brings additional workload.
[0003] The two most important parts in the interface development process are: 1, interactive production interface, 2, program implementation function. The two often have a close coupling relationship, for example, the interactive modification of the hierarchical order of the nodes in the interface will affect the running of the code in the program. For example, the interactive addition of the nodes in the game requires the program to consume time to add new code for binding. How to decouple the work between various types of work and improve the development efficiency has become an important problem to speed up the game development. SUMMARY
[0004] To solve the above problems, the application discloses an interface code automatic generation method based on a syntax tree. First, the interaction completes the production of the interface prefabricate in the Unity engine, and names each node in the interface. Then, the program first mounts the UIEntity script on the root node of the interface, and then mounts the UIComponent script on the node that needs to export the binding relationship. Finally, the program internally generates the syntax tree according to the mounted UIComponet script, and then generates the final Lua code from the syntax tree.
[0005] To achieve the above purpose, the technical scheme of the application is as follows:
[0006] The interface code automatic generation method based on the syntax tree comprises the following steps:
[0007] Step 1, obtain new planning requirements, and according to the new requirements, the interaction produces the interface prefabricate in the Unity engine, and names each node in the interface;
[0008] Step 2, mount the UIEntity script on the interface to mark that it is the root node of the interface;
[0009] Step 3, mount the UIComponent script on the node that needs to export the binding relationship to mark that it is the node that needs to be exported;
[0010] Step 4, execute the "code generation" function;
[0011] Step 5, the code first creates a data structure of the root node, which represents the entire code file, and specific nodes can be inserted into the structure;
[0012] Step 6, under the root node data structure, first add the Class node data, according to the name of the interface prefabricate, set the content of ClassName and InitStatement;
[0013] Step 7, create 3 Function nodes, including Constructor, Init and UnInit, which are the basic elements of each interface;
[0014] Step 8, create a Variable node to define a table named ui to store all ui variables exported to Lua;
[0015] Step 9, the code generator traverses the nodes in hierarchical order, generates code according to the data in the nodes, and adds binding code to the Init function to get the components of the node when traversing a node;
[0016] Step 10, generate the syntax tree structure;
[0017] Step 11, starting from the root node, traverse the entire syntax tree in depth, and format the syntax information contained in each traversed node into the corresponding string in the code, and write it to the output, the output order is consistent with the tree structure;
[0018] Step 12, write the output content to the file to generate the final code.
[0019] Further, in step 6, the name of the ClassName variable is assigned to the name of the interface prefabricate, and the content of InitStatement is assigned to the string corresponding to the class definition code.
[0020] Further, in step 9, the event is the callback event after the button is clicked.
[0021] Further, after the code generation is completed, the program can implement related functions in the derived class.
[0022] Further, when the demand is adjusted and the interaction behavior is modified, the hierarchy of the controls in the prefabricate is modified, only need to re-execute "generate code" to regenerate the binding relationship in the base class, that is, execute steps 4-12.
[0023] Further, if the interaction adds a node, it needs to execute step 3 for the new node, and then execute steps 4-12.
[0024] Further, if the interaction deletes a node, then step 4-12 is re-executed.
[0025] Further, when an online problem occurs and temporary binding of a certain unbound UI control is needed, only the Init function in the interface base class needs to be hot modified, so that the UI control in the prefab can be accessed arbitrarily.
[0026] The beneficial effects of the present application are:
[0027] The present application uses the structure of the syntax tree to express the content to be exported when generating the code, so that the code generation has higher freedom, the development efficiency is improved, a large amount of repetitive work is reduced, and the code specification is unified. The present application scheme not only accelerates the efficiency of game development, but also facilitates the management of the code format. BRIEF DESCRIPTION OF DRAWINGS
[0028] Figure 1 A schematic diagram of a traditional code generation method.
[0029] Figure 2 A schematic diagram of the element nesting relationship in the present application.
[0030] Figure 3 A schematic diagram of a DemoTestUI interface.
[0031] Figure 4 A schematic diagram of part of the syntax tree finally generated in the embodiment of the present application.
[0032] Figure 5 A schematic diagram of part of the syntax tree finally generated in the embodiment of the present application.
[0033] Figure 6 A schematic diagram of the code finally generated in the embodiment of the present application.
[0034] Figure 7 A flowchart of the interface code automatic generation method based on the syntax tree provided by the present application. DETAILED DESCRIPTION
[0035] The technical solutions provided by the present application will be described in detail below in combination with specific embodiments, and it should be understood that the following specific embodiments are only used to illustrate the present application and not to limit the scope of the present application.
[0036] Traditional code generation generally uses a template as a benchmark, and then replaces the strings in the template in batches to generate code, such as Figure 1The disadvantage of this way is obvious, that is, lack of flexibility, and cannot generate unique code according to different interface elements. Only the most basic function name and class name can be generated. The application designs a structure that can dynamically modify the exported data. First, we abstract the structure of the interface, a simple interface is composed of many simple elements, such as text, pictures, buttons, but in actual development, more complex situations often occur, such as lists, which often contain a large number of repeated elements. In order to facilitate the description of the nested relationship of these elements, we can split the elements into containers and controls. The root node of the UI is a container, the list is also a container, and the single element in the list is also a container. The text and picture are controls. Containers can contain other containers and controls, while controls are leaf nodes and no longer contain other nodes. The overall structure is as shown in Figure 2 .
[0037] The structure in Figure 2 is described from the perspective of code generation, wherein:
[0038] Container: In order to reuse the code during development, a type of container often corresponds to a piece of code. For example, in the structure shown in the figure, the root node, the list, and the list element all have their own corresponding code. During code generation, we need to include all the container codes used (load modules).
[0039] Controls are divided into two types, one is the engine's own control, and the other is a custom control.
[0040] Engine's own control: The engine's own control already has a corresponding C# implementation, and it does not need to be included in Lua. It can be used by exporting the path of the control to the code. For components that need to interact with the user, such as Button, it is necessary to listen to the user's click and bind the callback function after clicking.
[0041] Custom control: Custom control is an extension of the engine's own control. For example, a countdown component is equivalent to a more advanced text, which encapsulates the logic of countdown internally and can reduce a lot of secondary development. However, when using a custom control, the code of the control needs to be included.
[0042] The following will illustrate the interface code generation method based on the syntax tree provided by the application through a specific embodiment. In the embodiment of the application, the interface name is DemoTestUI, as shown in Figure 3 , the code generation process is shown in Figure 7 , and specifically includes the following steps:
[0043] (1) Obtain new planning requirements, and interactively make an interface prefab in the Unity engine according to the new requirements, and name each node in the interface.
[0044] (2) Mount the UIEntity script on the DemoTestUI, indicating that this is the root node of an interface.
[0045] (3) Mount the UIComponent script on nodes such as Image, Button, and HeroList that need to export binding relationships, indicating that this is a node that needs to be exported.
[0046] (4) Click the "Generate Code" button.
[0047] (5) The code will first create the data structure of the root node. This structure represents the entire code file, which can insert other specific nodes such as Class nodes (representing class declarations and definitions) and Function nodes (representing function declarations and definitions).
[0048] (6) Under the root node data structure, first add the Class node data, where the variable name of ClassName is assigned the name of the interface prefab, and the content of InitStatement is assigned the string corresponding to the class definition code, such as BaseClass("UIBase").
[0049] (7) Create three Function nodes Constructor (constructor), Init (initialization function), and UnInit (deinitialization function), which are the basic elements of every interface.
[0050] (8) Create a Variable node to define a table named ui for storing all ui variables exported to Lua.
[0051] (9) The code generator will traverse the nodes that need to be exported in hierarchical order, generating code based on the data in the nodes. When traversing the Image node, we add binding code to the Init function. When traversing the Button node, we add binding code and event registration code (callback event after button click) to the Init function, and then add the button's callback function OnButtonBtnClick to the DemoTestUI. The HeroList node is special, first add 2 Require nodes in the root node, indicating that it needs to include the CircularList and HeroRender code modules, then add binding code and initialization code to the Init function, and finally add deinitialization code to the UnInit function.
[0052] (10) The final generated syntax tree structure is shown in Figure 4 , Figure 5 .
[0053] (11) Starting from the root node, the entire syntax tree is traversed in depth, each traversed node formats the syntax information contained by itself into the corresponding string in the code, and writes it into the output. Since it is stored in a tree structure, such traversal can ensure that the output order is consistent with the tree structure.
[0054] (12) The output content is written to a file, and the finally generated code is as shown in Figure 6 .
[0055] (13) After generation (the generated is the base class), the program can implement the related functions in the derived class
[0056] (14) Based on the above method, when the demand is adjusted and the interaction behavior modifies the level of the control in the prefabricated body, only the binding relationship in the base class needs to be re-generated by re-executing "generate code", that is, steps (4)-(12) can be executed.
[0057] (15) If the interaction adds a node, steps (3) and (4)-(12) need to be executed for the newly added node
[0058] (16) If the interaction deletes a node, steps (4)-(12) can be re-executed.
[0059] (17) When an online problem occurs, a certain unbound UI control needs to be temporarily bound, only the Init function in the interface base class needs to be hot modified, and the UI control in the prefabricated body can be accessed arbitrarily. For example, to add a binding function of a btnStart button, only self.ui.btnStart=rootTrans:Find(“testPanel / Button”).gameObject:GetComponent(“Button”) needs to be inserted in the Init function, where “testPanel / Button” represents the search path of the node, that is, the root node->testPanel->Button.
[0060] It should be noted that the above content only illustrates the technical idea of the present application, and cannot limit the protection scope of the present application. For ordinary skilled persons in the art, without departing from the principles of the present application, a number of improvements and refinements can be made, which fall within the protection scope of the claims of the present application.
Claims
1. A method for automatic generation of interface code based on a syntax tree, characterized in that, Includes the following steps: Step 1: Obtain new design requirements, create an interface prefab in the Unity engine based on the new requirements, and name each node in the interface. Step 2: Attach the UIEntity script to the interface and mark it as the root node of the interface; Step 3: Attach the UIComponent script to the node where the binding relationship needs to be exported, and mark this as the node that needs to be exported; Step 4: Execute the "Generate Code" function; Step 5: First, create the root node's data structure in the code. The data structure represents the entire code file, and specific nodes can be inserted into the structure. Step 6: Under the root node data structure, first add data for the Class node, and set the contents of ClassName and InitStatement according to the name in the interface prefab; Step 7: Create 3 Function node functions, including: Constructor (constructor function), Init (initialization function), and UnInit (deinitialization function). These 3 functions are essential basic elements for every interface. Step 8: Create a Variable node to define a table named ui, which will store all ui variables exported to Lua; Step 9: The code generator traverses the nodes to be exported in hierarchical order and generates code based on the data in the nodes; when traversing to a node, it adds binding code to the Init function to obtain the component of that node; Step 10, the generated syntax tree structure; Step 11: Starting from the root node, perform a depth-first traversal of the entire syntax tree. Each node that is traversed formats the syntax information it contains into the corresponding string in the code and writes it into the output. The output order is consistent with the tree structure. Step 12: Write the output to a file to generate the final code.
2. The method for automatically generating interface code based on syntax trees according to claim 1, characterized in that, In step 6, the name of the ClassName variable is assigned to the name in the interface prefab, and the content of the InitStatement is assigned to the string corresponding to the class definition code.
3. The method for automatically generating interface code based on syntax trees according to claim 1, characterized in that, The event in step 9 is the callback event after the button is clicked.
4. The method for automatically generating interface code based on syntax trees according to claim 1, characterized in that, Once the code is generated, the program can implement the relevant functions in the derived class.
5. The method for automatically generating interface code based on syntax trees according to claim 1, characterized in that, When requirements change and the interaction behavior modifies the hierarchy of controls in the prefab, you only need to re-execute "Generate Code" to regenerate the binding relationship in the base class, i.e., execute step 4-12.
6. The method for automatically generating interface code based on syntax trees according to claim 1, characterized in that, If the interaction adds nodes, then you need to perform step 3 for the new nodes, and then perform steps 4-12.
7. The method for automatically generating interface code based on syntax trees according to claim 1, characterized in that, If the interaction deletes a node, then repeat step 4-12.
8. The method for automatically generating interface code based on syntax trees according to claim 1, characterized in that, When an issue arises online and it's necessary to temporarily bind an unbound UI control, simply hot-modify the Init function in the interface base class to access any UI control in the prefab.
Citation Information
Patent Citations
Dynamic card surface real-time display method
CN117323664A