CN114327429A - Graphical building block programming method and device, electronic equipment and storage medium - Google Patents

Graphical building block programming method and device, electronic equipment and storage medium Download PDF

Info

Publication number
CN114327429A
CN114327429A CN202111658040.1A CN202111658040A CN114327429A CN 114327429 A CN114327429 A CN 114327429A CN 202111658040 A CN202111658040 A CN 202111658040A CN 114327429 A CN114327429 A CN 114327429A
Authority
CN
China
Prior art keywords
building block
graphical
information
block
preset
Prior art date
Legal status (The legal status is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the status listed.)
Pending
Application number
CN202111658040.1A
Other languages
Chinese (zh)
Inventor
谭教忠
Current Assignee (The listed assignees may be inaccurate. Google has not performed a legal analysis and makes no representation or warranty as to the accuracy of the list.)
Ubtech Robotics Corp
Original Assignee
Ubtech Robotics Corp
Priority date (The priority date is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the date listed.)
Filing date
Publication date
Application filed by Ubtech Robotics Corp filed Critical Ubtech Robotics Corp
Priority to CN202111658040.1A priority Critical patent/CN114327429A/en
Publication of CN114327429A publication Critical patent/CN114327429A/en
Pending legal-status Critical Current

Links

Images

Landscapes

  • Stored Programmes (AREA)

Abstract

The embodiment of the invention discloses a graphical building block programming method, a graphical building block programming device, electronic equipment and a storage medium, wherein the method comprises the following steps: obtaining statement information of the building blocks to be constructed; creating Canvas, and generating a preset number of initial graphical blocks in the Canvas based on a preset rendering rule, wherein each initial graphical block corresponds to one type of operation type information and a preset number of block content information; acquiring interaction actions of each initial graphical building block; updating the real-time state of each initial graphical building block according to the interaction action and the real-time updating frequency of the canvas to form a target graphical building block; and converting the target graphical building block into a target program code according to a preset program conversion rule. According to the graphical building block programming method, the building blocks are built in the Canvas, so that the building blocks drawn at the webpage end can be updated in real time, and the smoothness of the operation of the building blocks at the webpage end is guaranteed.

Description

Graphical building block programming method and device, electronic equipment and storage medium
Technical Field
The invention relates to the field of graphical programming, in particular to a graphical building block programming method and device, electronic equipment and a storage medium.
Background
At present, traditional building block graphical programming building blocks (Blockly and Scratch) are drawn by using SVG (Scalable Vector Graphics), one building block is drawn by one or more SVGs, and then a working area is formed by splicing by utilizing the conjunction of the SVGs.
Because SVG is rendered and rendered in a browser using a standard Document Object Model (DOM), when the number of SVGs is too large, rendering performance is low and system consumption is high. And the HTML Element DOM on the page can be drawn at the same time, and the pages are blocked at the same time because the number of the SVGs is too large or the refreshing time is too many.
Disclosure of Invention
In order to solve the above technical problem, embodiments of the present application provide a graphical building block programming method, an apparatus, an electronic device, and a storage medium, and the specific scheme is as follows:
in a first aspect, an embodiment of the present application provides a graphical building block programming method, where the graphical building block programming method includes:
obtaining statement information of a building block to be constructed, wherein the statement information of the building block to be constructed comprises building block type information and building block content information corresponding to the building block to be constructed;
creating a Canvas, and generating a preset number of initial graphical blocks in the Canvas based on a preset rendering rule, wherein each initial graphical block corresponds to one type of operation type information and a preset number of block content information;
acquiring interaction actions of each initial graphical building block;
updating the real-time state of each initial graphical building block according to the interaction action and the real-time updating frequency of the Canvas to form a target graphical building block;
and converting the target graphical building block into a target program code according to a preset program conversion rule.
According to a specific implementation manner of the embodiment of the application, the step of obtaining declaration information of the building block to be built includes:
acquiring a user input instruction;
analyzing the user input instruction to obtain the content information and the type information of the user input instruction;
and associating the user input instruction with a preset DSL statement according to the type information to obtain statement information of the building block to be constructed, wherein the statement information is used for indicating the content information and the type information of the user input instruction.
According to a specific implementation manner of the embodiment of the present application, the preset DSL declaration is a declarative program language configured based on an XML tool or a JSON tool.
According to a specific implementation manner of the embodiment of the application, the step of generating a preset number of initial graphical blocks in the Canvas based on a preset rendering rule includes:
calling a first construction program according to the building block type information of the statement information of the building block to be constructed so as to draw the building block outer contour of the initial graphical building block, wherein the building block outer contour comprises a building block buckle design;
calling the first construction program according to the building block content information of the statement information of the building block to be constructed so as to draw a display graph of a preset area of the initial graphical building block;
and calling a second construction program according to the building block buckle design, and tracing the shape combination of the corresponding initial graphical building block so as to complete construction of the initial graphical building block.
According to a specific implementation manner of the embodiment of the application, the block type information includes a head block type, an event block type, an execution block type, and an output block type.
In a second aspect, an embodiment of the present application provides a graphical building block programming device, including:
the building block construction method comprises a first obtaining module, a second obtaining module and a third obtaining module, wherein the first obtaining module is used for obtaining statement information of a building block to be constructed, and the statement information of the building block to be constructed comprises building block type information and building block content information;
the rendering module is used for creating Canvas and generating a preset number of initial graphical blocks in the Canvas based on a preset rendering rule, wherein each initial graphical block corresponds to one type of operation type information and a preset number of block content information;
the second acquisition module is used for acquiring the interaction action of each initial graphical building block;
the updating module is used for updating the real-time state of each initial graphical building block according to the interaction action and the real-time updating frequency of the Canvas so as to form a target graphical building block;
and the conversion module is used for converting the target graphical building block into a target program code according to a preset program conversion rule.
According to a specific implementation manner of the embodiment of the present application, the first obtaining module is specifically configured to obtain a user input instruction; analyzing the user input instruction to obtain the content information and the type information of the user input instruction; and associating the user input instruction with a preset DSL statement according to the type information to obtain statement information of the building block to be constructed, wherein the statement information is used for indicating the content information and the type information of the user input instruction.
According to a specific implementation manner of the embodiment of the application, the rendering module is specifically configured to invoke a first construction program according to the building block type information of the declaration information of the building block to be constructed, so as to draw the building block outer contour of the initial graphical building block, where the building block outer contour includes a building block buckle design; calling the first construction program according to the building block content information of the statement information of the building block to be constructed so as to draw a display graph of a preset area of the initial graphical building block; and calling a second construction program according to the building block buckle design, and tracing the shape combination of the corresponding initial graphical building block so as to complete construction of the initial graphical building block.
In a third aspect, an embodiment of the present application provides an electronic device, which includes a processor and a memory, where the memory stores a computer program, and the computer program, when running on the processor, executes the graphical building block programming method according to the first aspect.
In a fourth aspect, embodiments of the present application provide a computer-readable storage medium, in which a computer program is stored, and when the computer program runs on a processor, the graphical building block programming method according to the first aspect is executed.
The embodiment of the application provides a graphical building block programming method, a graphical building block programming device, electronic equipment and a storage medium, wherein the graphical building block programming method comprises the following steps: obtaining statement information of a building block to be constructed, wherein the statement information of the building block to be constructed comprises building block type information and building block content information corresponding to the building block to be constructed; creating a Canvas, and generating a preset number of initial graphical blocks in the Canvas based on a preset rendering rule, wherein each initial graphical block corresponds to one type of operation type information and a preset number of block content information; acquiring interaction actions of each initial graphical building block; updating the real-time state of each initial graphical building block according to the interaction action and the real-time updating frequency of the Canvas to form a target graphical building block; and converting the target graphical building block into a target program code according to a preset program conversion rule. According to the graphical building block programming method, the building blocks are built in the Canvas, so that the building blocks drawn at the webpage end can be updated in real time, and the smoothness of the operation of the building blocks at the webpage end is guaranteed.
Drawings
In order to more clearly illustrate the technical solution of the present invention, the drawings required to be used in the embodiments will be briefly described below, and it should be understood that the following drawings only illustrate some embodiments of the present invention, and therefore should not be considered as limiting the scope of the present invention. Like components are numbered similarly in the various figures.
Fig. 1 is a schematic method flow diagram illustrating a graphical block programming method according to an embodiment of the present disclosure;
FIG. 2 is a schematic diagram illustrating an interaction structure of a graphical building block programming method according to an embodiment of the present disclosure;
fig. 3 is a schematic diagram illustrating device modules of a graphical block programming device according to an embodiment of the present disclosure.
Detailed Description
The technical solutions in the embodiments of the present invention will be clearly and completely described below with reference to the drawings in the embodiments of the present invention, and it is obvious that the described embodiments are only a part of the embodiments of the present invention, and not all of the embodiments.
The components of embodiments of the present invention generally described and illustrated in the figures herein may be arranged and designed in a wide variety of different configurations. Thus, the following detailed description of the embodiments of the present invention, presented in the figures, is not intended to limit the scope of the invention, as claimed, but is merely representative of selected embodiments of the invention. All other embodiments, which can be derived by a person skilled in the art from the embodiments of the present invention without making any creative effort, shall fall within the protection scope of the present invention.
Hereinafter, the terms "including", "having", and their derivatives, which may be used in various embodiments of the present invention, are only intended to indicate specific features, numbers, steps, operations, elements, components, or combinations of the foregoing, and should not be construed as first excluding the existence of, or adding to, one or more other features, numbers, steps, operations, elements, components, or combinations of the foregoing.
Furthermore, the terms "first," "second," "third," and the like are used solely to distinguish one from another and are not to be construed as indicating or implying relative importance.
Unless otherwise defined, all terms (including technical and scientific terms) used herein have the same meaning as commonly understood by one of ordinary skill in the art to which various embodiments of the present invention belong. The terms (such as those defined in commonly used dictionaries) should be interpreted as having a meaning that is consistent with their contextual meaning in the relevant art and will not be interpreted in an idealized or overly formal sense unless expressly so defined herein in various embodiments of the present invention.
Referring to fig. 1, a schematic method flow diagram of a graphical building block programming method provided in an embodiment of the present application is shown, where, as shown in fig. 1, the graphical building block programming method provided in the embodiment of the present application includes:
step S101, obtaining statement information of a building block to be built, wherein the statement information of the building block to be built comprises building block type information and building block content information corresponding to the building block to be built;
in a specific embodiment, the building blocks are building blocks for graphical programming. A technician configures a common program language into a building block with a solid graph, so that a user can arrange and combine the building block according to the shape of the building block and a logic language indicated by the building block, and the user can associate the program language of the building block while arranging and combining the building blocks, thereby realizing program construction.
Specifically, the building block type information includes a head building block type, an event building block type, an execution building block type, an output building block type, and the like.
The head building block is a building block for configuring a program for displaying the beginning or a designated area of a file.
The time building block is a building block used for triggering the execution of a specified script when a certain event occurs.
The execution building block is a building block for configuring and executing a specific script.
The output building block is used for configuring a program output result.
It should be noted that the type of blocks used in the prior art for the graphical blocks should be included in the possible embodiments of this embodiment.
The building block content information comprises parameter information with actual numerical values, such as color, sound size, image, area, text and the like.
The statement information of the building blocks to be built can be statement information formed by Domain Specific Language (DSL) for graphical programming, specifically, the DSL is programmed in a declarative programming manner, and based on the intermediate structure description language built by the DSL, user input information can be converted into a program language capable of building the building blocks.
According to a specific implementation manner of the embodiment of the application, the step of obtaining declaration information of the building block to be built includes:
acquiring a user input instruction;
analyzing the user input instruction to obtain the content information and the type information of the user input instruction;
and associating the user input instruction with a preset DSL statement according to the type information to obtain statement information of the building block to be constructed, wherein the statement information is used for indicating the content information and the type information of the user input instruction.
In a specific embodiment, a user can perform a command input action on a webpage end, and a graphical building block programming server of the webpage end can automatically receive an instruction input by the user and perform a corresponding building block information association step according to the instruction input by the user.
Specifically, as shown in fig. 2, the graphical building block programming server of the present embodiment includes a DSL parser and a BDP parser. When receiving the user input instruction, the server associates with a DSL declaration program set by a technician in advance, and generates declaration information of the building blocks to be constructed in a combined manner.
Specifically, after receiving the declaration information of the building block to be constructed, the DSL parser parses the declaration program of the building block to be constructed, and splits different types of building blocks to obtain a plurality of declaration information of the building block DSL corresponding to the initial graphical building block. The statement information of building blocks DSL corresponding to the different types of building blocks is statement information a of the building block to be built and statement information B of the building block to be built in fig. 2.
According to a specific implementation manner of the embodiment of the present application, the preset DSL declaration is a declarative program language configured based on an XML tool or a JSON tool.
In a specific embodiment, the declaration information of the corresponding building block to be constructed can be generated by combining the user input instruction with a preset DSL declaration.
For example, the DSL description of the transformed output building block can be:
Figure BDA0003448914160000071
Figure BDA0003448914160000081
step S102, creating a Canvas, and generating a preset number of initial graphical blocks in the Canvas based on a preset rendering rule, wherein each initial graphical block corresponds to one type of operation type information and a preset number of block content information;
in a specific embodiment, after receiving declaration information of a building block to be constructed, the web page-side graphical programming server in this embodiment automatically creates a corresponding Canvas, and draws the graphical building block in the above embodiment on the Canvas.
In particular, Canvas is an HTML element based on HTML5 in which scripts may be used to draw images.
A Canvas is a drawable region defined by HTML code in conjunction with height and width attributes. The Canvas area can be accessed based on JavaScript code, and the graph is dynamically generated through a complete set of drawing functions.
The webpage-side graphical programming server of this embodiment sets a Block Draw rule (BDP) parser corresponding to the Canvas in advance, and can automatically convert the declaration information of the building Block to be constructed into a graphical building Block having a shape, content, and type through the BDP parser.
Specifically, as shown in fig. 2, the BDP parser converts declaration information a of a building block to be built into an initial graphical building block a and converts declaration information B of the building block to be built into an initial graphical building block B according to a preset rendering rule.
According to a specific implementation manner of the embodiment of the application, the step of generating a preset number of initial graphical blocks in the Canvas based on a preset rendering rule includes:
calling a first construction program according to the building block type information of the statement information of the building block to be constructed so as to draw the building block outer contour of the initial graphical building block, wherein the building block outer contour comprises a building block buckle design;
calling the first construction program according to the building block content information of the statement information of the building block to be constructed so as to draw a display graph of a preset area of the initial graphical building block;
and calling a second construction program according to the building block buckle design, and tracing the shape combination of the corresponding initial graphical building block so as to complete construction of the initial graphical building block.
In a specific embodiment, after the statement information of the building block to be built is analyzed, a rect () building program is called according to the building block type information in the statement information, and the contour of the building block is drawn by using the rect () building program.
Specifically, the shape of the block snap design is associated with the block type information, for example, the event block is preset with a snap structure combined with the execution block. The building block buckle design of each type of building block can be set in a self-adaptive mode according to practical application scenes, and the design is not limited here.
When the method uses the rect () building program to draw the outline of the building block, the drawing of the buckle of the building block can be automatically completed.
After the outlines of the building blocks are built, the graph included in rect () or the statement information of the building blocks to be built is continuously used for drawing other built-in areas of the building blocks, for example, field, input and the like are used, and different graphs can be drawn according to different requirements of each building block area.
By means of drawing graphs for different areas of the building blocks, the logic combination relation between different building blocks can be indicated in a color or pattern mode, and users can use the building blocks to conduct graphical programming according to the indication of the graphs.
Specifically, after a building block with a contour is obtained, the shape combination of different building blocks needs To be stroked through a path () or line To () construction program. For the dragging judgment and the buckling judgment between the building blocks, the corresponding judgment programs can be executed according to the frames drawn by the path () and line to () building programs.
Step S103, acquiring interaction actions of each initial graphical building block;
in a specific embodiment, a complete workspace with graphical programming interactions may be obtained through the Canvas creation and the rendering of the initial graphical blocks in the above embodiments.
And the user moves and combines each initial graphical building block in the complete working area generated by the webpage end, and sends the moving and combined interactive action instruction to the graphical programming server of the embodiment so as to construct an application program.
Step S104, updating the real-time state of each initial graphical building block according to the interaction action and the real-time updating frequency of the Canvas to form a target graphical building block;
in a specific embodiment, since the refresh rate of the Canvas is controllable, the graphical programming workspace formed by the Canvas can respond in real time for any interactive action of the building blocks, that is, when a user performs any interactive action in the Canvas, the updating of the program segment can be realized, which is more beneficial for the user to learn languages by using the graphical programming.
And step S105, converting the target graphical building block into a target program code according to a preset program conversion rule.
In a specific embodiment, after a user embeds and associates each initial graphical block, a target graphical block with complete execution logic can be obtained, and based on a conversion rule between the blocks and a program, an execution program corresponding to the target graphical block can be displayed in a program display area of a page.
Specifically, the preset program conversion rule may be implemented by any conventional execution algorithm for converting the graphic building blocks into the program codes, and the program conversion rule is not specifically limited herein.
In this embodiment, by setting the Canvas, the period of converting the graphic building blocks into the program codes can be controlled by controlling the frame rate of the Canvas, and the drawing period of the whole DOM does not need to be relied on, so that the operation fluency of the webpage end is improved. In addition, any operation on the Canvas generates a new DSL declaration and updates BDP rendering rules in real-time to enable a unified format for building blocks on the Canvas.
According to the graphical building block programming method provided by the embodiment, the working area of the graphical building block is improved, and the SVG-based graph building working area is replaced by a Canvas building working area, so that the display frame rate of the webpage end is effectively improved, and the network resource consumption caused by too many building blocks at the webpage end is reduced.
Referring to fig. 3, a schematic diagram of a graphical block programming device 300 according to an embodiment of the present application, where the graphical block programming device 300 according to the embodiment of the present application is shown in fig. 3, the graphical block programming device 300 includes:
the first obtaining module 301 is configured to obtain declaration information of a building block to be built, where the declaration information of the building block to be built includes building block type information and building block content information;
a rendering module 302, configured to create a Canvas, and generate a preset number of initial graphical blocks in the Canvas based on a preset rendering rule, where each initial graphical block corresponds to one type of operation type information and a preset number of block content information respectively;
a second obtaining module 303, configured to obtain an interaction for each initial graphical block;
an updating module 304, configured to update a real-time state of each initial graphical block according to the interaction and a real-time updating frequency of the Canvas, so as to form a target graphical block;
a conversion module 305, configured to convert the target graphical block into a target program code according to a preset program conversion rule.
According to a specific implementation manner of the embodiment of the present application, the first obtaining module 301 is specifically configured to obtain a user input instruction; analyzing the user input instruction to obtain the content information and the type information of the user input instruction; and associating the user input instruction with a preset DSL statement according to the type information to obtain statement information of the building block to be constructed, wherein the statement information is used for indicating the content information and the type information of the user input instruction.
According to a specific implementation manner of the embodiment of the present application, the rendering module 302 is specifically configured to invoke a first building program according to the building block type information of the declaration information of the building block to be built, so as to draw the building block outer contour of the initial graphical building block, where the building block outer contour includes a building block snap design; calling the first construction program according to the building block content information of the statement information of the building block to be constructed so as to draw a display graph of a preset area of the initial graphical building block; and calling a second construction program according to the building block buckle design, and tracing the shape combination of the corresponding initial graphical building block so as to complete construction of the initial graphical building block.
In addition, an electronic device provided by an embodiment of the present application includes a processor and a memory, where the memory stores a computer program, and the computer program executes the graphical building block programming method in the foregoing embodiment when running on the processor.
The embodiment of the present application further provides a computer-readable storage medium, in which a computer program is stored, and when the computer program runs on a processor, the graphical building block programming method in the above embodiment is executed.
To sum up, the embodiment of the application provides a graphical building block programming method, a graphical building block programming device, an electronic device and a storage medium, the invention directly uses Canvas to draw building blocks, all the building blocks are drawn into one Canvas at the same time, splicing is not needed, and the whole Canvas is a complete working area (WorkSpace), so that the defects of DOM drawing can be avoided, and the Canvas can be isolated from other HTML elements at a Web end, the whole page can not be jammed, the frame rate of the page is improved, and the consumption of network resources is reduced.
In addition, for specific implementation processes of the graphical building block programming device, the electronic device, and the computer-readable storage medium mentioned in the above embodiments, reference may be made to the specific implementation processes of the above method embodiments, and details are not repeated here.
In the embodiments provided in the present application, it should be understood that the disclosed apparatus and method can be implemented in other ways. The apparatus embodiments described above are merely illustrative and, for example, the flowchart and block diagrams in the figures illustrate the architecture, functionality, and operation of possible implementations of apparatus, methods and computer program products according to various embodiments of the present invention. In this regard, each block in the flowchart or block diagrams may represent a module, segment, or portion of code, which comprises one or more executable instructions for implementing the specified logical function(s). It should also be noted that, in alternative implementations, the functions noted in the block may occur out of the order noted in the figures. For example, two blocks shown in succession may, in fact, be executed substantially concurrently, or the blocks may sometimes be executed in the reverse order, depending upon the functionality involved. It will also be noted that each block of the block diagrams and/or flowchart illustration, and combinations of blocks in the block diagrams and/or flowchart illustration, can be implemented by special purpose hardware-based systems which perform the specified functions or acts, or combinations of special purpose hardware and computer instructions.
In addition, each functional module or unit in each embodiment of the present invention may be integrated together to form an independent part, or each module may exist separately, or two or more modules may be integrated to form an independent part.
The functions, if implemented in the form of software functional modules and sold or used as a stand-alone product, may be stored in a computer readable storage medium. Based on such understanding, the technical solution of the present invention or a part of the technical solution that contributes to the prior art in essence can be embodied in the form of a software product, which is stored in a storage medium and includes instructions for causing a computer device (which may be a smart phone, a personal computer, a server, or a network device, etc.) to execute all or part of the steps of the method according to the embodiments of the present invention. And the aforementioned storage medium includes: a U-disk, a removable hard disk, a Read-Only Memory (ROM), a Random Access Memory (RAM), a magnetic disk or an optical disk, and other various media capable of storing program codes.
The above description is only for the specific embodiments of the present invention, but the scope of the present invention is not limited thereto, and any person skilled in the art can easily conceive of the changes or substitutions within the technical scope of the present invention, and all the changes or substitutions should be covered within the scope of the present invention.

Claims (10)

1. A graphical building block programming method, comprising:
obtaining statement information of a building block to be constructed, wherein the statement information of the building block to be constructed comprises building block type information and building block content information corresponding to the building block to be constructed;
creating a Canvas, and generating a preset number of initial graphical blocks in the Canvas based on a preset rendering rule, wherein each initial graphical block corresponds to one type of operation type information and a preset number of block content information;
acquiring interaction actions of each initial graphical building block;
updating the real-time state of each initial graphical building block according to the interaction action and the real-time updating frequency of the Canvas to form a target graphical building block;
and converting the target graphical building block into a target program code according to a preset program conversion rule.
2. The graphical building block programming method according to claim 1, wherein the step of obtaining declaration information of the building block to be built comprises:
acquiring a user input instruction;
analyzing the user input instruction to obtain the content information and the type information of the user input instruction;
and associating the user input instruction with a preset DSL statement according to the type information to obtain statement information of the building block to be constructed, wherein the statement information is used for indicating the content information and the type information of the user input instruction.
3. The graphical building block programming method according to claim 2, wherein the predetermined DSL declaration is a declarative programming language based on XML tool or JSON tool configuration.
4. The graphical building block programming method according to claim 1, wherein the step of generating a preset number of initial graphical building blocks in the Canvas based on a preset rendering rule comprises:
calling a first construction program according to the building block type information of the statement information of the building block to be constructed so as to draw the building block outer contour of the initial graphical building block, wherein the building block outer contour comprises a building block buckle design;
calling the first construction program according to the building block content information of the statement information of the building block to be constructed so as to draw a display graph of a preset area of the initial graphical building block;
and calling a second construction program according to the building block buckle design, and tracing the shape combination of the corresponding initial graphical building block so as to complete construction of the initial graphical building block.
5. The graphical building block programming method according to claim 1, wherein the building block type information includes a head building block type, an event building block type, an execution building block type, and an output building block type.
6. A graphical building block programming device, the graphical building block programming device comprising:
the building block construction method comprises a first obtaining module, a second obtaining module and a third obtaining module, wherein the first obtaining module is used for obtaining statement information of a building block to be constructed, and the statement information of the building block to be constructed comprises building block type information and building block content information;
the rendering module is used for creating Canvas and generating a preset number of initial graphical blocks in the Canvas based on a preset rendering rule, wherein each initial graphical block corresponds to one type of operation type information and a preset number of block content information;
the second acquisition module is used for acquiring the interaction action of each initial graphical building block;
the updating module is used for updating the real-time state of each initial graphical building block according to the interaction action and the real-time updating frequency of the Canvas so as to form a target graphical building block;
and the conversion module is used for converting the target graphical building block into a target program code according to a preset program conversion rule.
7. The device according to claim 6, wherein the first obtaining module is specifically configured to obtain a user input instruction; analyzing the user input instruction to obtain the content information and the type information of the user input instruction; and associating the user input instruction with a preset DSL statement according to the type information to obtain statement information of the building block to be constructed, wherein the statement information is used for indicating the content information and the type information of the user input instruction.
8. The apparatus according to claim 6, wherein the rendering module is specifically configured to invoke a first construction program according to the block type information of the declaration information of the block to be constructed, so as to draw a block outer contour of the initial graphical block, where the block outer contour includes a block snap design; calling the first construction program according to the building block content information of the statement information of the building block to be constructed so as to draw a display graph of a preset area of the initial graphical building block; and calling a second construction program according to the building block buckle design, and tracing the shape combination of the corresponding initial graphical building block so as to complete construction of the initial graphical building block.
9. An electronic device, characterized in that the electronic device comprises a processor and a memory, the memory storing a computer program which, when run on the processor, performs the graphical building blocks programming method of any one of claims 1 to 5.
10. A computer-readable storage medium, in which a computer program is stored which, when run on a processor, performs the graphical building blocks programming method of any one of claims 1 to 5.
CN202111658040.1A 2021-12-30 2021-12-30 Graphical building block programming method and device, electronic equipment and storage medium Pending CN114327429A (en)

Priority Applications (1)

Application Number Priority Date Filing Date Title
CN202111658040.1A CN114327429A (en) 2021-12-30 2021-12-30 Graphical building block programming method and device, electronic equipment and storage medium

Applications Claiming Priority (1)

Application Number Priority Date Filing Date Title
CN202111658040.1A CN114327429A (en) 2021-12-30 2021-12-30 Graphical building block programming method and device, electronic equipment and storage medium

Publications (1)

Publication Number Publication Date
CN114327429A true CN114327429A (en) 2022-04-12

Family

ID=81018530

Family Applications (1)

Application Number Title Priority Date Filing Date
CN202111658040.1A Pending CN114327429A (en) 2021-12-30 2021-12-30 Graphical building block programming method and device, electronic equipment and storage medium

Country Status (1)

Country Link
CN (1) CN114327429A (en)

Similar Documents

Publication Publication Date Title
CN108279964B (en) Method and device for realizing covering layer rendering, intelligent equipment and storage medium
US7562070B2 (en) Method and system for aggregating rules that define values for the same property associated with the same document element
CN110263281B (en) Device and method for self-adapting page resolution in data visualization development
EP3218801B1 (en) Rapid application development method
CN104915186B (en) A kind of method and apparatus making the page
CN113655999B (en) Page control rendering method, device, equipment and storage medium
CN111459501A (en) SVG-based Web configuration picture storage and display system, method and medium
CN102945128A (en) Page display method and page display device
CN112102446A (en) Animation processing method and device and computer readable storage medium
CN105528206A (en) Web-based interface generation method
CN112799670B (en) Method and system for unified multi-terminal logic development
CN109343770B (en) Interactive feedback method, apparatus and recording medium
CN112905944B (en) Page online dynamic generation method and device, electronic equipment and readable storage medium
US9727537B2 (en) Application of a system font mapping to a design
CN108255916A (en) Method, equipment, client terminal device and the electronic equipment that Webpage is presented
CN114327429A (en) Graphical building block programming method and device, electronic equipment and storage medium
KR101649822B1 (en) Apparatus and method for building web-page
US10331774B2 (en) System and methods for designing artifacts associated with a webpage
CN112068826B (en) Text input control method, system, electronic device and storage medium
CN114489619A (en) Interface view display method, terminal equipment and computer readable storage medium
CN112015410A (en) Webpage editing method, device and system and computer storage medium
Pavazza et al. The alternative way of creating infographics using SVG technology
CN112632436A (en) Webpage display method and device, electronic equipment and storage medium
CN117406973B (en) Interactive data analysis method and device
CN111722844A (en) Web-based dynamic rich text component design method and device

Legal Events

Date Code Title Description
PB01 Publication
PB01 Publication
SE01 Entry into force of request for substantive examination
SE01 Entry into force of request for substantive examination