CN114201164A - Magnetic attraction method and device for graphical programming module, electronic equipment and medium - Google Patents
Magnetic attraction method and device for graphical programming module, electronic equipment and medium Download PDFInfo
- Publication number
- CN114201164A CN114201164A CN202210154137.7A CN202210154137A CN114201164A CN 114201164 A CN114201164 A CN 114201164A CN 202210154137 A CN202210154137 A CN 202210154137A CN 114201164 A CN114201164 A CN 114201164A
- Authority
- CN
- China
- Prior art keywords
- building block
- graphic programming
- programming building
- graphic
- distance
- 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
Links
Images
Classifications
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F8/00—Arrangements for software engineering
- G06F8/30—Creation or generation of source code
- G06F8/34—Graphical or visual programming
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F3/00—Input arrangements for transferring data to be processed into a form capable of being handled by the computer; Output arrangements for transferring data from processing unit to output unit, e.g. interface arrangements
- G06F3/01—Input arrangements or combined input and output arrangements for interaction between user and computer
- G06F3/048—Interaction techniques based on graphical user interfaces [GUI]
- G06F3/0481—Interaction techniques based on graphical user interfaces [GUI] based on specific properties of the displayed interaction object or a metaphor-based environment, e.g. interaction with desktop elements like windows or icons, or assisted by a cursor's changing behaviour or appearance
- G06F3/04812—Interaction techniques based on cursor appearance or behaviour, e.g. being affected by the presence of displayed objects
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F3/00—Input arrangements for transferring data to be processed into a form capable of being handled by the computer; Output arrangements for transferring data from processing unit to output unit, e.g. interface arrangements
- G06F3/01—Input arrangements or combined input and output arrangements for interaction between user and computer
- G06F3/048—Interaction techniques based on graphical user interfaces [GUI]
- G06F3/0484—Interaction techniques based on graphical user interfaces [GUI] for the control of specific functions or operations, e.g. selecting or manipulating an object, an image or a displayed text element, setting a parameter value or selecting a range
- G06F3/0486—Drag-and-drop
Landscapes
- Engineering & Computer Science (AREA)
- General Engineering & Computer Science (AREA)
- Theoretical Computer Science (AREA)
- Software Systems (AREA)
- Physics & Mathematics (AREA)
- General Physics & Mathematics (AREA)
- Human Computer Interaction (AREA)
- User Interface Of Digital Computer (AREA)
Abstract
The application relates to the technical field of graphical programming, in particular to a magnetic attraction method, a magnetic attraction device, electronic equipment and a medium for a graphical programming module, wherein the method comprises the steps of monitoring the dragging operation of a user on a graphical programming building block in a preset area; when the graphic programming building block is placed in the preset area, acquiring the position of the graphic programming building block in the preset area; calculating the distance between the graphic programming building block and the connected graphic programming building block in a preset area, wherein the connected graphic programming building block is the graphic programming building block of which the outline shape can be connected; whether the distance is smaller than a first preset threshold value or not is judged, if yes, the graphic programming building blocks and the connected graphic programming building blocks are connected for prompting, and the problem that the sequence is disordered or even overlapped due to the fact that the number of the graphic programming building blocks is large can be reduced.
Description
Technical Field
The present application relates to the field of graphical programming technologies, and in particular, to a magnetic attraction method and apparatus for a graphical programming module, an electronic device, and a medium.
Background
Compared with the traditional text code programming, the graphical programming can stimulate the interest of learning programming. The graphical programming has the advantages that various numerical values, functions, displays and other functions are changed into icons, a complete function can be realized through connecting lines, and the programming is embodied in a more intuitive form through the form of the icons, so that the graphical programming is particularly suitable for adolescent students.
However, when the number of the graphic programming building blocks placed on the workbench is large, the problem of disordered sequence or even overlapping is easy to occur, and the sequence of function triggering may be affected by the placing sequence or the position relationship, which may finally affect the debugging effect.
Disclosure of Invention
In order to reduce the problem of disordered sequence and even coverage stacking caused by the large number of graphic programming building blocks, the application provides a magnetic attraction method, a magnetic attraction device, electronic equipment and a magnetic attraction medium for a graphic programming module.
In a first aspect of the present application, a magnetic attraction method for a graphical programming module is provided, the method includes monitoring a dragging operation of a user on a graphical programming building block in a preset area; when the graphic programming building block is placed in the preset area, acquiring the position of the graphic programming building block in the preset area; calculating the distance between the graphic programming building block and a jointed graphic programming building block in the preset area, wherein the jointed graphic programming building block is a graphic programming building block of which the outline shape can be jointed; and judging whether the distance is smaller than a first preset threshold value, if so, carrying out connection prompt on the graphic programming building block and the connected graphic programming building block.
By adopting the technical scheme, when a user drags the graphic programming building block into the preset area, the dragged and dropped position of the graphic programming building block is monitored in real time, the position in the preset area is obtained, then the graphic programming building block which can be connected with the newly dragged graphic programming building block in the preset area is determined, the distance between the connected graphic programming building block and the newly dragged graphic programming building block is respectively calculated, the connected graphic programming building block with the distance smaller than the first preset threshold value is judged, and the newly dragged graphic programming building block and the graphic programming building block with the distance smaller than the first preset threshold value are subjected to connection prompt.
Preferably, the obtaining the position of the graphic programming building block in the preset area includes, when the graphic programming building block is an embedded building block, obtaining a position of a leftmost end point on a left side contour line of the graphic programming building block as the position of the graphic programming building block in the preset area; and when the graphic programming building block is a connecting building block, acquiring the position of the lowest end point of the upper notch and/or the lower protrusion of the graphic programming building block as the position of the graphic programming building block in the preset area.
Preferably, the calculating the distance between the graphic programming block and the engaged graphic programming block in the preset region comprises calculating the distance between the leftmost point on the left contour line of the graphic programming block and the leftmost point on the left contour line of the inner contour line of the engaged graphic programming block as the distance between the graphic programming block and the engaged graphic programming block in the preset region when the graphic programming block is the embedded block; and when the graphic programming building block is a connected building block, calculating the distance between the position of the lowest-end point of the upper notch of the graphic editing building block and the position of the lowest-end point of the lower protrusion of the connected graphic programming building block as the distance between the graphic programming building block and the connected graphic programming building block in the preset area.
Preferably, the prompting of the engagement of the graphic programming building block and the engaged graphic programming building block comprises the step of performing gray shadow display on the outline of the graphic programming building block and the inner outline of the embeddable graphic programming building block as an engagement prompt when the graphic programming building block is an embedded building block; and when the graphic programming building block is a connected building block, performing gray shadow display on the outline of the graphic programming building block and the outline of the connectable graphic programming building block to serve as a connection prompt.
Preferably, after calculating the distance between the graphic programming block and the engaged graphic programming block in the preset region, the method further includes, if the distance is smaller than a second preset threshold, automatically adsorbing the graphic programming block and the engaged graphic programming block smaller than the second preset threshold, where the second preset threshold is smaller than the first preset threshold.
Preferably, the method further comprises when the user drags the graphical programming building block to insert into the combined graphical programming building blocks, judging whether the outline of the graphical programming building block can be connected with the outline of the combined graphical programming building block;
if so, separating the jointed graphic programming building blocks according to the insertion positions, and enabling the graphic programming building blocks to be automatically adsorbed to the separated graphic programming building blocks;
if not, judging whether the graphic programming building block can be embedded into the combined graphic programming building block or not;
if so, enabling the graphic programming building block to be automatically adsorbed to the embeddable graphic programming building block when the distance between the graphic programming building block and the embeddable graphic programming building block is smaller than a third preset threshold value.
Preferably, the method further comprises highlighting a border of the user-selected graphical programming building block.
In a second aspect of the present application, a magnetic attraction device for a graphical programming module is provided, which includes a monitoring module, configured to monitor a dragging operation of a user on a graphical programming building block in a preset area;
the position acquisition module is used for acquiring the position of the graphic programming building block in the preset area when the graphic programming building block is placed in the preset area;
the distance calculation module is used for calculating the distance between the graphic programming building block and a jointed graphic programming building block in the preset area, and the jointed graphic programming building block is a graphic programming building block of which the outline shape can be jointed;
and determining a magnetic suction module for judging whether the distance is smaller than a first preset threshold value, and if so, carrying out engagement prompt on the graphic programming building block and the engaged graphic programming building block.
In a third aspect of the present application, an electronic device is presented, comprising a memory having stored thereon a computer program and a processor implementing the method according to any of the first aspect when executing the program.
In a fourth aspect of the present application, a computer-readable storage medium is presented, on which a computer program is stored which, when being executed by a processor, carries out the method according to any one of the first aspect.
Drawings
The above and other features, advantages and aspects of various embodiments of the present application will become more apparent by referring to the following detailed description when taken in conjunction with the accompanying drawings. In the drawings, like or similar reference characters designate like or similar elements, and wherein:
fig. 1 is a block diagram of an electronic device according to an embodiment of the present application.
Fig. 2 is a schematic diagram of a display screen display interface in an embodiment of the present application.
FIG. 3 is a flowchart of a magnetic attraction method of a graphical programming module according to an embodiment of the present disclosure.
FIG. 4 is a diagram illustrating an embodiment of an embedded block finding a coordinate point.
Fig. 5 is a schematic outline view of the connecting block in one embodiment.
FIG. 6 is a schematic outline view of another connecting block of one embodiment.
FIG. 7 is a schematic diagram of another contour of the connecting block of the embodiment.
FIG. 8 is a schematic diagram illustrating automatic adsorption of a graphic programming block in one embodiment.
FIG. 9 is a diagram illustrating automatic absorption of a graphic programming block inserted into a combination according to an embodiment.
FIG. 10 is a schematic block diagram of a magnetic attraction device of the graphic programming module in the embodiment of the present application.
Detailed Description
In order to make the objects, technical solutions and advantages of the embodiments of the present application clearer, the technical solutions in the embodiments of the present application will be clearly and completely described below with reference to the drawings in the embodiments of the present application, and it is obvious that the described embodiments are some embodiments of the present application, but not all embodiments. All other embodiments, which can be derived by a person skilled in the art from the embodiments given herein without making any creative effort, shall fall within the protection scope of the present application.
In addition, the term "and/or" herein is only one kind of association relationship describing an associated object, and means that there may be three kinds of relationships, for example, a and/or B, which may mean: a exists alone, A and B exist simultaneously, and B exists alone. In addition, the character "/" herein generally indicates that the former and latter related objects are in an "or" relationship, unless otherwise specified.
Compared with the traditional text code programming, the graphical programming can stimulate the interest of learning programming. The graphic programming has the advantages that various numerical values, functions, display and other functions are changed into icons, a complete function can be realized through connecting lines, the programming is embodied in a more intuitive form through the form of the icons, and the graphic programming building blocks are particularly suitable for adolescent students.
Next, a system architecture according to an embodiment of the present application will be described. It should be noted that the system architecture and the service scenario described in the embodiment of the present application are for more clearly illustrating the technical solution of the embodiment of the present application, and do not constitute a limitation to the technical solution provided in the embodiment of the present application, and as a person having ordinary skill in the art knows that along with the evolution of the network architecture and the appearance of a new service scenario, the technical solution provided in the embodiment of the present application is also applicable to similar technical problems.
Fig. 1 shows a block diagram of an electronic device according to an embodiment of the present application.
Electronic devices include, but are not limited to: at least one of a mobile phone, a foldable electronic device, a notebook computer, a desktop computer, a laptop computer, a handheld computer, an ultra mobile personal computer, a PDA (personal digital assistant), a PAD (tablet), a PMP (portable multimedia player), a Virtual Reality (VR) device, an artificial intelligence (Al) device, a wearable device, an in-vehicle device, an intelligent home device, or a smart city device. The embodiment of the present application does not specifically limit the specific type of the electronic device.
The electronic device 100 may include a processor 110, an external memory interface 120, an internal memory 130, a sensor module 140, a display 150, and the like. Wherein the sensor module 140 may include a touch sensor 141, a pressure sensor 142, and the like.
It is to be understood that the illustrated structure of the embodiment of the present application does not specifically limit the electronic device 100. In other embodiments of the present application, the electronic device 100 may include more components (such as a camera, a power supply, an audio module, a USB interface, a headset interface, etc.) or fewer components (such as only the external memory interface 120 or only the internal memory 130) than those shown, or some components may be combined, some components may be separated, or a different arrangement of components may be used. The illustrated components may be implemented in hardware, software, or a combination of software and hardware.
The processor 110 may generate operation control signals according to the instruction operation code and the timing signals, so as to complete the control of instruction fetching and instruction execution.
A memory may also be provided in processor 110 for storing instructions and data. In some embodiments, the memory in the processor 110 may be a cache memory. The memory may store instructions or data that have been used or used more frequently by the processor 110. If the processor 110 needs to use the instruction or data, it can be called directly from the memory. Avoiding repeated accesses reduces the latency of the processor 110, thereby increasing the efficiency of the system.
It should be understood that the interface connection relationship between the modules illustrated in the embodiments of the present application is only an illustration, and does not limit the structure of the electronic device 100. In other embodiments of the present application, the electronic device 100 may also adopt different interface connection manners or a combination of multiple interface connection manners in the above embodiments.
The electronic device 100 may implement display functions via the GPU, the display screen 150, and the application processor 110, among others. The GPU is a microprocessor 110 for image processing, connected to a display screen 150 and an application processor 110. The GPU is used to perform mathematical and geometric calculations for graphics rendering. The processor 110 may include one or more GPUs that execute program instructions to generate or alter display information.
The display screen 150 is used to display images, video, and the like. The display screen 150 includes a display panel. In some embodiments, the electronic device 100 may include 1 or more display screens 150. In the solution provided by the embodiment of the present application, the display screen 150 may be used for presenting services that are recommended by the device through calculation.
The pressure sensor 142 is used for sensing a pressure signal and converting the pressure signal into an electrical signal. In some embodiments, the pressure sensor 142 may be disposed on the display screen 150. The pressure sensors 142 may be of various types, such as resistive pressure sensors 142, inductive pressure sensors 142, capacitive pressure sensors 142, and the like. The capacitive pressure sensor 142 may be a sensor including at least two parallel plates having a conductive material. When a force acts on the pressure sensor 142, the capacitance between the electrodes changes. The electronic device 100 determines the strength of the pressure from the change in capacitance. When a touch operation is applied to the display screen 150, the electronic apparatus 100 detects the intensity of the touch operation based on the pressure sensor. The electronic apparatus 100 may also calculate the touched position based on the detection signal of the pressure sensor 142. In some embodiments, when a touch operation with the touch operation intensity smaller than the first pressure threshold value acts on the application icon, the application is considered to be clicked, and the historical click rate of the application is increased.
The touch sensor 141 is also referred to as a "touch device". The touch sensor 141 may be disposed on the display screen 150, and the touch sensor 141 and the display screen 150 form a touch screen, which is also called a "touch screen". The touch sensor 141 is used to detect a touch operation applied thereto or nearby. The touch sensor 141 can communicate the detected touch operation to the application processor 110 to determine the touch event type. Visual output associated with the touch operation may be provided through the display screen 150. In other embodiments, the touch sensor 141 may be disposed on the surface of the electronic device 100 at a different position than the display screen 150.
Optionally, the electronic device 100 may further include other sensors, such as a barometric pressure sensor, a magnetic sensor, a proximity light sensor, an ambient light sensor, and the like.
In the embodiment of the present application, as shown in fig. 2, the content displayed on the display screen includes a graphical programming building block list 201 and a work area 202, a user may select a corresponding graphical programming building block from the list 201 according to the code requirement and drag the graphical programming building block to the work area 202, and place the graphical programming building block according to the execution logic of the code, and the work area 202 executes the code represented by the graphical programming building block according to the order of the graphical programming building blocks placed by the user, where when the user places the graphical programming building block in the work area 202, the magnetic attraction between the graphical programming building blocks refers to the method described below.
The electronic device applied to the embodiment of the present application is described above with reference to fig. 1 and fig. 2, and based on the electronic device, a magnetic attraction method for a graphical programming module provided in the embodiment of the present application is described below.
Fig. 3 is a flowchart illustrating a magnetic attraction method of a graphical programming module in an embodiment of the present application, and as shown in fig. 3, the method includes:
step S301, monitoring the dragging operation of the graphical programming building blocks in the preset area by the user.
In the embodiment of the application, an execution main body of the magnetic attraction method for the graphical programming module can monitor dragging operation of a user on the graphical programming building blocks in a preset area through monitoring mouse dragging or touch screen dragging, the preset area is a workbench which is divided in a front-end interface and used for the user to put, sort and operate the graphical programming building blocks, and when the user drags the graphical programming building blocks into the preset area, the dragging operation of the user on the graphical programming building blocks is monitored in real time.
Step S302, when the graphic programming building block is placed in the preset area, the position of the graphic programming building block in the preset area is obtained.
In step S302, after monitoring that the user drags the graphic programming building block into the preset area and places the graphic programming building block, the coordinate position of the graphic programming building block in the preset area is obtained.
In one example, a coordinate system may be set in advance on the working area, that is, the preset area, and when the user drags the graphic programming building block into the working area, the coordinate position of the graphic programming building block in the coordinate system is obtained as the position of the graphic programming building block in the preset area.
In some embodiments of the application, obtaining the location of the graphical programming blocks in the predetermined area includes,
in an implementation manner, referring to fig. 4, the embedded block may be configured to be a left protrusion, but there are a plurality of points on a vertical line where the leftmost point on the left contour line is located, and then the uppermost point or the lowermost point on the vertical line may be taken as the coordinate position of the block in the preset area.
When the graphic programming building block is a connected building block, acquiring the position of the lowest end point of the upper notch and/or the lower protrusion of the graphic programming building block as the position of the graphic programming building block in the preset area, wherein in some realizable modes, the connected building block comprises three types, one type is the connected building block at the event starting end, and referring to fig. 5, the building block comprises the lower protrusion for connecting the subsequent building block; the second is a connected building block of intermediate events, see fig. 6, comprising an upper recess and a lower protrusion for engaging the building block back and forth; the third type is a connected block with event termination, see fig. 7, which includes an upper notch for engaging a preceding block to terminate an event. When the graphic programming building block only comprises the upper notch or the lower protrusion, the position of the point at the lowest end of the included upper notch or the lower protrusion is only required to be calculated as the coordinate position of the graphic programming building block in the preset area, and when the graphic programming building block comprises the upper notch and the lower protrusion, the position of the point at the lowest end of the upper notch and the position of the point at the lowest end of the lower protrusion are both calculated as the coordinate position of the graphic programming product in the preset area.
In some application embodiments, the coordinate position of the graphical programming building block in the preset area may also be obtained after monitoring that the graphical programming building block is dragged into the preset area by the user for a preset time, and in one example, the position of the graphical programming building block may be calculated after the graphical programming building block is dragged into the preset area by the user for a certain position and is stalled for 2 seconds.
Step S303, calculating the distance between the graphic programming building block and the connected graphic programming building block in the preset area, wherein the connected graphic programming building block is the graphic programming building block of which the outline shape can be connected.
In step S303, when the user drags in a new graphical programming block, there may be a plurality of graphical programming blocks already in the preset area, and among the plurality of existing graphical programming blocks, there may be one or more graphical programming blocks that can be engaged with the outline of the newly dragged graphical programming block, and the existing graphical programming blocks have each been pre-calculated for their position in the preset area, and the distances between the graphical programming block and all engaged graphical programming blocks in the preset area are obtained by calculating the distances between the positions of the pre-obtained points of the graphical programming blocks. In one example, a coordinate system is established in the preset area, the coordinate position of a point on the newly dragged graphical programming building block in the coordinate system is obtained in advance in step S302, and the coordinate position of a point on the engaged graphical programming building block in the coordinate system is obtained in advance, and then the distance between the coordinate positions of the points on the newly dragged and engaged graphical programming building blocks is calculated to be the distance between the two graphical programming building blocks.
In some embodiments, calculating the distance between the graphic programming block and the engaged graphic programming block in the predetermined area comprises:
when the graph programming building block is an embedded building block, the distance between the leftmost end point on the left side contour line of the graph programming building block and the leftmost end point on the left contour line in the inner contour line of the connected graph programming building block is calculated to serve as the distance between the graph programming building block and the connected graph programming building block in the preset area, because the length of each graph programming building block is different, when the graph programming building blocks are embedded and connected, the left contour line is an alignment line, the leftmost end point on the left side contour line of the graph programming building block and the leftmost end point on the left contour line in the inner contour line of the connected graph programming building block are selected to serve as calculation points of the distance, and the accuracy is high.
When the graphic programming building block is a connecting type building block, the distance between the position of the lowest end point of the upper notch of the graphic editing building block and the position of the lowest end point of the lower protrusion of the connected graphic programming building block is calculated to be used as the distance between the graphic programming building block and the connected graphic programming building block in the preset area.
And step S304, judging whether the distance is smaller than a first preset threshold value, if so, carrying out connection prompt on the graphic programming building block and the connected graphic programming building block.
In the embodiment of the application, after a user drags a new graphic programming building block into a preset area, the graphic programming building block is placed in the preset area, the distance between the graphic programming building block and all connected graphic programming building blocks is calculated, the distance is judged with a first preset threshold value, a connected graphic programming building block with the distance between the newly dragged graphic programming building block and the connected graphic programming building block smaller than the first preset threshold value is determined, a connection prompt is made between the determined connected graphic programming building block and the newly dragged graphic programming building block, in some embodiments, the first preset threshold value can be set to be three times the maximum width of the newly dragged graphic programming building block, and when the distance between the connected graphic programming building block and the newly dragged graphic programming building block is smaller than the first preset threshold value, the connected graphic programming building block and the newly dragged graphic programming building block are made a connection prompt.
In one implementation, when the graphical programming building block is an embedded building block, the outline of the graphical programming building block and the inner outline of the embedded graphical programming building block are subjected to gray shadow display to serve as a connection prompt;
and when the graphic programming building block is the connecting type building block, performing gray shadow display on the outline of the graphic programming building block and the outline of the connectable graphic programming building block to serve as a connection prompt.
The user can select the corresponding graphic programming building blocks to be linked in the programming according to the linking prompt, so that the graphic programming building blocks in the preset area are arranged in sequence, the problem that when the number of the graphic programming building blocks in the preset area is large, the sequence is disordered and even overlapped is solved, and the problem that the debugging effect is influenced due to the fact that the placing sequence or the position relation influences the sequence triggered by the functions is solved.
In some application embodiments, after calculating the distance between the graphic programming block and the engaged graphic programming block in the preset region, the method further includes determining whether the distance between the graphic programming block and the engaged graphic programming block is smaller than a second preset threshold, and if so, automatically adsorbing the graphic programming block and the engaged graphic programming block smaller than the second preset threshold, where the second preset threshold is smaller than the first preset threshold. In some embodiments, the second predetermined threshold may be set to the maximum width of the newly dragged graphical programming block, and the newly dragged graphical programming block and the engaged graphical programming block are automatically attracted when the distance between the two blocks is less than the second predetermined threshold.
In an implementation manner, as shown in fig. 8, during the automatic absorption process, a shadow with the same size and shape as the newly dragged graphic programming building block can be set at the engagement position of the engaged graphic programming building block as the automatic absorption prompt.
In some application embodiments, when a user drags the graphical programming building block to insert into the combined graphical programming building blocks, whether the outline of the graphical programming building block can be connected and connected with the outline of the combined graphical programming building block is judged;
if so, separating the jointed graphic programming building blocks according to the insertion positions, and enabling the graphic programming building blocks to be automatically adsorbed to the separated graphic programming building blocks;
if not, judging whether the graphic programming building block can be embedded into the combined graphic programming building block or not;
if so, enabling the graphic programming building block to be automatically adsorbed to the embeddable graphic programming building block when the distance between the graphic programming building block and the embeddable graphic programming building block is smaller than a third preset threshold value.
In the preset area, a user may have operated some graphic programming building block combinations, but in the programming process, a new graphic programming building block needs to be inserted or embedded into a certain graphic programming building block among a plurality of combined graphic programming building blocks, when the user drags the new graphic programming building block to the combined graphic programming building blocks, the user firstly judges whether the outline shape of the graphic programming building block can be connected and connected with the combined graphic programming building block, if so, the connected graphic programming building block is separated according to the insertion position dragged by the user, referring to fig. 9, when the user puts the graphic programming building block, the graphic programming building block can be automatically absorbed to the separated graphic programming building block, the insertion process of the newly dragged graphic programming building block is completed, if the outline shape of the newly dragged graphic programming building block cannot be connected and connected with the combined graphic programming building block, and if so, when the user drags the graphic programming building block to be close to the embedded building block, and the distance between the graphic programming building block and the embeddable graphic programming building block is smaller than a third preset threshold value, the graphic programming building block is automatically adsorbed into the embeddable graphic programming building block to complete the engagement of new dragging, and the third preset threshold value can be set to be half of the maximum width of the newly dragged graphic programming building block.
In some embodiments of the application, the border of the graphical programming building block selected by the user is highlighted.
The user can select or operate the graphic programming building blocks dragged into the preset area, so that the user can conveniently identify the graphic programming building blocks, and the frame of the graphic programming building blocks selected by the user can be highlighted.
It should be noted that, for simplicity of description, the above-mentioned method embodiments are described as a series of acts or combination of acts, but those skilled in the art will recognize that the present application is not limited by the order of acts described, as some steps may occur in other orders or concurrently depending on the application. Further, those skilled in the art should also appreciate that the embodiments described in the specification are exemplary embodiments and that the acts and modules referred to are not necessarily required in this application.
The above is a description of method embodiments, and the embodiments of the present application are further described below by way of apparatus embodiments.
Fig. 10 is a schematic block diagram of a magnetic attraction device of a graphical programming module in an embodiment of the present application, and as shown in fig. 10, the magnetic attraction device includes:
and the monitoring module 1001 is configured to monitor a dragging operation of the graphic programming building block in a preset area by a user.
A position obtaining module 1002, configured to obtain a position of the graphical programming blocks in the preset area when the graphical programming blocks are placed in the preset area.
And the distance calculation module 1003 is used for calculating the distance between the graphic programming building block and the connected graphic programming building block in the preset area, and the connected graphic programming building block is the graphic programming building block of which the outline shape of the graphic programming building block can be connected.
And a magnetic attraction determining module 1004 for determining whether the distance is smaller than a first preset threshold value, and if so, performing engagement prompting on the graphic programming building block and the engaged graphic programming building block.
It can be clearly understood by those skilled in the art that, for convenience and brevity of description, the specific working process of the described apparatus may refer to the corresponding process in the foregoing method embodiment, and is not described herein again.
In the above embodiments, the implementation may be wholly or partly realized by software, hardware, firmware, or any combination thereof. When implemented in software, may be implemented in whole or in part in the form of a computer program product. The computer program product includes one or more computer instructions. When loaded and executed on a computer, cause the processes or functions described in accordance with the embodiments of the application to occur, in whole or in part. The computer may be a general purpose computer, a special purpose computer, a network of computers, or other programmable device. The computer instructions may be stored on a computer readable storage medium or transmitted from one computer readable storage medium to another, for example, from one website, computer, server, or data center to another website, computer, server, or data center via wire (e.g., coaxial cable, fiber optic, Digital Subscriber Line (DSL)) or wireless (e.g., infrared, wireless, microwave, etc.). The computer-readable storage medium can be any available medium that can be accessed by a computer or a data storage device, such as a server, a data center, etc., that includes one or more of the available media. The usable medium may be a magnetic medium (e.g., floppy disk, hard disk, magnetic tape), an optical medium (e.g., Digital Versatile Disk (DVD)), or a semiconductor medium (e.g., Solid State Disk (SSD)), among others. It is noted that the computer-readable storage medium referred to in the embodiments of the present application may be a non-volatile storage medium, in other words, a non-transitory storage medium.
The above description is only a preferred embodiment of the application and is illustrative of the principles of the technology employed. It will be appreciated by those skilled in the art that the scope of the application referred to in the present application is not limited to the embodiments with a particular combination of the above-mentioned features, but also encompasses other embodiments with any combination of the above-mentioned features or their equivalents without departing from the spirit of the application. For example, the above features may be replaced with (but not limited to) features having similar functions as those described in this application.
The foregoing is only a partial embodiment of the present application, and it should be noted that, for those skilled in the art, several modifications and decorations can be made without departing from the principle of the present application, and these modifications and decorations should also be regarded as the protection scope of the present application.
Claims (10)
1. A magnetic attraction method of a graphical programming module is characterized by comprising the following steps,
monitoring the dragging operation of a user on the graphic programming building blocks in a preset area;
when the graphic programming building block is placed in the preset area, acquiring the position of the graphic programming building block in the preset area;
calculating the distance between the graphic programming building block and a jointed graphic programming building block in the preset area, wherein the jointed graphic programming building block is a graphic programming building block of which the outline shape can be jointed;
and judging whether the distance is smaller than a first preset threshold value, if so, carrying out connection prompt on the graphic programming building block and the connected graphic programming building block.
2. The method of claim 1, wherein the obtaining the position of the graphic programming building block in the predetermined area comprises,
when the graphic programming building block is an embedded building block, acquiring the position of the leftmost point on the left side contour line of the graphic programming building block as the position of the graphic programming building block in the preset area;
and when the graphic programming building block is a connecting building block, acquiring the position of the lowest end point of the upper notch and/or the lower protrusion of the graphic programming building block as the position of the graphic programming building block in the preset area.
3. The method of claim 2, wherein calculating the distance between the graphical programming blocks and the engaged graphical programming blocks in the predetermined area comprises,
when the graphic programming building block is an embedded building block, calculating the distance between the leftmost point on the left side contour line of the graphic programming building block and the leftmost point on the left side contour line in the inner contour line of the connected graphic programming building block as the distance between the graphic programming building block and the connected graphic programming building block in the preset area;
and when the graphic programming building block is a connected building block, calculating the distance between the position of the lowest-end point of the upper notch of the graphic editing building block and the position of the lowest-end point of the lower protrusion of the connected graphic programming building block as the distance between the graphic programming building block and the connected graphic programming building block in the preset area.
4. The method of claim 3, wherein engaging the graphical programming blocks with engaged graphical programming blocks comprises engaging the graphical programming blocks with the engaged graphical programming blocks,
when the graphic programming building block is an embedded building block, performing gray shadow display on the outline of the graphic programming building block and the inner outline of the embedded graphic programming building block to serve as a connection prompt;
and when the graphic programming building block is a connected building block, performing gray shadow display on the outline of the graphic programming building block and the outline of the connectable graphic programming building block to serve as a connection prompt.
5. The method of claim 1, further comprising, after calculating the distance between the graphical programming blocks and the engaged graphical programming blocks in the predetermined area,
and if the distance is smaller than a second preset threshold value, enabling the graphic programming building block to be automatically adsorbed with the connected graphic programming building block smaller than the second preset threshold value, wherein the second preset threshold value is smaller than the first preset threshold value.
6. The method of claim 5, further comprising,
when a user drags the graphic programming building block to be inserted into the combined graphic programming building blocks, judging whether the outline of the graphic programming building block can be connected and connected with the outline of the combined graphic programming building block or not;
if so, separating the jointed graphic programming building blocks according to the insertion positions, and enabling the graphic programming building blocks to be automatically adsorbed to the separated graphic programming building blocks;
if not, judging whether the graphic programming building block can be embedded into the combined graphic programming building block or not;
if so, enabling the graphic programming building block to be automatically adsorbed to the embeddable graphic programming building block when the distance between the graphic programming building block and the embeddable graphic programming building block is smaller than a third preset threshold value.
7. The method of claim 1, further comprising,
and highlighting the frame of the graphical programming building block selected by the user.
8. A magnetic attraction device of a graphical programming module is characterized by comprising,
the monitoring module is used for monitoring the dragging operation of a user on the graphic programming building blocks in a preset area;
the position acquisition module is used for acquiring the position of the graphic programming building block in the preset area when the graphic programming building block is placed in the preset area;
the distance calculation module is used for calculating the distance between the graphic programming building block and a jointed graphic programming building block in the preset area, and the jointed graphic programming building block is a graphic programming building block of which the outline shape can be jointed;
and determining a magnetic suction module for judging whether the distance is smaller than a first preset threshold value, and if so, carrying out engagement prompt on the graphic programming building block and the engaged graphic programming building block.
9. An electronic device comprising a memory and a processor, the memory having stored thereon a computer program, wherein the processor, when executing the program, implements the method of any of claims 1-7.
10. A computer-readable storage medium, on which a computer program is stored, which program, when being executed by a processor, carries out the method according to any one of claims 1 to 7.
Priority Applications (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN202210154137.7A CN114201164A (en) | 2022-02-21 | 2022-02-21 | Magnetic attraction method and device for graphical programming module, electronic equipment and medium |
Applications Claiming Priority (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN202210154137.7A CN114201164A (en) | 2022-02-21 | 2022-02-21 | Magnetic attraction method and device for graphical programming module, electronic equipment and medium |
Publications (1)
| Publication Number | Publication Date |
|---|---|
| CN114201164A true CN114201164A (en) | 2022-03-18 |
Family
ID=80645554
Family Applications (1)
| Application Number | Title | Priority Date | Filing Date |
|---|---|---|---|
| CN202210154137.7A Pending CN114201164A (en) | 2022-02-21 | 2022-02-21 | Magnetic attraction method and device for graphical programming module, electronic equipment and medium |
Country Status (1)
| Country | Link |
|---|---|
| CN (1) | CN114201164A (en) |
Cited By (1)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN117667058A (en) * | 2023-12-06 | 2024-03-08 | 北京亦心科技有限公司 | Building block processing method in graphical programming, equipment, storage medium and terminal thereof |
Citations (4)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN113031939A (en) * | 2021-04-28 | 2021-06-25 | 深圳市腾讯网域计算机网络有限公司 | Method for adjusting building blocks in graphical programming tool and related device |
| CN113656018A (en) * | 2021-06-30 | 2021-11-16 | 深圳点猫科技有限公司 | Building block placement interaction method, device and equipment for graphical programming platform |
| US11221727B1 (en) * | 2020-09-08 | 2022-01-11 | Avaya Management L.P. | Visual interlocking block based programming method and system |
| CN114020260A (en) * | 2021-11-17 | 2022-02-08 | 上海布鲁可积木科技有限公司 | Instruction array analysis method and system suitable for entity building block programming and toy |
-
2022
- 2022-02-21 CN CN202210154137.7A patent/CN114201164A/en active Pending
Patent Citations (4)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| US11221727B1 (en) * | 2020-09-08 | 2022-01-11 | Avaya Management L.P. | Visual interlocking block based programming method and system |
| CN113031939A (en) * | 2021-04-28 | 2021-06-25 | 深圳市腾讯网域计算机网络有限公司 | Method for adjusting building blocks in graphical programming tool and related device |
| CN113656018A (en) * | 2021-06-30 | 2021-11-16 | 深圳点猫科技有限公司 | Building block placement interaction method, device and equipment for graphical programming platform |
| CN114020260A (en) * | 2021-11-17 | 2022-02-08 | 上海布鲁可积木科技有限公司 | Instruction array analysis method and system suitable for entity building block programming and toy |
Cited By (1)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN117667058A (en) * | 2023-12-06 | 2024-03-08 | 北京亦心科技有限公司 | Building block processing method in graphical programming, equipment, storage medium and terminal thereof |
Similar Documents
| Publication | Publication Date | Title |
|---|---|---|
| EP2990924B1 (en) | Gesture-based on-chart data filtering | |
| CN106575196B (en) | Electronic device and method for displaying user interface thereof | |
| US9098942B2 (en) | Legend indicator for selecting an active graph series | |
| US9304656B2 (en) | Systems and method for object selection on presence sensitive devices | |
| JP5854442B2 (en) | Handwriting input method to write multiple characters continuously | |
| US9501219B2 (en) | 2D line data cursor | |
| US9026924B2 (en) | Devices, systems, and methods for moving electronic windows between displays | |
| CN105573639A (en) | Triggered application display method and system | |
| WO2016025356A1 (en) | Hover-based interaction with rendered content | |
| US20180101298A1 (en) | Graph display apparatus, graph display method and storage medium | |
| US8542207B1 (en) | Pencil eraser gesture and gesture recognition method for touch-enabled user interfaces | |
| JP2013186540A (en) | Information processing apparatus and information processing method | |
| AU2015202763B2 (en) | Glove touch detection | |
| JP2017504877A (en) | Method and apparatus for click object enlargement based on floating touch | |
| CN105824496A (en) | Method for setting icon brightness based on use of users and mobile terminal | |
| US10282087B2 (en) | Multi-touch based drawing input method and apparatus | |
| US20140215393A1 (en) | Touch-based multiple selection | |
| CN104704462A (en) | Non-textual user input | |
| US20160162098A1 (en) | Method for providing user interface using multi-point touch and apparatus for same | |
| US20140267089A1 (en) | Geometric Shape Generation using Multi-Stage Gesture Recognition | |
| US10732719B2 (en) | Performing actions responsive to hovering over an input surface | |
| CN114391132A (en) | Electronic equipment and screen capturing method thereof | |
| CN104978135B (en) | A kind of icon display method, device and mobile terminal | |
| CN114201164A (en) | Magnetic attraction method and device for graphical programming module, electronic equipment and medium | |
| US10073612B1 (en) | Fixed cursor input interface for a computer aided design application executing on a touch screen 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 | ||
| RJ01 | Rejection of invention patent application after publication | ||
| RJ01 | Rejection of invention patent application after publication |
Application publication date: 20220318 |