Visual programming method and device, storage medium and electronic equipment
By using a mapping set to find target code fields in the visual programming interface, the problem of poor code readability in visual programming is solved, improving the readability of program content and programming efficiency, and avoiding compilation errors.
Patent Information
- Authority / Receiving Office
- CN · China
- Patent Type
- Applications(China)
- Current Assignee / Owner
- TENCENT TECHNOLOGY (SHENZHEN) CO LTD
- Filing Date
- 2024-10-16
- Publication Date
- 2026-04-17
AI Technical Summary
In existing visual programming methods, the readability of program code is poor, mainly because user-defined names do not conform to naming conventions, resulting in poor readability of the generated code and a high likelihood of compilation errors.
The program receives block creation operations in the visual programming interface, searches for matching relationships of target code objects through the mapping relationship set, obtains the target code fields, and displays the target block in the interface. This avoids directly using user-defined text to generate program content and ensures that code fields conform to naming conventions.
It improves the readability of program content and programming efficiency, avoids compilation errors caused by custom incorrect naming, and ensures that the generated program content conforms to naming conventions.
Smart Images

Figure CN121879740A_ABST
Abstract
Description
Technical Field
[0001] This invention relates to the field of computers, and more specifically, to a visual programming method and apparatus, a storage medium, and an electronic device. Background Technology
[0002] In visual programming environments, developers can typically utilize a series of predefined visual tiles, each corresponding to a predefined piece of program code. By dragging and dropping these predefined visual tiles and configuring them, the processing and visualization of program code becomes quick and easy. This approach significantly improves development efficiency and simplifies the programming process.
[0003] However, in current visual programming practices, the names users define for programming blocks in the visual programming interface are often directly used as the names of the corresponding code objects. Since users tend to define these names arbitrarily, this can lead to poor readability of the generated code. Therefore, existing visual programming methods suffer from the technical problem of poorly readable generated program code.
[0004] There is currently no effective solution to the above problems. Summary of the Invention
[0005] This invention provides a visual programming method and apparatus, storage medium and electronic device to at least solve the technical problem of poor readability of program content obtained by conventional visual programming.
[0006] According to one aspect of the present invention, a visual programming method is provided, comprising: receiving a tile creation operation in a visual programming interface, wherein the visual programming interface is used to receive a tile interaction operation to determine program content matching the tile interaction operation, the tile interaction operation including the tile creation operation, the tile creation operation being used to create a target tile, the target tile being used to represent a target code object in the program content in the visual programming interface; responding to the tile creation operation, searching a target mapping relationship matching the target code object in a mapping relationship set, wherein the mapping relationship set is used to store object mapping relationships, the object mapping relationship including an object identifier and a code field matching the same code object; if the target mapping relationship is found, obtaining a target code field indicating the target code object from the target mapping relationship; determining the program content matching the target tile based on the target code field, and displaying the target tile in the visual programming interface.
[0007] According to another aspect of the present invention, a visual programming apparatus is also provided, comprising: a receiving unit, configured to receive a tile creation operation in a visual programming interface, wherein the visual programming interface is configured to receive a tile interaction operation to determine program content matching the tile interaction operation, the tile interaction operation including the tile creation operation, the tile creation operation being used to create a target tile, the target tile being used to represent a target code object in the program content in the visual programming interface; a searching unit, configured to, in response to the tile creation operation, search a mapping relationship set for a target mapping relationship matching the target code object in a mapping relationship set, wherein the mapping relationship set is used to store object mapping relationships, the object mapping relationship including an object identifier and a code field matching the same code object; an obtaining unit, configured to, when the target mapping relationship is found, obtain a target code field from the target mapping relationship for indicating the target code object; and a display unit, configured to determine the program content matching the target tile based on the target code field, and display the target tile in the visual programming interface.
[0008] In some embodiments, the receiving unit includes: a receiving module, configured to determine that a first block creation operation has been received in response to dragging a reference block displayed in the first operation area of the visual programming interface to the second operation area of the visual programming interface, wherein the block creation operation includes the first block creation operation, the first operation area is used to display a created object block, and the object block includes the reference block; the display unit includes: a display module, configured to display the target block in the second operation area, wherein the target block and the reference block represent the same target code object in the program content in the visual programming interface, and the second operation area is used to display the object block in a block operation state.
[0009] In some embodiments, the search unit includes: an acquisition module, configured to acquire a target function identifier for indicating a target function object based on the block description information of the target block when the block type of the target block is a function block type, wherein the target code object includes the target function object; and a search module, configured to search for the target mapping relationship in a first mapping relationship set based on the target function identifier.
[0010] In some embodiments, the acquisition module is configured to: acquire a target function name field that matches the target function object from the target mapping relationship, wherein the first mapping relationship set is used to store function object mapping relationships, and the function object mapping relationship includes a function identifier and a function name field that match the same function object.
[0011] In some embodiments, the search unit is further configured to: when a reference block of parameter block type is displayed in a sub-region of a block associated with the target block, obtain a target parameter identifier from the block description information of the reference block, wherein the reference block is used to represent a target parameter object in the program content in the visual programming interface, and the target parameter object is used to pass data to be processed to the target function object; obtain a set of parameter information associated with the target block, wherein the set of parameter information includes at least one target parameter identifier and parameter indexes that respectively match at least one of the target parameter identifiers; and when a target parameter index is found in the set of parameter information based on the target parameter identifier, determine a target parameter name field based on the target parameter index, wherein the target parameter name field is used to indicate the target parameter object in the program content.
[0012] In some embodiments, the search unit is configured to: when the block type of the target block is a variable block type, obtain a target variable identifier for indicating a target variable object based on the block description information of the target block, wherein the target code object includes the target variable object; and, when a target mapping relationship is found based on the target variable identifier in the second mapping relationship set, obtain a target variable name field that matches the target variable object from the target mapping relationship, wherein the second mapping relationship set is used to store variable object mapping relationships, and the variable object mapping relationships include variable identifier and variable name fields that match the same variable object.
[0013] In some embodiments, the receiving unit is configured to: determine that a second block creation operation has been received in response to a trigger operation on the block creation control in the visual programming interface, wherein the block creation operation includes the second block creation operation, which is used to create the target block in the visual programming interface; the display unit is configured to display the target block in a first operation area and a second operation area in the visual programming interface; or, display the target block in the first operation area; and display the target block in the second operation area in response to dragging the target block to the second operation area; wherein the first operation area is used to display created object blocks, and the second operation area is used to display object blocks in an operation state.
[0014] In some embodiments, the receiving unit is configured to: display at least one operation control for defining a target function object in the first operation area when the block creation control is a function block creation control; and display the target block of the function block type determined according to the function block definition operation in the first operation area and the second operation area in response to a function block definition operation based on at least one of the operation controls.
[0015] In some embodiments, the receiving unit is further configured to: when a reference block of parameter block type is displayed in a sub-region of a first block related to the function block definition operation in the second operation area, obtain a set of parent blocks that have a block nesting relationship with the target block, wherein the first block is used to describe the function object operation of the target function object that matches the target block; when the target block is included in the set of parent blocks, search for the object index of the parameter object indicated by the reference block in the parameter object set of the target function object; and determine the target code field that matches the parameter object based on the object index.
[0016] In some embodiments, the receiving unit is configured to: display the target block of variable block type in the first operation area when the block creation control is a variable block creation control, wherein the block display style of the target block matches the variable type of the variable object represented by the target block; and display the target block in the second operation area in response to dragging the target block to the second operation area.
[0017] In some embodiments, the above-described visual programming apparatus further includes: a creation unit, configured to, when the target mapping relationship is not found, determine the object type of the target code object based on the block type of the target tile; determine the target code field that matches the target code object based on the type description field that matches the object type and the identification information assigned to the target code object; and add the target mapping relationship that indicates the target object identifier and the target code field to the mapping relationship set.
[0018] In some embodiments, the creation unit is configured to: when the object type of the target code object represented by the target tile is a function type, obtain a first field matching the function type; concatenate the first field with the identification information to obtain the target code field matching the target code object; when the object type of the target code object represented by the target tile is a global variable type, obtain a second field matching the global variable type; concatenate the second field with the identification information to obtain the target code field matching the target code object; when the object type of the target code object represented by the target tile is a local variable type, obtain a third field matching the current operation page, wherein the visual programming interface includes at least one operation page; concatenate the third field with the identification information to obtain the target code field matching the target code object, wherein the third field is used to indicate the current operation page.
[0019] In some embodiments, the creation unit is configured to: when the object type of the target code object represented by the target tile is a local variable type, search for a third mapping relationship in a third mapping relationship set based on the third field, wherein the third mapping relationship set is used to store reference mapping relationships between operation pages and the number of local variables, the reference mapping relationship includes a page field for indicating the operation page, and the number of local variable objects corresponding to the operation page; when the third mapping relationship is searched in the third mapping relationship set, use the page field contained in the third mapping relationship as the third field, and determine the identification information based on the number of objects; when the third mapping relationship is not searched in the third mapping relationship set, create the third mapping relationship in the third mapping relationship set; use the page field contained in the third mapping relationship as the third field, and assign the identification information to the target code object.
[0020] In some embodiments, the above-described visual programming apparatus further includes: a viewing unit, configured to display the program content in response to a program content viewing operation, wherein the target code field in the program content used to indicate the target code object is different from the reference description field displayed in the visual programming interface, and the reference description field is text content displayed on the target block.
[0021] In some embodiments, the viewing unit is further configured to: in response to a first switching display operation, replace the target code field in the program content with the reference description field to obtain reference program content; and display the updated reference program content.
[0022] In some embodiments, the viewing unit is further configured to: display target prompt text in a reference display area related to the program content, wherein the target prompt text is used to indicate the reference description field corresponding to the target code field.
[0023] In some embodiments, the viewing unit is further configured to: update the target code field to the reference code field indicated by the editing operation in response to the editing operation of the target code field in the program content; replace the target code field in the target mapping relationship according to the reference code field; and update the mapping relationship set according to the updated target mapping relationship.
[0024] In some embodiments, the above-described visual programming apparatus further includes: a storage unit, configured to send the program content to a target server in response to a save operation triggered in the above-described visual programming interface, wherein the target server is configured to store the program content sent by multiple terminal devices according to their respective program content.
[0025] According to another aspect of the present invention, a computer-readable storage medium is also provided, wherein a computer program is stored in the computer program, and the computer program is configured to execute the above-described visual programming method at runtime.
[0026] According to another aspect of the embodiments of this application, a computer program product is provided, the computer program product including a computer program / instructions stored in a computer-readable storage medium. A processor of a computer device reads the computer program / instructions from the computer-readable storage medium, and executes the computer program / instructions, causing the computer device to perform the visual programming method described above.
[0027] According to another aspect of the present invention, an electronic device is also provided, including a memory and a processor, wherein the memory stores a computer program and the processor is configured to execute the above-described visual programming method through the computer program.
[0028] In this embodiment of the invention, a tile creation operation is received in the visual programming interface; in response to the tile creation operation, a target mapping relationship matching the target code object is searched in the mapping relationship set, wherein the mapping relationship set is used to store object mapping relationships, and the object mapping relationship includes an object identifier and a code field matching the same code object; if a target mapping relationship is found, a target code field for indicating the target code object is obtained from the target mapping relationship; the target code field determines the program content matching the target tile, and the target tile is displayed in the visual programming interface, thereby representing the code object in the program content according to the code field stored in the mapping relationship set during the user's tile interaction operation based on the visual programming interface, avoiding the direct generation of program content based on the user's custom text input, and improving the readability of the program content.
[0029] Furthermore, even when the user-inputted custom text does not conform to the naming conventions of code objects, the program content can be generated directly based on the target code fields that conform to the naming conventions, since the code fields stored in the mapping relationship set are used to generate the program content. This avoids program errors caused by incorrect user-defined naming and improves the programming efficiency of visual programming. Attached Figure Description
[0030] The accompanying drawings, which are included to provide a further understanding of the invention and form part of this application, illustrate exemplary embodiments of the invention and, together with their description, serve to explain the invention and do not constitute an undue limitation thereof. In the drawings:
[0031] Figure 1 This is a schematic diagram of the hardware environment for an optional visual programming method according to an embodiment of the present invention;
[0032] Figure 2 This is a flowchart of an optional visual programming method according to an embodiment of the present invention;
[0033] Figure 3 This is a schematic diagram of an optional visual programming method according to an embodiment of the present invention;
[0034] Figure 4 This is a schematic diagram of another optional visual programming method according to an embodiment of the present invention;
[0035] Figure 5 This is a schematic diagram of another optional visual programming method according to an embodiment of the present invention;
[0036] Figure 6 This is a schematic diagram of another optional visual programming method according to an embodiment of the present invention;
[0037] Figure 7This is a schematic diagram of another optional visual programming method according to an embodiment of the present invention;
[0038] Figure 8 This is a schematic diagram of another optional visual programming method according to an embodiment of the present invention;
[0039] Figure 9 This is a schematic diagram of another optional visual programming method according to an embodiment of the present invention;
[0040] Figure 10 This is a schematic diagram of another optional visual programming method according to an embodiment of the present invention;
[0041] Figure 11 This is a schematic diagram of another optional visual programming method according to an embodiment of the present invention;
[0042] Figure 12 This is a schematic diagram of another optional visual programming method according to an embodiment of the present invention;
[0043] Figure 13 This is a flowchart of another optional visual programming method according to an embodiment of the present invention;
[0044] Figure 14 This is a schematic diagram of another optional visual programming method according to an embodiment of the present invention;
[0045] Figure 15 This is a flowchart of another optional visual programming method according to an embodiment of the present invention;
[0046] Figure 16 This is a schematic diagram of another optional visual programming method according to an embodiment of the present invention;
[0047] Figure 17 This is a flowchart of another optional visual programming method according to an embodiment of the present invention;
[0048] Figure 18 This is a schematic diagram of the structure of an optional visual programming device according to an embodiment of the present invention;
[0049] Figure 19 This is a schematic diagram of the structure of an optional electronic device according to an embodiment of the present invention. Detailed Implementation
[0050] To enable those skilled in the art to better understand the present invention, the technical solutions of the present invention will be clearly and completely described below with reference to the accompanying drawings of the embodiments of the present invention. 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 should fall within the scope of protection of the present invention.
[0051] It should be noted that the terms "first," "second," etc., in the specification, claims, and accompanying drawings of this invention are used to distinguish similar objects and are not necessarily used to describe a specific order or sequence. It should be understood that such data can be interchanged where appropriate so that the embodiments of the invention described herein can be implemented in orders other than those illustrated or described herein. Furthermore, the terms "comprising" and "having," and any variations thereof, are intended to cover a non-exclusive inclusion; for example, a process, method, system, product, or apparatus that comprises a series of steps or units is not necessarily limited to those steps or units explicitly listed, but may include other steps or units not explicitly listed or inherent to such processes, methods, products, or apparatus.
[0052] According to one aspect of the present invention, a visual programming method is provided. As an optional implementation, the visual programming method can be applied to, but is not limited to, applications such as... Figure 1 The illustrated hardware environment includes a visual programming system, which may include, but is not limited to, terminal device 102, network 104, server 106, and database 108. The terminal device 102 runs a target client (e.g., ...). Figure 1 As shown, taking a target client that provides visual programming functionality as an example, the target client may include, but is not limited to, instant messaging clients, educational clients, game clients, etc. The terminal device 102 includes a human-computer interaction screen, a processor, and a memory. The human-computer interaction screen is used to display the application interface and the results of interactive operations (such as...). Figure 1 The application interface shown also provides a human-computer interaction interface to receive various interactive operations from the user, including drag-and-drop operations. The processor generates interaction instructions in response to these human-computer interaction operations and sends the program code generated based on the interaction instructions to the server. The memory stores relevant attribute data.
[0053] Visual programming provides an intuitive interface that allows users to build programs by dragging and connecting various blocks (such as programming blocks) that indicate different code segments. Each block represents a programming concept or operation, such as loops, conditional statements, mathematical operations, and variables. Visual programming typically supports multiple programming languages, such as JavaScript and Python. Optionally, visual programming functionality can be built into an application, such as a user-generated content (UGC) editor within a game application. It's worth noting that UGC editors support creating, adjusting, and sharing custom content (such as virtual maps, virtual scenes, and virtual characters). UGC editors can lower the barrier to creation while maintaining high-quality output; in particular, UGC editors have visual programming capabilities.
[0054] Schematic illustration: Terminal device 102 can be used to display a UGC editor in a game application. This UGC editor provides a visual programming interface, which includes multiple interactive functions. Users can perform the visual programming process through these interactive functions. The interactive functions include at least one of several functions such as selection, zoom in, zoom out, delete, and move. Users can select blocks used to indicate code blocks in the visual programming interface using the selection function, adjust the size of the blocks using the zoom in and zoom out functions, and adjust the state of the blocks in the programming interface using the delete and move functions. The interactive functions are not limited here.
[0055] In addition, server 106 includes a processing engine for performing store or read operations on database 108. Specifically, the processing engine reads program content sent by various object accounts from database 108.
[0056] Assumption Figure 1The terminal device 102 is the terminal device used for login of the current object account. The specific process of this embodiment is as follows: The terminal device 102 executes steps S102 to S108, receiving a tile creation operation in the visual programming interface. The visual programming interface is used to receive tile interaction operations to determine the program content that matches the tile interaction operation. The tile interaction operation includes a tile creation operation, which is used to create a target tile. The target tile is used to represent the target code object in the program content in the visual programming interface. In response to the tile creation operation, a target mapping relationship matching the target code object is searched in the mapping relationship set. The mapping relationship set is used to store object mapping relationships. The object mapping relationship includes an object identifier and a code field that match the same code object. If a target mapping relationship is found, the target code field used to indicate the target code object is obtained from the target mapping relationship. The program content matching the target tile is determined according to the target code field, and the target tile is displayed in the visual programming interface.
[0057] Next, in response to the storage operation triggered in the visual programming interface, the terminal device 102 executes step S110, sending the program content to the server 106 via the network 104; finally, the server 106 executes step S112, storing the program content.
[0058] It is understood that the aforementioned visual programming system can be a programming environment that provides cloud services, and the server 106 can perform real-time cloud storage of the target code program generated through visual programming operations; it is also understood that when the server 106 acts as a storage server for storing the program content generated by the visual programming interface, the server 106 can connect to multiple visual programming clients and store the program content sent by the multiple visual programming clients.
[0059] In another alternative implementation, the code generation and compilation operations in steps S104 to S108 can also be performed by the server 106.
[0060] Optionally, in this embodiment, the terminal device can be a terminal device configured with a target client, which may include, but is not limited to, at least one of the following: mobile phone (such as Android phone, iOS phone, etc.), laptop computer, tablet computer, PDA, MID (Mobile Internet Devices), PAD, desktop computer, smart TV, vehicle terminal, VR / AR device, etc. The target client can be a video client, instant messaging client, browser client, educational client, or other client that supports providing shooting game tasks. The network may include, but is not limited to, wired network and wireless network, wherein the wired network includes: local area network, metropolitan area network, and wide area network, and the wireless network includes: Bluetooth, WIFI, and other networks that enable wireless communication. The server may be a single server, a server cluster composed of multiple servers, or a cloud server. The above is only an example, and no limitation is made in this embodiment.
[0061] In this embodiment of the invention, a tile creation operation is received in the visual programming interface; in response to the tile creation operation, a target mapping relationship matching the target code object is searched in the mapping relationship set, wherein the mapping relationship set is used to store object mapping relationships, and the object mapping relationship includes an object identifier and a code field matching the same code object; if a target mapping relationship is found, a target code field for indicating the target code object is obtained from the target mapping relationship; the target code field determines the program content matching the target tile, and the target tile is displayed in the visual programming interface, thereby representing the code object in the program content according to the code field stored in the mapping relationship set during the user's tile interaction operation based on the visual programming interface, avoiding the direct generation of program content based on the user's custom text input, and improving the readability of the program content.
[0062] Furthermore, even when the user-inputted custom text does not conform to the naming conventions of code objects, the program content can be generated directly based on the target code fields that conform to the naming conventions, since the code fields stored in the mapping relationship set are used to generate the program content. This avoids program errors caused by incorrect user-defined naming and improves the programming efficiency of visual programming.
[0063] As an optional implementation method, such as Figure 2 As shown, the above visual programming method includes the following steps:
[0064] S202, receive a block creation operation in the visual programming interface, wherein the visual programming interface is used to receive block interaction operations to determine the program content that matches the block interaction operation. The block interaction operation includes a block creation operation, which is used to create a target block. The target block is used to represent the target code object in the program content in the visual programming interface.
[0065] S204, in response to the block creation operation, search for the target mapping relationship that matches the target code object in the mapping relationship set, wherein the mapping relationship set is used to store object mapping relationships, and the object mapping relationship includes the object identifier and code field that match the same code object;
[0066] S206, If a target mapping relationship is found, retrieve the target code field used to indicate the target code object from the target mapping relationship;
[0067] S208: Determine the program content that matches the target block based on the target code field, and display the target block in the visual programming interface.
[0068] It should be noted that the above-described embodiments of this application can be applied to an educational application that provides a visual programming tool, allowing users to learn programming operations and logic by dragging and dropping interactive blocks to indicate code blocks. Furthermore, the above-described embodiments can also be applied to a game application that provides a UGC editor with a visual programming interface, transforming complex programming languages into intuitive and interactive blocks, allowing users to customize game content through visual interaction. The above application scenarios are merely illustrative and do not limit the specific application scenarios of the above-described embodiments of this application.
[0069] In educational applications, users can access visual programming tools via terminal devices. They can then select tiles from the available tiles provided in the visual programming interface of these applications and build tile combinations. Since each tile can be mapped to a code block or logic block in the program code, the execution logic relationship between multiple code blocks can be indicated through tile combinations, thus obtaining a set of code programs.
[0070] In game development, users can access the UGC editor within a game application via a terminal device. Through the visual programming interface provided by the UGC editor, they can select preset interactive tiles to indicate pre-defined virtual elements in the game scene, or customize interactive tiles to indicate custom virtual elements. The connections between these interactive tiles indicate the relationships or interactions between different game elements within the custom game content. Furthermore, by editing these interactive tiles, users can build their own custom game content. It is understood that these interactive tiles can be used to indicate virtual game elements in the game scene, and also to indicate the corresponding code blocks during the implementation or rendering of these virtual game elements on the terminal device.
[0071] It is understandable that, in the above application scenarios, during the process of performing programming operations based on a visual programming interface, different tile objects can be used to represent code objects within the program content, thereby mapping tile interaction operations on tile objects to object processing operations on different code objects. It should be noted that, in this embodiment, a code object can be used to indicate a basic unit for composing program code. These units collectively define the structure and behavior of the program content, used to construct complex program logic and functions.
[0072] It is understood that the aforementioned code objects may include, but are not limited to, variable objects within the program content. In the visual programming interface, variable objects can be represented by block objects of the first style. A variable object can be used to indicate a data container for storing data values. During programming, the corresponding data value can be used in the program logic by calling the corresponding variable object. Furthermore, based on the scope of the variable object, variable objects can further include global variable objects and local variable objects. Based on the object attributes of the variable object, variable objects can further include integer type (int) variables, floating-point type (float) variables, character type (char) variables, and string type (string) variables.
[0073] The code objects mentioned above can also include function objects within the program content. In a visual programming interface, function objects can be represented by tile objects of the second style. A function object can be an entity that encapsulates a piece of code used to perform a specific task. Function objects can receive input parameter objects (also called parameters or formal parameters), perform some operations, and then return a result (also called a return value). Function objects can be used to improve the modularity, reusability, and readability of program content.
[0074] Furthermore, the code object described above can also include parameter objects associated with the function object. In the visual programming interface, these parameter objects can be represented by a third-style block object embedded within a second-style block object representing the function object. Parameter objects (also called formal parameters or input parameters) are variables declared when the function object is defined; they are used to receive values passed to the function when it is called. These values are called actual parameters. Parameter objects enable function objects to accept external data, making the function more flexible and versatile.
[0075] Furthermore, the aforementioned code objects may also include, but are not limited to, at least one of constant objects, expression objects, array objects, class objects, and module objects, which can be represented by corresponding specific style blocks in the visual programming interface. In this embodiment, the specific type of the aforementioned code objects is not limited.
[0076] In S202 above, the block creation operation can include at least two creation methods. The first method is to create a new target block, which corresponds to creating a new code object in the program content. The second method is to create a reused target block, which is the reuse of a target block that already exists in the visual programming interface or in the visual programming project corresponding to the current visual programming interface. This corresponds to reusing a declared or defined code object in the program content. It is understandable that since code objects are represented by blocks in the visual programming interface, a new target block needs to be created through the block creation operation during the reuse of code objects to represent the reused code object in the visual programming interface.
[0077] The following example uses the creation process of a variable block used to represent variable objects, combined with... Figure 3 , Figure 4 The interactive process of the two tile creation operations described above will be explained. For example... Figure 3 The visual programming interface shown includes a first menu bar 302, which indicates the object types of code objects supported in the current visual programming interface. For example, the "Event" control included in the first menu bar 302 can be used to create event blocks that represent event objects in the program content. Then, through interactive operations on the event blocks in the current visual programming interface, the event objects in the virtual scene can be edited and processed. Specifically, by triggering the "Event Control," a secondary menu bar matching the "Event Control" can be displayed to show interactive event blocks indicating different virtual events. It can be understood that the event block can be mapped to an event code block in the program code, used to indicate and describe the event content of virtual events in the virtual scene.
[0078] Furthermore, when the "Variable" control is selected from the current first menu bar 302, a second menu bar 304 matching the "Variable" control can be displayed. The second menu bar 304 displays operation controls for selecting variable blocks that manipulate different variable types. For example, the second menu bar 304 also displays "String" control, "Vector" control, "Player" control, "Character" control, "Component" control, "Item" control, "Logic Component" control, "Motion Unit" control, "Timer" control, and "Task" control. Each of these controls can trigger the display of a variable block matching the currently created control in the second operation area 306 to indicate the different variable objects that have been created.
[0079] When the "Boolean Value" control is selected from the second menu bar 304, a preview page of the variable block matching the Boolean variable object is displayed in the first operation area 316. As shown in the first operation area 316, no variable block is displayed, indicating that the Boolean variable object has not yet been created. Simultaneously, the first operation area 316 displays the creation control 314, indicating that a target block representing the Boolean variable object can be created using the creation control 314. In response to... Figure 3 The trigger operation of the creation control 314 in the middle, the interface switching display is as follows Figure 4 As shown, in Figure 4 The first operation area 316 displays the variable block corresponding to the currently created Boolean variable object. Furthermore, in... Figure 4 The second menu bar 304 further displays a superscript "①" on the "Boolean value" control to indicate that the number of Boolean value type variable objects created is 1. It can be understood that the above steps describe the first type of block creation operation, namely, a method for creating new block objects in a visual programming interface;
[0080] Furthermore, in Figure 4 In the interface shown, when a variable block displayed in the first operation area 316 is dragged to the second operation area 308, in response to a release operation, a first variable block 310, created to represent a Boolean variable object, can be displayed in the second operation area 308. It is understood that this step describes a method for reusing a created block object in a visual programming interface. Furthermore, in response to a second drag operation, i.e., when a variable block displayed in the first operation area 316 is dragged to the second operation area 308, a second variable block 312 matching the second drag operation can be displayed in the second operation area 308. It is understood that the first variable block 310 and the second variable block 312 are used to represent the same Boolean variable object in the program content.
[0081] The above block creation operation is only an example illustration, and this implementation does not limit the specific method of visually creating blocks.
[0082] It is understandable that in both of the above-described block creation processes, corresponding program code can be generated within the program content that matches the visual programming interface, based on the creation operations described above. Since code objects are typically represented by code fields within the program content, the block creation process usually also involves naming the block objects or performing secondary editing operations on the named text. Because conventional visual programming operations typically name the corresponding code objects directly based on the fields obtained from the naming or editing operations, the generated code fields within the program content will be adjusted in response to the block naming operation or the block naming editing operation described above.
[0083] For example Figure 5 As shown, when a target tile 510 is created in the second operation area 508, in response to an edit operation on the tile name of the target tile 510, the function name "Thisis a very long function name for test" determined by the edit operation can be displayed on the target tile 510. Simultaneously, the currently created target tile is displayed in the first operation area 506, and the aforementioned function name is also displayed on the target tile displayed in the first operation area 506. In conventional visual programming operations, the function name determined by the above edit operation is directly used as a code field in the program content to refer to the aforementioned function object. Corresponding to... Figure 5 The visual programming interface shown can generate the following program content using conventional visual programming methods:
[0084] “globalVersion=0
[0085] function Thisisaverylongfunctionnamefortest()
[0086] end
[0087] It is evident that in existing visual programming methods, because the object name of the corresponding code object is determined directly based on the user's editing operation on the tile name, it is easy to generate overly long object names due to custom operations, thus reducing the readability of the program content. Furthermore, when the same code object is used repeatedly in the program content, the program content generated based on overly long object names will contain a large number of repetitive and lengthy fields, thereby reducing the storage efficiency of the program content generated by visual programming operations. Moreover, if the object name obtained by the user based on the tile name editing operation contains illegal characters, the program content generated directly based on the aforementioned object name will also result in compilation errors, further reducing the programming efficiency of visual programming.
[0088] In the above embodiments of this application, in response to the block creation operation, the target code field of the target code object indicated by the target block can be directly obtained from the mapping relationship set through S204 and S206, thus avoiding the use of the custom code name entered by the user during the block creation process as the object field of the code object. This can effectively improve the readability of the program content generated based on the target code field and ensure that the object field conforms to the naming convention of the code object. In addition, the target code field determined based on the mapping relationship set can also effectively control the field length of the target code field of the target code object, thereby improving the storage efficiency of the program content.
[0089] Optionally, the set of mapping relationships in S204 above can be represented by various types of data structure objects, including but not limited to array objects, list objects, tree objects, etc.
[0090] Optionally, when the above mapping relationship set is represented as an array object, the object mapping relationship in the above mapping relationship set can be represented as an element object in the array object, wherein an element object includes two sub-elements, one of which is an object identifier used to represent the code object, and the other is a code field that matches the code object;
[0091] Optionally, when the above mapping relationship set is represented as a list object, the object mapping relationship in the above mapping relationship set can be represented as a list item object in the list object, wherein the key field in the list item object can be an object identifier used to represent the code object, and the value field in the list item object can be a code field that matches the code object.
[0092] Optionally, when the above mapping relationship set is represented as a tree object, the object mapping relationships in the above mapping relationship set can be represented as leaf objects in the tree object. Each leaf object includes two leaf elements: leaf element one is an object identifier used to represent the code object, and leaf element two is the code field matching the code object. Furthermore, the above tree object can also correspond to the hierarchical relationship between different projects in a program development project based on a visual programming interface. For example, during the process of performing game development operations through the above visual programming interface, multiple objects in the game application can have hierarchical relationships: specifically, the game scene object in the game application, the virtual object included in a game scene, and the interactive text object corresponding to a virtual object can have significant hierarchical relationships. In the specific visual programming process, when it is necessary to manage the code fields corresponding to the above game scene object, virtual object, and interactive text object, the above tree structure can be used to store and manage the mapping relationship set.
[0093] Furthermore, in the above embodiments of this application, since there can be multiple object types for code objects, in an optional embodiment, a single mapping relationship set can be used to manage the code fields corresponding to each of the multiple code objects in the program content. Alternatively, multiple mapping relationship sets can be used to manage the multiple code objects separately. In this embodiment, the correspondence between the number of mapping relationship sets and the number of code object types is not limited.
[0094] For example, when managing the code fields corresponding to multiple code objects based on a list object, a type key field can be added to the list object to store the object type corresponding to each code object. Then, during the process of searching for mapping relationships based on object identifiers, the search can be further performed in the corresponding list range based on the type key field, thereby improving the efficiency of mapping relationship search.
[0095] For example, when managing code fields for various code objects based on multiple list objects, in the process of creating a new mapping relationship between code objects and code fields in response to a block creation operation, code fields can be quickly assigned to the current code object based on the object size of the corresponding list object, thereby improving the efficiency of mapping relationship creation. For instance, if the first list object stores 100 function objects, in response to the current block creation operation, the object index "101" can be quickly assigned to the current function object based on the list size "100". Then, the current code field assigned to the current function object can be determined based on the object index. Finally, based on the mapping relationship between the object identifier of the current function object and the current code field, a new list item object is added to the first list object.
[0096] It is understandable that the code fields included in the object mapping relationships stored in the above mapping relationship set can satisfy certain field composition structures or field composition rules, thereby enabling the compression of user-defined custom code object fields and shortening the target code field of the target code object.
[0097] In one alternative approach, the target code fields included in the above object mapping relationship can be obtained by processing user-input custom code fields. Optionally, long words included in the custom code fields can be abbreviated, for example, "customer" in the field can be abbreviated to "cust"; alternatively, the target code fields can also be generated by retaining the first few letters of the field, for example, the "information" field can be converted to "info".
[0098] In another alternative approach, after processing the user-input custom code field to obtain the description field, a type field representing the object type is determined based on the object type of the code object. Then, the target code field is determined by concatenating the type field and the description field. For example, if the custom code field is "Thisisaverylongfunctionnamefortest", and this custom code field indicates the target function object, the target code field "fn_Thisis" can be obtained by combining the field representing the function type "fn" with the abbreviation "Thisis" of the custom code field "Thisisaverylongfunctionnamefortest". This significantly shortens the length of the target code field while maintaining code readability, thereby increasing the information density of the program content.
[0099] In one optional implementation, after determining the program content matching the target tile based on the target code field and displaying the target tile in the visual programming interface, the method further includes: displaying the program content in response to a program content viewing operation, wherein the target code field in the program content used to indicate the target code object is different from the reference description field displayed in the visual programming interface, and the reference description field is text content displayed on the target tile.
[0100] In this embodiment, the aforementioned program content viewing operation can be triggered by a code debugging tool to display the program content corresponding to the current visual programming interface, or it can be triggered by a program viewing control built into the visual programming interface to display the corresponding program content. For example, in an educational application, when a user completes block programming based on the visual programming interface provided by the application, the program content corresponding to the current visual programming interface can be displayed in response to the program viewing control in the current interface.
[0101] The following combination Figure 5 , Figure 6 This section describes an optional method for displaying target code content. Figure 5 In response to the block creation operation, the target block 510 is displayed in the second operation area 508. It can be understood that... Figure 5 In the interface shown, while creating and displaying the target tile 510, the target code field can also be determined through S204 and S206 above, and the corresponding program content can be generated. In response to... Figure 5 The program content viewing operation triggered in the visual programming interface shown will display as follows: Figure 6 As shown, the program content corresponding to the current visual programming interface is displayed in the target display area 602. Figure 6 Target tile 604 (corresponding to) Figure 5 The target plot 510 displays the user-defined function name "Thisis a very long function name for test," while the target display area 602 displays the target code field "fun_0" corresponding to the target function object represented by target plot 604, and shows the program content generated based on the target code field "fun_0." It is evident that by directly obtaining the target code field based on the mapping relationship, the generated program content is more concise, clear, and readable.
[0102] In an optional implementation, after displaying the program content in the visual programming interface in response to the program content viewing operation, the method further includes:
[0103] S1, in response to the first switching display operation, replace the target code field in the program content with the reference description field to obtain the reference program content;
[0104] S2 displays the updated reference program content.
[0105] It is understood that in this embodiment, after the program content is displayed on the current interface, the program content can be switched to display as reference program content. The reference program content can be code content generated based on user-defined reference description fields, which makes it convenient for users to quickly view the program content generated based on the custom code fields and improves the readability of the program content.
[0106] In another alternative implementation, after the above-mentioned updated reference program content is displayed, the method further includes: in response to the second display switching operation, restoring the display program content.
[0107] It is understood that, in this embodiment, the program content determined based on the target code field can be restored by further performing a second switching display operation.
[0108] It should be noted that the first and second display switching operations described above can be related. For example, if the first display switching operation involves long-pressing the target switching control, the second display switching operation could be releasing the target switching control; conversely, if the first display switching operation involves long-pressing the target display area, the second display switching operation could be releasing the target display area. This allows for free switching between the reference program content and the program content.
[0109] The following combination Figure 6 , Figure 7 This section describes a specific method for switching between reference program content and program content. For example... Figure 6 As shown, in Figure 6 In the target display area 602, the target code field used to indicate the target function object is "fun_0". Then, in response to a long press operation on the display switching control 606, the visual programming interface can switch the display as follows: Figure 7 As shown, in the target display area 702 (corresponding to Figure 6 The code field in the target display area 602 that indicates the target function object is "This is a very long function name for test", which corresponds to the target block 704. Figure 6 The content displayed in the target tile 604 in the image remains consistent; then, in Figure 7 In the interface shown, in response to the switching display control 706 (corresponding to Figure 6The release operation of the display switching control 606 in the visual programming interface can restore the display as follows: Figure 6 As shown.
[0110] Understandably, for users, the custom object names make it easier to identify the meaning of each code object. Therefore, the first display switching operation described above can be used to quickly display the code generated based on the user-defined object names, improving code readability. Furthermore, the second display switching operation can be used to restore the displayed program content, ensuring that the generated program content is concise and clear, thus increasing the information density of the program content. The combination of the first and second display switching operations can significantly improve the readability of the code content generated based on the visual programming interface.
[0111] In an optional implementation, when displaying program content in response to a program content viewing operation, the method further includes: displaying target hint text in a reference display area related to the program content, wherein the target hint text is used to indicate the reference description field corresponding to the target code field.
[0112] In this embodiment, a method is provided to simultaneously provide prompts for reference description fields while displaying program content determined based on target code fields. This improves the readability of program content by generating concise program content through target code fields and by using target prompt text.
[0113] The following combination Figure 5 , Figure 8 This describes a specific method for displaying program content. Figure 5 In response to the block creation operation, the target block 510 is displayed in the second operation area 508. It can be understood that... Figure 5 While creating and displaying the target tile 510 in the interface shown, the target code field can also be determined through S204 and S206 above, and the corresponding program content can be generated. Then, in response to... Figure 5 The program content viewing operation triggered in the visual programming interface shown will display as follows: Figure 8 As shown, the program content corresponding to the current visual programming interface is displayed in the target display area 802. Figure 8 Target tile 804 (corresponding to) Figure 5The target block 510 displays the user-defined function name "Thisis a very long function name for test," while the target display area 802 displays the target code field "fun_0" corresponding to the target function object represented by target block 804, and shows the program content generated based on the target code field "fun_0." Furthermore, the target hint text "fun_0 refers to the function 'Thisis a very long function name for test'" is displayed after the aforementioned target code field. This achieves the goal of generating concise and clear program content while providing appropriate comments based on the correspondence between the user-defined code field and the target code field, thereby improving the readability of the program content obtained through the visual programming interface.
[0114] It should be noted that during the storage or transmission of the above program content, it is possible to choose not to store or transmit the target prompt text, thereby improving the efficiency of program content storage or transmission. In other words, the target prompt text is only used for display when viewing program content in the visual programming interface, and is not stored or transmitted, thus improving both the efficiency of program content storage or transmission and the readability of the program content within the interface.
[0115] In one optional implementation, after displaying the program content in response to the program content viewing operation, the method further includes:
[0116] S1, in response to an editing operation on the target code field in the program content, update the target code field to the reference code field indicated by the editing operation;
[0117] S2, Replace the target code field in the target mapping relationship with the reference code field;
[0118] S3, update the mapping set according to the updated target mapping.
[0119] It is understood that this embodiment also provides a method for editing and updating target code fields. Specifically, when displaying program content, in response to an editing operation on the target code field, it can be determined that the target code field obtained according to the object mapping relationship will be updated to a reference code field determined according to the editing operation, and the target mapping relationship will be updated according to the reference code field.
[0120] The following combination Figure 6 , Figure 9 The above implementation methods will be described in detail. For example... Figure 6 As shown, in Figure 6In the target display area 602, the target code field used to indicate the target function object is "fun_0". Then, in response to an editing operation on the target code field, when "fun_0" is updated to the reference code field "function_0", the interface switches as follows: Figure 9 As shown, the updated block name "function_0" is displayed in target block 904, and the updated reference code field "function_0" is displayed in target display area 902.
[0121] Through the above-described embodiments of this application, when the target code field is determined based on the mapping relationship lookup operation, if the user wants to update the target code field to a more readable reference code field, the target code field in the program content can be edited while the program content is displayed, and the target code field can be updated to a reference code field in the visual programming interface, the program content, and the object mapping relationship, thereby improving the flexibility of editing the object code field.
[0122] In one alternative implementation, after determining the program content matching the target tile based on the target code field and displaying the target tile in the visual programming interface, the method further includes: in response to a save operation triggered in the visual programming interface, sending the program content to the target server, wherein the target server is used to store the program content sent by multiple terminal devices according to their respective operations.
[0123] In this embodiment, the visual programming client running on each terminal can send the program content, determined based on the visual programming operation, to the server for storage. Before the program content is sent over the network and stored on the server, if the program content is directly generated from the code fields defined by the user during visual programming, the generated program content will be lengthy and have low information density. Furthermore, the transmission and storage of this program content will result in significant technical problems related to low data transmission and data storage efficiency.
[0124] For example Figure 10As shown, the visual programming application running on multiple terminal devices can transmit program content to server 1006 for storage via network 1004. When it is necessary to view the visual programming interface, the previously stored program content can be retrieved from server 1006 via network 1004. In response to the saving operation of the visual programming interface, as in step S1002, terminal device 1002 sends program content to server 1006 via network 1004 to store the program content determined based on the visual programming interface; in response to the viewing operation of program content, as in S1004, terminal device 1002 retrieves program content from server 1006 via network 1004 and executes S1006 locally to view the visual programming interface.
[0125] Furthermore, in educational applications, users can access visual programming tools via terminal devices and select tiles from the available tiles provided in the visual programming interface of the aforementioned educational application to build tile combinations. During the tile combination building process, program content can be generated based on the target code fields corresponding to each code object. The visual programming interface provided by the educational application can also further provide features such as... Figure 6 , Figure 7 , Figure 8 , Figure 9 At least one interface is provided so that users can view the program content corresponding to the tile combinations in real time while learning programming skills through visual programming. Furthermore, while saving program content through the visual programming interface, users can also send program content determined based on the target code field to the server for storage, thereby improving the processing efficiency of program content during transmission and storage.
[0126] In game development scenarios, users can access the UGC editor within game applications via terminal devices and build custom game content through the visual programming interface provided by the UGC editor. Furthermore, users can share their custom game content with other users in virtual communities. Therefore, in this scenario, a large user group will produce custom program content through their respective visual programming interfaces and upload a large amount of this content to a server for sharing among users. Based on this scenario, during the process of producing custom program content using the visual programming interface, converting the custom code fields used to indicate code objects into target code fields according to the target mapping relationship can significantly reduce the amount of data in the program content. This, in turn, significantly improves the transmission and storage efficiency of program content during the sharing of large amounts of custom program content among different users.
[0127] The following provides a further explanation of the specific implementation process of steps S202 to S208.
[0128] In an optional implementation, step S202 above, receiving a block creation operation in the visual programming interface, includes: in response to dragging a reference block displayed in the first operation area of the visual programming interface to the second operation area of the visual programming interface, determining that a first block creation operation has been received, wherein the block creation operation includes a first block creation operation, the first operation area is used to display the created object block, and the object block includes a reference block;
[0129] In an optional implementation, the step S208 above, displaying the target block in the visual programming interface, includes: displaying the target block in a second operation area, wherein the target block and the reference block represent the same target code object in the program content in the visual programming interface, and the second operation area is used to display the object block in the block operation state.
[0130] It is understandable that the aforementioned first tile creation operation can specifically be an interactive operation for creating a reusable target tile. That is, when the first operation area in the visual programming interface already exists, or when the target tile already exists in the visual programming project corresponding to the current visual programming interface, the target tile is reused and created. This tile reuse creation operation can correspond to reusing a declared or defined code object within the program content.
[0131] In an optional implementation, step S202 above, receiving a block creation operation in the visual programming interface, includes: in response to a trigger operation on a block creation control in the visual programming interface, determining that a second block creation operation has been received, wherein the block creation operation includes a second block creation operation, the second block creation operation being used to create a new target block in the visual programming interface;
[0132] In an optional implementation, the step S208 above, displaying the target block in the visual programming interface, includes: displaying the target block in a first operation area and a second operation area in the visual programming interface; or, displaying the target block in the first operation area; and displaying the target block in the second operation area in response to dragging the target block to the second operation area.
[0133] It is understandable that the second tile creation operation mentioned above can be a new creation operation on the target tile, corresponding to creating a new code object in the program content.
[0134] The following section uses a function block as the target block as an example to further explain the method for determining the target code field.
[0135] In one alternative implementation, after determining that a second tile creation operation has been received in response to a trigger operation on a tile creation control in the visual programming interface, the following steps are included:
[0136] S1, when the block creation control is a function block creation control, at least one operation control for defining the target function object is displayed in the first operation area;
[0137] S2, in response to a function block definition operation based on at least one operation control, displays a target block of the function block type determined according to the function block definition operation in a first operation area and a second operation area.
[0138] The following combination Figure 5 , Figure 11 as well as Figure 12 The creation process of a specific function block is described. In response to... Figure 5 The visual programming interface can switch between displaying the "New Function" control, which creates a function block in the first operation area 506, and triggers the operation. Figure 11 As shown. In Figure 5 The position corresponding to the first operation area 506 in the middle is switched to display as Figure 11 The first operation area 1106 displays operation controls for defining target function objects, such as a function name edit box 1104 for defining the function name of the target function object, currently named "Custom Function Name 1". Furthermore, the first operation area 1106 also displays parameter addition controls for adding parameter objects. Simultaneously with displaying the first operation area 1106, the second operation area 1108 displays the currently created target tile 1110, which indicates the target function object; the target tile 1110 displays the currently defined function name "Custom Function Name 1". Then, in response to hiding the first operation area 1106, the interface switches to display as follows: Figure 12 As shown, in Figure 12 While the currently created target tile 1210 is displayed in the second operation area 1208, the target tile is simultaneously displayed in the first operation area 1206.
[0139] It is understandable that Chinese characters cannot usually be directly compiled in the program content. Therefore, if the function name "custom function name 1" entered in the current editing operation is directly used as the code field in the program content to represent the target function object, it will cause the program content to compile incorrectly.
[0140] In this embodiment of the application, the code field used to represent the function object can be determined through the following steps:
[0141] S1, determine the object type of the target code object based on the block type of the target block;
[0142] S2, Based on the type description field that matches the object type and the identification information assigned to the target code object, determine the target code field that matches the target code object;
[0143] S3, add the target mapping relationship used to indicate the target object identifier and target code field to the mapping relationship set.
[0144] In the above embodiments of this application, the target block's block type is specifically a function block type. Therefore, it can be determined that the code object represented by the target block is specifically a function object. Furthermore, the type description field "func" matching the function object and the identification information assigned to the target function object can be used to determine the target code field indicating the target function object. In one specific manner, the identification information assigned to the target function object can be determined based on the number of function objects currently created. For example, in... Figure 12 In the interface shown, the number of function blocks that have been created is 2. With the identifier information corresponding to the first function block object "Thisisaverylongfunctionnamefortest" being 0, it can be determined that the identifier information corresponding to the above target function object is 1. Therefore, it can be determined that the target code field is specifically the combination result of the above type description field and identifier information, "func_1".
[0145] It should be noted that before executing the above method for generating the target code object, the underlying technical implementation process needs to determine whether the target function object corresponding to the current creation operation exists.
[0146] In one alternative implementation, the above-mentioned response to the tile creation operation, searching the mapping relationship set for a target mapping relationship that matches the target code object, includes:
[0147] S1, if the target tile type is a function tile type, obtain the target function identifier used to indicate the target function object based on the tile description information of the target tile, wherein the target code object includes the target function object;
[0148] S2, in the first set of mapping relationships, find the target mapping relationship based on the objective function identifier.
[0149] Furthermore, when a target mapping relationship is found, the target code field used to indicate the target code object is obtained from the target mapping relationship, including: obtaining the target function name field that matches the target function object from the target mapping relationship, wherein the first mapping relationship set is used to store function object mapping relationships, and the function object mapping relationship includes function identifier and function name fields that match the same function object.
[0150] In one specific implementation, the target code fields corresponding to each of the above function objects can be managed through the Function Short Code Name Utility class. Specifically, the Function Short Code Name Utility class provides a set of methods, the most crucial of which is the getCodeName method. It can accept a parameter key (function ID, which is automatically assigned a unique ID to a function when it is created and recorded in the function repository class) and return the processed short function name.
[0151] The following combination Figure 13 The process of determining the existence of the target function object is explained in detail.
[0152] S1302, call the getCodeName method in the Utility class with the short function name, and pass in the function ID;
[0153] S1304, query whether the codeNameMap contains the key (function id); if the key is found based on the function id, execute S1306, and return the short code name of the corresponding function in the codeNameMap;
[0154] If the query fails, execute S1308, retrieve the fixed prefix "Func_", obtain the size parameter of codeNameMap, and construct a new function shortcode name based on "Func_" and the size parameter; S1310, store the mapping relationship between function id and new function shortcode name in codeNameMap; S1312, return the new function shortcode name.
[0155] It should be noted that, in Figure 13 In the processing flow shown, the Utility class containing the shortcode of the function mentioned above can contain a first mapping set, which can specifically be a mapping data structure Map.<string,string> This data structure can be used to store the mapping relationship between two strings. The first string is the function ID (that is, the function identifier is used as the key in the mapping relationship), and the second string is the corresponding target code field (specifically, it can be a function shortcode name, which is used as the value in the mapping relationship).
[0156] When the data structure object of the aforementioned mapping data structure is named codeNameMap, in response to the second tile creation operation, a call request for the getCodeName method corresponding to the second tile creation operation is received. This call request carries the function ID corresponding to the second tile creation operation. It should be noted that when creating a function tile in the visual programming interface, the function object identifier, i.e., the function ID, can be obtained from the tile description information of the created function tile.
[0157] Specifically, the visual programming interface can further include two types of function blocks. For example... Figure 9 The target block 904 shown is used to directly reference the created function block in the visual programming interface; specifically, it can be a function reference block. For example... Figure 11 The target block 1110 in the diagram serves to define the function object represented by the target block 1110 within the visual programming interface; therefore, it can be specifically a function definition block. In one specific implementation, the function ID of the associated function object can be obtained through the block ID of the function definition block; when generating code from the function reference block, the function ID of the associated function object can be obtained through the refId attribute in the block description information of the function reference block. This ensures that the function definition block and the function reference block match the function ID of the same function object.
[0158] Furthermore, during the tile creation process, the function ID can be obtained based on the getCodeName method mentioned above. First, check whether the codeNameMap contains the key field corresponding to the function ID; if it does, directly return the corresponding value field, i.e., the target code field (which can be the function shortcode name).
[0159] If the function name is not found, a new function shortcode name is generated. The mapping between the function ID and this new function shortcode name is stored in the codeNameMap, and the new function shortcode name is returned. The new function shortcode name can be generated by adding a fixed prefix "Func_" along with index information, where the index information can be the size of the codeNameMap, thus ensuring that each new function shortcode name is unique.
[0160] It should be noted that the code objects associated with function objects also include parameter objects. Correspondingly, in a visual programming interface, this can be seen as... Figure 11As shown, during the creation of the function block, controls are added based on the parameter objects in the first operation area 1106 to create parameter objects associated with the target function object. Simultaneously, the relationship between the parameter objects and the function object can be represented through object operation blocks connected to the target block 1110 in the second operation area 1108. It is evident that since the scope of a parameter object is usually limited to a specific function object, a global Utility class is not necessary for management; it is sufficient to obtain the index of the parameter object in the parameter list of the corresponding function object.
[0161] In an alternative implementation, when a reference block of the parameter block type is displayed in a sub-region of the block associated with the target block, the target parameter name field of the parameter object indicated by the reference block is determined as follows:
[0162] S1, obtain the target parameter identifier from the block description information of the reference block, wherein the reference block is used to represent the target parameter object in the program content in the visual programming interface, and the target parameter object is used to pass the data to be processed to the target function object;
[0163] S2, obtain a set of parameter information associated with the target tile, wherein the set of parameter information includes at least one target parameter identifier and parameter indices that match the at least one target parameter identifier respectively;
[0164] S3, if the target parameter index is found in the parameter information set based on the target parameter identifier, the target parameter name field is determined based on the target parameter index. The target parameter name field is used to indicate the target parameter object in the program content.
[0165] The following combination Figure 14 The above-described embodiments will be explained. For example... Figure 14 In this context, target block 1402 is connected to operation block 1404, indicating that the target function object represented by target block 1402 can be defined through the data operations represented by operation block 1404. The operation block 1404 displays reference block 1406 in its sub-region, thus identifying reference block 1406 as a parameter block matching target block 1402. It is understood that the block identifier of target block 1402 is recorded in the `defBlock` field of the block description information of reference block 1406. Therefore, target block 1402 can be determined first based on the `defBlock` field of the block description information of reference block 1406, and then the target function object it represents can be determined based on the block description information of target block 1402, thereby obtaining the function parameter list of the target function object.
[0166] Next, in the function parameter list, based on the parameter identifier of the parameter object represented by reference block 1406, the index corresponding to the parameter object is queried, and the target parameter name field of the parameter object is determined according to the index corresponding to the parameter object and the type field used to represent the parameter object. For example, the field "p_" can be used as the type field representing the parameter object. If the index found is "0", the target parameter name field corresponding to the parameter object can be determined as "p_0".
[0167] In one alternative implementation, parameter references in the visual programming interface may be contained within multi-level nested blocks, for example... Figure 16 As shown, the reference block 1604 is displayed in the sub-region of the operation block 1602, and the operation block 1602 is nested in parent block 1606, which is nested in parent block 1608, which is nested in parent block 1610. Finally, parent block 1610 is connected to the target block 1612. Therefore, based on the block nesting relationship displayed in the visual programming interface, it is necessary to find the target block 1612 associated with the reference block 1604. Only then, based on the parameter list of its corresponding target function object, can the object index of the parameter object indicated by the parameter block be determined, and thus the target parameter name field of that parameter object be determined. For example, the corresponding target parameter field can be determined in the following way:
[0168] S1, in the second operation area, if a reference block of parameter block type is displayed in the block sub-area of the first block related to the function block definition operation, obtain the set of parent blocks that have a block nesting relationship with the target block, wherein the first block is used to describe the function object operation of the target function object that matches the target block;
[0169] S2, if the target tile is included in the parent tile set, find the object index of the parameter object indicated by the reference tile in the parameter object set of the target function object;
[0170] S3, determine the target parameter name field that matches the parameter object based on the object index.
[0171] The following combination Figure 15 The method for determining the index of the parameter block in the visual programming interface is explained in detail.
[0172] S1502, obtain the parent block of the enclosing block; execute judgment S1504, whether the parent block is empty; if the parent block is not empty, execute judgment S1506, whether the parent block id is consistent with the function parameter block defBlock;
[0173] Understandably, the `defBlock` field in the block description information of the function parameter block is used to indicate the block identifier of the corresponding function block. If the judgment is inconsistent, step S1502 is repeated, i.e., the parent block of the current parent block is obtained to perform the next round of judgment; if the judgment is consistent, step S1508 is executed to obtain the parent block's function parameter list.
[0174] Next, execute judgment S1510 to traverse the function parameter list of the parent block and check if there is another function parameter that has not been processed. If there is another function parameter, execute judgment S1514 to check if the function parameter id currently being traversed in the parent block is consistent with the initial function parameter id. If they are consistent, execute S1516 to obtain the specific value of the returned index.
[0175] In the above implementation, since the reference to the parameter block may be contained within multiple nested blocks, it is necessary to continuously obtain the surrounding parent blocks until the corresponding function definition block is obtained by judging the matching relationship between the defBlock field and the block identifier of the parent block. If no corresponding function definition block is found even when the outermost surrounding parent block is found, then the index value is returned as -1. If a corresponding parent block is found in the middle, then all its parameter lists can be obtained through this parent block. This list is traversed, and the index of the parameter in the parameter list is obtained by judging the parameter id. If no corresponding parameter id is found when traversing this list, then the index value is returned as -1; otherwise, the specific index value is returned.
[0176] Furthermore, if the parameter index value represented by the current parameter patch is obtained, assuming it is "5", then the target parameter name field can be determined as "p_5".
[0177] The following example, using a target block as a variable block, further explains the method for determining the target code field. Methods for creating variable blocks based on the variable block creation control can include:
[0178] S1, in response to the triggering of the variable block creation control, displays the target block of the variable block type in the first operation area;
[0179] S2, in response to dragging the target tile to the second operation area, the target tile is displayed in the second operation area.
[0180] The following combination Figure 3 , Figure 4 The process of creating variable blocks is explained in detail. For example... Figure 3 As shown, in response to Figure 3 The trigger operation of the creation control 314 in the middle, the interface switching display is as follows Figure 4 As shown, in Figure 4 The first operation area 316 displays the variable block corresponding to the currently created Boolean variable object. Furthermore, in... Figure 4 The second menu bar 304 further displays a superscript "①" on the "Boolean Value" control to indicate that the number of Boolean value type variable objects created is 1. It can be understood that the above steps describe the first type of block creation operation, namely, a method for creating new block objects in a visual programming interface; furthermore, in Figure 4 In the interface shown, in response to dragging the variable block displayed in the first operation area 316 to the second operation area 308, in response to the release operation, it is possible to... Figure 4 The second operation area 308 in the interface shown displays the first variable tile 310 for creating Boolean variable objects.
[0181] In response to the above variable block creation operation, methods for determining the corresponding target code object based on the above creation operation may include:
[0182] Method 1: If the object type of the target code object represented by the target block is a global variable type, obtain the second field that matches the global variable type; concatenate the second field with the identification information to obtain the target code field that matches the target code object.
[0183] Method 2: When the object type of the target code object represented by the target block is a local variable type, obtain the third field that matches the current operation page, wherein the visual programming interface includes at least one operation page; concatenate the third field with the identification information to obtain the target code field that matches the target code object, wherein the third field is used to indicate the current operation page.
[0184] It is understood that, in this embodiment, the method for determining the target code field corresponding to the global variable object differs from the method for determining the target code field of the local variable object. The following provides a detailed explanation of the methods for determining the target code fields of the global variable object and the local variable object respectively.
[0185] For global variable objects, methods for determining their target code fields can include:
[0186] S1, if no target mapping relationship is found, determine the object type of the target code object based on the tile type of the target tile;
[0187] S2, Based on the type description field that matches the object type and the identification information assigned to the target code object, determine the target code field that matches the target code object;
[0188] S3, add the target mapping relationship used to indicate the target object identifier and target code field to the mapping relationship set.
[0189] When a variable block used to represent a global variable object has been created, and this variable block is reused, the method for finding the corresponding target code field is as follows:
[0190] S1, when the block type of the target block is a variable block type, obtain the target variable identifier used to indicate the target variable object based on the block description information of the target block, wherein the target code object includes the target variable object;
[0191] S2, in the second mapping relationship set, if the target mapping relationship is found based on the target variable identifier, the target variable name field that matches the target variable object is obtained from the target mapping relationship. The second mapping relationship set is used to store variable object mapping relationships, and the variable object mapping relationship includes variable identifier and variable name fields that match the same variable object.
[0192] Specifically, in this embodiment, a variable shortcode name Utility class can be encapsulated to create and store the mapping relationship between variable identifiers of variable objects and target code fields. In this embodiment, the second mapping relationship set mentioned above can be represented by the list codeNames stored in the Utility class. Each item in the codeNames list contains two items: a key (referring to the variable id) and a value (the mapped fixed variable short name). This list is used to record the mapping relationship between variable ids and fixed variable short names.
[0193] Furthermore, the aforementioned Utility class for short code names provides a set of methods, including the getCodeName method. The getCodeName method accepts one parameter, `key`, and returns the processed short name of the variable. Specifically, the `key` parameter received by the getCodeName method can be obtained based on the block description information of the variable block obtained from the current creation operation. For example, the variable id field in the block description information can be used as the parameter key received by the getCodeName method. It should be noted that when a new variable block is created based on the visual programming interface, the system automatically assigns a unique variable id to the variable object represented by the variable block and records it in the variable repository class. This variable repository class can be used to store the variable attribute information corresponding to multiple variable objects.
[0194] Furthermore, when the upper layer calls the `getCodeName` method and passes the variable `id` parameter to request a short name for the variable, it first iterates through the `codeNames` list. If the key of an item in the `codeNames` list matches the variable `id` passed in the parameter, it directly returns the corresponding value as the target code field. If there is no item in the list that matches the variable `id` passed in the parameter, a mapping relationship between the short name and the aforementioned variable `id` needs to be created.
[0195] The process of creating a new short name for a variable is as follows: First, the variable information is retrieved from the variable repository class using the variable ID. Specifically, the variable description information of the variable object can be obtained based on the variable ID, and the context field can be retrieved from the variable description information. Then, the context field can be used to determine whether the variable is a global or local variable.
[0196] An optional information organization structure for variable descriptions can be as follows:
[0197] export type VariableBaseModelWithInitValue={
[0198] [T in VarBaseType]:{
[0199] id: string; / / Variable id
[0200] name: string; / / Variable name
[0201] type:T; / / Variable type
[0202] initValue:VarBaseTypeInitValueMapType[T]; / / Initial value of the variable
[0203] context:VarContext; / / Local variable associated with the canvas ID}
[0204] }[DreamVarBaseType];
[0205] The variable description information above specifically describes the following attributes of the variable object: `id`: The unique identifier of the variable, of type string; `name`: The name of the variable (e.g., a user-defined variable name obtained based on user editing operations), of type string; `type`: The class of the variable; `initValue`: The initial value of the variable, of type `VarBaseTypeInitValueMapType[T]`. This indicates that the type of the initial value is associated with the type `T` of the variable; `context`: Used to indicate the canvas ID associated with the local variable.
[0206] In this implementation, the `context` field of the variable object can be obtained by passing the variable `id` to the `getCodeName` method. If the `context` field includes a specific canvas `id`, the target variable object can be determined to be a local variable object; otherwise, if the `context` field is omitted, the target variable object can be determined to be a global variable.
[0207] When the target variable object is a global variable, you can combine the fixed prefix "GlobalVar_" with the number of global variables as an index to form a new variable name (i.e., the target code field). Simultaneously, create a new project with the variable id passed in as the key and the new variable name as the value. Add this project to the codeNames list and return this new variable name.
[0208] For local variable objects, the methods for determining their target code fields can include:
[0209] S1, when the object type of the target code object represented by the target block is a local variable type, the third mapping relationship is searched in the third mapping relationship set based on the third field. The third mapping relationship set is used to store the reference mapping relationship between the operation page and the number of local variables. The reference mapping relationship includes the page field used to indicate the operation page, and the number of local variable objects corresponding to the operation page.
[0210] S2, when searching for the third mapping relationship in the third mapping relationship set, the page field contained in the third mapping relationship is used as the third field, and the identification information is determined according to the number of objects;
[0211] S3, if no third mapping relationship is found in the third mapping relationship set, create a third mapping relationship in the third mapping relationship set; use the page fields contained in the third mapping relationship as the third field, and assign identification information to the target code object.
[0212] In this implementation, when the currently created variable object is a local variable object, a Map is used inside the Utility class to define the variable shortcode name.<string,number> The mapping data structure, serving as the third mapping relationship set, stores the mapping relationship between each canvas and the number of local variables corresponding to it. This third mapping relationship set can be specifically named `localVarMap`. Within `localVarMap`, the mapping relationship uses the canvas ID as the key and the number of local variables in the canvas as the value. It stores the number of local variables currently used in each canvas (the number is not updated in real-time but is updated when the code is generated).
[0213] Furthermore, if the currently created variable object is a local variable object, the system first checks if the localVarMap contains a mapping relationship with that field as the key, based on the third field corresponding to the local variable object. Specifically, the third field can be the `context` field in the variable description information of the local variable, which indicates the canvas on which the local variable operates. If the localVarMap contains a mapping relationship with the `context` corresponding to the current local variable object as the key, then the newly created variable name will be a string prefixed with `context` and indexed by the number of local variables in the current canvas plus one.
[0214] For example, if the context content is "A_7B_60_l_x__K_60_kV_x9tl_", and a reference mapping relationship <"A_7B_60_l_x__K_60_kV_x9tl_", 5> is found in localVarMap based on the context content "A_7B_60_l_x__K_60_kV_x9tl_", 5>, then it indicates that localVarMap has already stored the mapping relationship between the canvas "A_7B_60_l_x__K_60_kV_x9tl_" and the number 5 local variable objects created in that canvas. Therefore, the target code field corresponding to the currently created local variable object can be determined as "A_7B_60_l_x__K_60_kV_x9tl_6".
[0215] In addition, the reference mapping relationship in the localVarMap above needs to be updated. Specifically, the value corresponding to the reference mapping relationship context in localVarMap can be set to the number of local variables in the current canvas plus 1, that is, updated to <“A_7B_60_l_x__K_60_kV_x9tl_”6>.
[0216] In addition, the codeNames list needs to be updated. Specifically, a new target mapping relationship can be created, where the key is the variable ID of the local variable object passed in as a parameter, and the value is the new variable name "A_7B_60_l_x__K_60_kV_x9tl_6". This item is then added to the codeNames list, and the new variable name "A_7B_60_l_x__K_60_kV_x9tl_6" is returned to the upper layer.
[0217] If no reference mapping relationship is found in localVarMap based on the context content "A_7B_60_l_x__K_60_kV_x9tl_", we can first determine that the new variable name is a string with the context "A_7B_60_l_x__K_60_kV_x9tl_" as the prefix and "1" as the index, which is "A_7B_60_l_x__K_60_kV_x9tl_1".
[0218] Next, create a new reference mapping in localVarMap, with the key being the context content "A_7B_60_l_x__K_60_kV_x9tl_" and the value being "1". That is, create a new reference mapping <"A_7B_60_l_x__K_60_kV_x9tl_", 6> in localVarMap;
[0219] Next, create a new project named codeName as the target mapping relationship. In this target mapping relationship, the key is the variable ID of the local variable object passed in as a parameter, and the value is the new variable name "A_7B_60_l_x__K_60_kV_x9tl_1". This project is then added to the codeNames list, and the new variable name "A_7B_60_l_x__K_60_kV_x9tl_1" is returned.
[0220] The following combination Figure 17 This document describes the method and process for determining the target code fields involved in the creation of variable blocks. When creating a variable block in the visual programming interface, the process first retrieves the variable identifier indicated in the block description information. Then, based on the variable identifier, a search is performed in the codeNames list, i.e., judgment S1702 is executed to iterate through the codeNames list to see if there are any unprocessed items. If there are unprocessed items, judgment S1704 is executed to check if the current item's key matches the variable id passed in the parameter. If the current item's key matches the variable id passed in the parameter, judgment S1706 is executed to return the current item's value.
[0221] It is understandable that the steps S1702 to S1706 above correspond to the reuse creation operation of the created variable blocks in the visual programming interface, and then the corresponding program content can be generated directly according to the target code field (current project value) stored in the mapping relationship set (codeNames list).
[0222] If the item traversal of the codeNames list is complete and no target mapping relationship is found, the current operation performed on the variable block in the visual programming interface is a block creation operation.
[0223] Next, step S1708 is executed to obtain variable information through the variable repository class. The variable information can be the variable description information of the target variable object obtained from the variable repository class based on the variable id. Then, judgment S1710 is executed to determine whether the variable is a global variable. If the judgment is yes, steps S1712 to S1718 are executed to take the fixed prefix "GlobalVar", obtain the number of global variables, and form a new short variable name. A new project is created, with the variable id passed as the parameter as the key and the new short variable name as the value, and the project is added to the codeNames list. In S1718, the new short variable name is returned.
[0224] In other words, in steps S1712 to S1718 above, the target code field that matches the target code object can be determined based on the fixed prefix "GlobalVar" and the number of global variables, and a corresponding target mapping relationship can be created in the codeNames list.
[0225] If the passed-in variable is a local variable, S1720 to S1726 can be executed. First, it is determined whether localVarMap contains a key. If localVarMap contains a reference mapping relationship with the context field of the current variable object as the key, the value corresponding to context in localVarMap is set to the value of the parameter passed variable canvas plus 1. A new short name for the variable is formed with the canvas id of the parameter passed variable as a prefix and the value corresponding to context in localVarMap as an index. Then, S1716 and S1718 are executed.
[0226] If localVarMap does not contain a reference mapping with the context field of the current variable object as the key, create a new project in localVarMap with the canvas id as the key and 1 as the value, and then execute S1716 and S1718.
[0227] Through the above-described embodiments of this application, in response to visual programming operations, during the process of generating program content based on tile operations, the relationship between function IDs and short names, and the relationship between variable IDs and short names, can be recorded through a mapping table. Furthermore, fixed prefixes and indices can be added to function parameter names, thereby significantly reducing the generated code length. In scenarios where multiple users develop custom game content based on visual programming, large-scale transmission and storage of the generated program content are required. Therefore, the above-described methods can significantly reduce the generated code length while further reducing the performance pressure of large-scale transmission and storage of program content, and simultaneously improving the efficiency of large-scale transmission and storage of program content.
[0228] Furthermore, the concise and easy-to-understand function names, parameter names, and variable names generated through the above-described embodiments of this application help improve code readability, making it easier for other developers to understand and maintain the relevant code. In the above-described... Figure 6 , Figure 7 and Figure 8 The embodiments shown also provide a variety of solutions for viewing the generated code in the visual programming interface. The above embodiments can realize quick switching between user-defined code names and optimized code names, thereby improving the code display efficiency.
[0229] Furthermore, in the above embodiments of this application, when the user uses function names, parameter names, and variable names containing Chinese characters, the above embodiments can convert the user-defined function names, parameter names, and variable names containing Chinese characters into a format suitable for programming languages, reducing the risk of compilation errors or runtime errors and improving the programming efficiency of visual programming.
[0230] Furthermore, since the generated code length is optimized, the above-described embodiments of this application can improve code running efficiency and reduce memory usage and execution time; the standardized function names, parameter names, and variable names provided in the above-described embodiments of this application are beneficial for later code maintenance and upgrades, and improve software maintainability.
[0231] It should be noted that, for the sake of simplicity, the foregoing method embodiments are all described as a series of actions. However, those skilled in the art should understand that the present invention is not limited to the described order of actions, because according to the present invention, some steps can be performed in other orders or simultaneously. Furthermore, those skilled in the art should also understand that the embodiments described in the specification are preferred embodiments, and the actions and modules involved are not necessarily essential to the present invention.
[0232] According to another aspect of the present invention, a visual programming apparatus for implementing the above-described visual programming method is also provided. For example... Figure 18 As shown, the device includes:
[0233] The receiving unit 1802 is used to receive a block creation operation in a visual programming interface, wherein the visual programming interface is used to receive a block interaction operation to determine program content that matches the block interaction operation, the block interaction operation includes the block creation operation, the block creation operation is used to create a target block, and the target block is used to represent the target code object in the program content in the visual programming interface.
[0234] The lookup unit 1804 is used to, in response to the above-mentioned block creation operation, search for a target mapping relationship that matches the above-mentioned target code object in the mapping relationship set, wherein the above-mentioned mapping relationship set is used to store object mapping relationships, and the above-mentioned object mapping relationship includes an object identifier and a code field that match the same code object;
[0235] The acquisition unit 1806 is used to acquire, when the target mapping relationship is found, the target code field used to indicate the target code object from the target mapping relationship;
[0236] Display unit 1808 is used to determine the program content that matches the target block according to the target code field, and to display the target block in the visual programming interface.
[0237] In some embodiments, the receiving unit 1802 includes: a receiving module, configured to determine that a first block creation operation has been received in response to dragging a reference block displayed in the first operation area of the visual programming interface to the second operation area of the visual programming interface, wherein the block creation operation includes the first block creation operation, the first operation area is used to display a created object block, and the object block includes the reference block; the display unit includes: a display module, configured to display the target block in the second operation area, wherein the target block and the reference block represent the same target code object in the program content in the visual programming interface, and the second operation area is used to display the object block in a block operation state.
[0238] In some embodiments, the search unit 1804 includes: an acquisition module, configured to acquire a target function identifier for indicating a target function object based on the block description information of the target block when the block type of the target block is a function block type, wherein the target code object includes the target function object; and a search module, configured to search for the target mapping relationship in a first mapping relationship set based on the target function identifier.
[0239] In some embodiments, the acquisition module is configured to: acquire a target function name field that matches the target function object from the target mapping relationship, wherein the first mapping relationship set is used to store function object mapping relationships, and the function object mapping relationship includes a function identifier and a function name field that match the same function object.
[0240] In some embodiments, the lookup unit 1804 is further configured to: when a reference block of parameter block type is displayed in a sub-region of a block associated with the target block, obtain a target parameter identifier from the block description information of the reference block, wherein the reference block is used to represent a target parameter object in the program content in the visual programming interface, and the target parameter object is used to pass data to be processed to the target function object; obtain a set of parameter information associated with the target block, wherein the set of parameter information includes at least one target parameter identifier and parameter indexes that respectively match at least one of the target parameter identifiers; and when a target parameter index is found in the set of parameter information based on the target parameter identifier, determine a target parameter name field based on the target parameter index, wherein the target parameter name field is used to indicate the target parameter object in the program content.
[0241] In some embodiments, the lookup unit 1804 is configured to: when the block type of the target block is a variable block type, obtain a target variable identifier for indicating a target variable object based on the block description information of the target block, wherein the target code object includes the target variable object; and when the target mapping relationship is found based on the target variable identifier in the second mapping relationship set, obtain a target variable name field that matches the target variable object from the target mapping relationship, wherein the second mapping relationship set is used to store variable object mapping relationships, and the variable object mapping relationship includes a variable identifier and a variable name field that match the same variable object.
[0242] In some embodiments, the receiving unit 1802 is configured to: determine that a second block creation operation has been received in response to a trigger operation on the block creation control in the visual programming interface, wherein the block creation operation includes the second block creation operation, which is used to create the target block in the visual programming interface; the display unit is configured to display the target block in a first operation area and a second operation area in the visual programming interface; or, display the target block in the first operation area; and display the target block in the second operation area in response to dragging the target block to the second operation area; wherein the first operation area is used to display created object blocks, and the second operation area is used to display object blocks in an operation state.
[0243] In some embodiments, the receiving unit 1802 is configured to: display at least one operation control for defining a target function object in the first operation area when the block creation control is a function block creation control; and display the target block of the function block type determined according to the function block definition operation in the first operation area and the second operation area in response to a function block definition operation based on at least one of the operation controls.
[0244] In some embodiments, the receiving unit 1802 is further configured to: when a reference block of parameter block type is displayed in a sub-region of a first block related to the function block definition operation in the second operation area, obtain a set of parent blocks that have a block nesting relationship with the target block, wherein the first block is used to describe the function object operation of the target function object that matches the target block; when the target block is included in the set of parent blocks, search for the object index of the parameter object indicated by the reference block in the parameter object set of the target function object; and determine the target code field that matches the parameter object based on the object index.
[0245] In some embodiments, the receiving unit 1802 is configured to: display the target block of variable block type in the first operation area when the block creation control is a variable block creation control, wherein the block display style of the target block object matches the variable type of the variable object represented by the target block; and display the target block in the second operation area in response to dragging the target block to the second operation area.
[0246] In some embodiments, the above-described visual programming apparatus further includes: a creation unit, configured to, when the target mapping relationship is not found, determine the object type of the target code object based on the block type of the target tile; determine the target code field that matches the target code object based on the type description field that matches the object type and the identification information assigned to the target code object; and add the target mapping relationship that indicates the target object identifier and the target code field to the mapping relationship set.
[0247] In some embodiments, the creation unit is configured to: when the object type of the target code object represented by the target tile is a function type, obtain a first field matching the function type; concatenate the first field with the identification information to obtain the target code field matching the target code object; when the object type of the target code object represented by the target tile is a global variable type, obtain a second field matching the global variable type; concatenate the second field with the identification information to obtain the target code field matching the target code object; when the object type of the target code object represented by the target tile is a local variable type, obtain a third field matching the current operation page, wherein the visual programming interface includes at least one operation page; concatenate the third field with the identification information to obtain the target code field matching the target code object, wherein the third field is used to indicate the current operation page.
[0248] In some embodiments, the creation unit is configured to: when the object type of the target code object represented by the target tile is a local variable type, search for a third mapping relationship in a third mapping relationship set based on the third field, wherein the third mapping relationship set is used to store reference mapping relationships between operation pages and the number of local variables, the reference mapping relationship includes a page field for indicating the operation page, and the number of local variable objects corresponding to the operation page; when the third mapping relationship is searched in the third mapping relationship set, use the page field contained in the third mapping relationship as the third field, and determine the identification information based on the number of objects; when the third mapping relationship is not searched in the third mapping relationship set, create the third mapping relationship in the third mapping relationship set; use the page field contained in the third mapping relationship as the third field, and assign the identification information to the target code object.
[0249] In some embodiments, the above-described visual programming apparatus further includes: a viewing unit, configured to display the program content in response to a program content viewing operation, wherein the target code field in the program content used to indicate the target code object is different from the reference description field displayed in the visual programming interface, and the reference description field is text content displayed on the target block.
[0250] In some embodiments, the viewing unit is further configured to: in response to a first switching display operation, replace the target code field in the program content with the reference description field to obtain reference program content; and display the updated reference program content.
[0251] In some embodiments, the viewing unit is further configured to: display target prompt text in a reference display area related to the program content, wherein the target prompt text is used to indicate the reference description field corresponding to the target code field.
[0252] In some embodiments, the viewing unit is further configured to: update the target code field to the reference code field indicated by the editing operation in response to the editing operation of the target code field in the program content; replace the target code field in the target mapping relationship according to the reference code field; and update the mapping relationship set according to the updated target mapping relationship.
[0253] In some embodiments, the above-described visual programming apparatus further includes: a storage unit, configured to send the program content to a target server in response to a save operation triggered in the above-described visual programming interface, wherein the target server is configured to store the program content sent by multiple terminal devices according to their respective program content.
[0254] Optionally, in this embodiment, the implementation of each of the above-mentioned unit modules can be referred to the above-mentioned method embodiments, which will not be repeated here.
[0255] According to another aspect of the present invention, an electronic device for implementing the above-described visual programming method is also provided, the electronic device being... Figure 19 The terminal device or server shown. This embodiment uses this electronic device as an example for illustration. Figure 19 As shown, the electronic device includes a memory 1902 and a processor 1904. The memory 1902 stores a computer program, and the processor 1904 is configured to execute the steps of any of the above method embodiments via the computer program.
[0256] Optionally, in this embodiment, the aforementioned electronic device may be located in at least one of a plurality of network devices in a computer network.
[0257] Optionally, in this embodiment, the processor can be configured to perform the following steps via a computer program:
[0258] S1, receiving a block creation operation in a visual programming interface, wherein the visual programming interface is used to receive a block interaction operation to determine program content that matches the block interaction operation, the block interaction operation includes the block creation operation, the block creation operation is used to create a target block, and the target block is used to represent the target code object in the program content in the visual programming interface.
[0259] S2, in response to the above tile creation operation, search for the target mapping relationship that matches the target code object in the mapping relationship set, wherein the mapping relationship set is used to store object mapping relationships, and the object mapping relationship includes the object identifier and code field that match the same code object;
[0260] S3, if the above target mapping relationship is found, obtain the target code field used to indicate the above target code object from the above target mapping relationship;
[0261] S4. Determine the program content that matches the target block based on the target code field, and display the target block in the visual programming interface.
[0262] Alternatively, as those skilled in the art will understand, Figure 19 The structure shown is for illustrative purposes only. Electronic devices can also be smartphones (such as Android phones, iOS phones, etc.), tablets, PDAs, mobile internet devices (MIDs), PADs, and other terminal devices. Figure 19 This does not limit the structure of the aforementioned electronic devices or electronic equipment. For example, electronic devices or electronic equipment may also include components that are more... Figure 19 The more or fewer components shown (such as network interfaces, etc.), or having the same Figure 19 The different configurations shown.
[0263] The memory 1902 can be used to store software programs and modules, such as the program instructions / modules corresponding to the visual programming method and apparatus in this embodiment of the invention. The processor 1904 executes various functional applications and data processing by running the software programs and modules stored in the memory 1902, thereby realizing the aforementioned visual programming method. The memory 1902 may include high-speed random access memory, and may also include non-volatile memory, such as one or more magnetic storage devices, flash memory, or other non-volatile solid-state memory. In some instances, the memory 1902 may further include memory remotely located relative to the processor 1904, and these remote memories can be connected to the terminal via a network. Examples of such networks include, but are not limited to, the Internet, corporate intranets, local area networks, mobile communication networks, and combinations thereof. Specifically, the memory 1902 may be used, but is not limited to, to store various elements in the scene screen, visual programming information, and other information. As an example, such as... Figure 19 As shown, the memory 1902 may include, but is not limited to, the receiving unit 1802, the searching unit 1804, the acquiring unit 1806, and the display unit 1808 from the visual programming device described above. Furthermore, it may include, but is not limited to, other module units from the visual programming device described above, which will not be elaborated upon in this example.
[0264] Optionally, the aforementioned transmission device 1906 is used to receive or send data via a network. Specific examples of the network may include wired and wireless networks. In one example, the transmission device 1906 includes a Network Interface Controller (NIC), which can be connected to other network devices and a router via a network cable to communicate with the Internet or a local area network. In another example, the transmission device 1906 is a Radio Frequency (RF) module used for wireless communication with the Internet.
[0265] In addition, the aforementioned electronic device also includes: a display 1908 for displaying a virtual scene in the interface; and a connection bus 1910 for connecting various module components in the aforementioned electronic device.
[0266] In other embodiments, the aforementioned terminal device or server can be a node in a distributed system, wherein the distributed system can be a blockchain system, which is a distributed system formed by connecting multiple nodes through network communication. The nodes can form a peer-to-peer network, and any form of computing device, such as a server, terminal, or other electronic device, can become a node in the blockchain system by joining this peer-to-peer network.
[0267] According to one aspect of this application, a computer program product is provided, comprising a computer program / instructions containing program code for performing the methods shown in the flowchart. In such embodiments, the computer program can be downloaded and installed from a network via a communication component, and / or installed from a removable medium. When the computer program is executed by a central processing unit, it performs various functions provided in embodiments of this application.
[0268] The sequence numbers of the above embodiments of the present invention are for descriptive purposes only and do not represent the superiority or inferiority of the embodiments.
[0269] According to one aspect of this application, a computer-readable storage medium is provided, wherein a processor of a computer device reads computer instructions from the computer-readable storage medium, and the processor executes the computer instructions, causing the computer device to perform the above-described visual programming method.
[0270] Optionally, in this embodiment, the computer-readable storage medium may be configured to store a computer program for performing the following steps:
[0271] S1, receiving a block creation operation in a visual programming interface, wherein the visual programming interface is used to receive a block interaction operation to determine program content that matches the block interaction operation, the block interaction operation includes the block creation operation, the block creation operation is used to create a target block, and the target block is used to represent the target code object in the program content in the visual programming interface.
[0272] S2, in response to the above tile creation operation, search for the target mapping relationship that matches the target code object in the mapping relationship set, wherein the mapping relationship set is used to store object mapping relationships, and the object mapping relationship includes the object identifier and code field that match the same code object;
[0273] S3, if the above target mapping relationship is found, obtain the target code field used to indicate the above target code object from the above target mapping relationship;
[0274] S4. Determine the program content that matches the target block based on the target code field, and display the target block in the visual programming interface.
[0275] Optionally, in this embodiment, those skilled in the art will understand that all or part of the steps in the various methods of the above embodiments can be implemented by a program instructing the hardware related to the terminal device. The program can be stored in a computer-readable storage medium, which may include: flash drive, read-only memory (ROM), random access memory (RAM), disk or optical disk, etc.
[0276] If the integrated units in the above embodiments are implemented as software functional units and sold or used as independent products, they can be stored in the aforementioned computer-readable storage medium. Based on this understanding, the technical solution of the present invention, in essence, or the part that contributes to the prior art, or all or part of the technical solution, can be embodied in the form of a software product. This computer software product is stored in a storage medium and includes several instructions to cause one or more computer devices (which may be personal computers, servers, or network devices, etc.) to execute all or part of the steps of the methods described in the various embodiments of the present invention.
[0277] In the above embodiments of the present invention, the descriptions of each embodiment have different focuses. For parts not described in detail in a certain embodiment, please refer to the relevant descriptions of other embodiments.
[0278] In the several embodiments provided in this application, it should be understood that the disclosed client can be implemented in other ways. The device embodiments described above are merely illustrative; for example, the division of units described above is only a logical functional division, and in actual implementation, there may be other division methods. For example, multiple units or components may be combined or integrated into another system, or some features may be ignored or not executed. Furthermore, the coupling or direct coupling or communication connection shown or discussed may be through some interfaces, indirect coupling or communication connection between units or modules, and may be electrical or other forms.
[0279] The units described above as separate components may or may not be physically separate. The components shown as units may or may not be physical units; that is, they may be located in one place or distributed across multiple network units. Some or all of the units can be selected to achieve the purpose of this embodiment according to actual needs.
[0280] Furthermore, the functional units in the various embodiments of the present invention can be integrated into one processing unit, or each unit can exist physically separately, or two or more units can be integrated into one unit. The integrated unit can be implemented in hardware or as a software functional unit.
[0281] The above description is only a preferred embodiment of the present invention. It should be noted that for those skilled in the art, several improvements and modifications can be made without departing from the principle of the present invention, and these improvements and modifications should also be considered within the scope of protection of the present invention.
Claims
1. A visual programming method, characterized by, include: The visual programming interface receives a tile creation operation, wherein the visual programming interface is used to receive a tile interaction operation to determine program content that matches the tile interaction operation, the tile interaction operation includes the tile creation operation, the tile creation operation is used to create a target tile, and the target tile is used to represent the target code object in the program content in the visual programming interface; In response to the tile creation operation, a target mapping relationship matching the target code object is searched in the mapping relationship set, wherein the mapping relationship set is used to store object mapping relationships, and the object mapping relationship includes an object identifier and a code field that match the same code object; If the target mapping relationship is found, the target code field used to indicate the target code object is obtained from the target mapping relationship; The program content that matches the target tile is determined based on the target code field, and the target tile is displayed in the visual programming interface.
2. The method according to claim 1, characterized in that, Receiving tile creation operations in the visual programming interface includes: In response to dragging a reference tile displayed in the first operation area of the visual programming interface to the second operation area of the visual programming interface, it is determined that a first tile creation operation has been received, wherein the tile creation operation includes the first tile creation operation, the first operation area is used to display the created object tile, and the object tile includes the reference tile; Displaying the target tile in the visual programming interface includes: The target tile is displayed in the second operation area, wherein the target tile and the reference tile represent the same target code object in the program content in the visual programming interface, and the second operation area is used to display the object tile in the tile operation state.
3. The method of claim 2, wherein, The step of searching for a target mapping relationship that matches the target code object in the mapping relationship set in response to the tile creation operation includes: When the target tile's tile type is a function tile type, a target function identifier for indicating the target function object is obtained based on the target tile's tile description information, wherein the target code object includes the target function object; In the first set of mapping relationships, the target mapping relationship is found based on the target function identifier.
4. The method of claim 3, wherein, The step of retrieving the target code field used to indicate the target code object from the target mapping relationship when the target mapping relationship is found includes: Obtain the target function name field that matches the target function object from the target mapping relationship, wherein the first mapping relationship set is used to store function object mapping relationships, and the function object mapping relationship includes function identifier and function name fields that match the same function object.
5. The method of claim 3, wherein, When displaying the target tile in the second operation area, the method further includes: When a reference block of parameter block type is displayed in a sub-region of the block associated with the target block, the target parameter identifier is obtained from the block description information of the reference block. The reference block is used to represent the target parameter object in the program content in the visual programming interface, and the target parameter object is used to pass the data to be processed to the target function object. Obtain a set of parameter information associated with the target tile, wherein the set of parameter information includes at least one target parameter identifier and parameter indexes that match at least one of the target parameter identifiers respectively; If the target parameter index is found in the parameter information set based on the target parameter identifier, the target parameter name field is determined based on the target parameter index, wherein the target parameter name field is used to indicate the target parameter object in the program content.
6. The method of claim 2, wherein, The step of searching for a target mapping relationship that matches the target code object in the mapping relationship set in response to the tile creation operation includes: When the target tile's tile type is a variable tile type, a target variable identifier for indicating the target variable object is obtained based on the target tile's tile description information, wherein the target code object includes the target variable object; In the second mapping relationship set, if the target mapping relationship is found based on the target variable identifier, the target variable name field that matches the target variable object is obtained from the target mapping relationship. The second mapping relationship set is used to store variable object mapping relationships, and the variable object mapping relationship includes variable identifier and variable name fields that match the same variable object.
7. The method according to claim 1, characterized in that, Receiving tile creation operations in the visual programming interface includes: In response to a trigger operation on the tile creation control in the visual programming interface, it is determined that a second tile creation operation has been received, wherein the tile creation operation includes the second tile creation operation, which is used to create the target tile in the visual programming interface; Displaying the target tile in the visual programming interface includes: The target tile is displayed in a first operation area and a second operation area in the visual programming interface; or, the target tile is displayed in the first operation area; in response to dragging the target tile to the second operation area, the target tile is displayed in the second operation area. The first operation area is used to display created object blocks, and the second operation area is used to display object blocks in operation state.
8. The method of claim 7, wherein, The step of responding to a trigger operation on the tile creation control in the visual programming interface, and determining after receiving a second tile creation operation, includes: When the block creation control is a function block creation control, at least one operation control for defining a target function object is displayed in the first operation area; In response to a function block definition operation based on at least one of the operation controls, the target block of the function block type determined according to the function block definition operation is displayed in the first operation area and the second operation area.
9. The method of claim 8, wherein, The step of responding to a function block definition operation based on at least one of the operation controls, after displaying the target block of the function block type determined according to the function block definition operation in the first operation area and the second operation area, further includes: In the second operation area, if a reference block of parameter block type is displayed in the block sub-area of the first block related to the function block definition operation, a set of parent blocks with a block nesting relationship with the target block is obtained, wherein the first block is used to describe the function object operation of the target function object that matches the target block; If the target tile is included in the parent tile set, the object index of the parameter object indicated by the reference tile is searched in the parameter object set of the target function object; The target parameter name field that matches the parameter object is determined based on the object index.
10. The method of claim 7, wherein, The step of responding to a trigger operation on the tile creation control in the visual programming interface, and determining after receiving a second tile creation operation, includes: When the block creation control is a variable block creation control, the target block of the variable block type is displayed in the first operation area, wherein the block display style of the target block matches the variable type of the variable object represented by the target block; In response to dragging the target tile to the second operation area, the target tile is displayed in the second operation area.
11. The method according to any one of claims 8 or 10, characterized in that, After responding to the tile creation operation by searching the mapping relationship set for a target mapping relationship that matches the target code object, the method further includes: If the target mapping relationship is not found, the object type of the target code object is determined based on the tile type of the target tile; Based on the type description field that matches the object type and the identification information assigned to the target code object, determine the target code field that matches the target code object; The target mapping relationship, which indicates the target object identifier and the target code field, is added to the mapping relationship set.
12. The method of claim 11, wherein, The step of determining the target code field that matches the target code object based on the target field that matches the object type and the identification information assigned to the target code object includes: If the object type of the target code object represented by the target block is a function type, obtain the first field that matches the function type; concatenate the first field with the identification information to obtain the target code field that matches the target code object; If the object type of the target code object represented by the target block is a global variable type, obtain the second field that matches the global variable type; concatenate the second field with the identification information to obtain the target code field that matches the target code object; When the object type of the target code object represented by the target tile is a local variable type, a third field matching the current operation page is obtained, wherein the visual programming interface includes at least one operation page; the third field is concatenated with the identification information to obtain the target code field matching the target code object, wherein the third field is used to indicate the current operation page.
13. The method of claim 12, wherein, The step of determining the target code field that matches the target code object based on the type description field that matches the object type and the identification information assigned to the target code object includes: When the object type of the target code object represented by the target block is a local variable type, the third mapping relationship is searched in the third mapping relationship set based on the third field. The third mapping relationship set is used to store the reference mapping relationship between the operation page and the number of local variables. The reference mapping relationship includes a page field for indicating the operation page and the number of local variable objects corresponding to the operation page. When searching for the third mapping relationship from the third mapping relationship set, the page field contained in the third mapping relationship is used as the third field, and the identification information is determined according to the number of objects; If the third mapping relationship is not found in the third mapping relationship set, the third mapping relationship is created in the third mapping relationship set; the page field contained in the third mapping relationship is used as the third field, and the identification information is assigned to the target code object.
14. The method of claim 1, wherein, After determining the program content matching the target tile based on the target code field and displaying the target tile in the visual programming interface, the method further includes: In response to a program content viewing operation, the program content is displayed, wherein the target code field used to indicate the target code object in the program content is different from the reference description field displayed in the visual programming interface, and the reference description field is text content displayed on the target tile.
15. The method of claim 14, wherein, The response to the program content viewing operation, after displaying the program content in the visual programming interface, further includes: In response to the first display switching operation, the target code field in the program content is replaced according to the reference description field to obtain the reference program content; Display the updated reference program content.
16. The method of claim 14, wherein, When displaying the program content in response to a program content viewing operation, the method further includes: In a reference display area related to the program content, target hint text is displayed, wherein the target hint text is used to indicate the reference description field corresponding to the target code field.
17. The method of claim 14, wherein, After displaying the program content in response to the program content viewing operation, the method further includes: In response to an editing operation on the target code field in the program content, the target code field is updated to the reference code field indicated by the editing operation; Replace the target code field in the target mapping relationship with the reference code field; The mapping set is updated based on the updated target mapping.
18. The method of claim 1, wherein, After determining the program content matching the target tile based on the target code field and displaying the target tile in the visual programming interface, the method further includes: In response to a save operation triggered in the visual programming interface, the program content is sent to a target server, wherein the target server is used to store the program content sent by multiple terminal devices according to their respective requirements.
19. A visual programming device, characterized by include: A receiving unit is configured to receive a tile creation operation in a visual programming interface, wherein the visual programming interface is configured to receive a tile interaction operation to determine program content matching the tile interaction operation, the tile interaction operation including the tile creation operation, the tile creation operation being configured to create a target tile, the target tile being configured to represent a target code object in the program content in the visual programming interface; A lookup unit is configured to, in response to the tile creation operation, search for a target mapping relationship that matches the target code object in a mapping relationship set, wherein the mapping relationship set is used to store object mapping relationships, and the object mapping relationship includes an object identifier and a code field that match the same code object; The acquisition unit is configured to, when the target mapping relationship is found, acquire the target code field used to indicate the target code object from the target mapping relationship; The display unit is used to determine the program content that matches the target tile based on the target code field, and to display the target tile in the visual programming interface.
20. A computer readable storage medium, characterized in that, The computer-readable storage medium includes a stored program, wherein the program, when executed, performs the method described in any one of claims 1 to 18.
21. A computer program product comprising computer programs / instructions, characterized in that, When the computer program / instructions are executed by the processor, they implement the steps of the method according to any one of claims 1 to 18.
22. An electronic device comprising a memory and a processor, wherein the processor is configured to: The memory stores a computer program, and the processor is configured to execute the method described in any one of claims 1 to 18 through the computer program.