A method and system for generating a graphic rendering animation, a control device, and a storage medium
By using anchor point outlines to form rendering paths in the display layer and handwriting rendering layer, the distortion problem in the text graphic animation generation process is solved, achieving a smoother and more fluid animation effect.
Patent Information
- Application Number
- CN202210123343.1
- Authority / Receiving Office
- CN · China
- Patent Type
- Patents(China)
- Current Assignee / Owner
- Filing Date
- 2022-02-09
- Publication Date
- 2026-01-27
- Estimated Expiration
- 2042-02-09
AI Technical Summary
Existing methods for generating text and graphic animations are complex, and due to the irregular path of the text trajectory, the rendering of text and graphics is distorted, resulting in poor animation effects.
By establishing a display layer and a handwriting rendering layer, and using anchor point outlines to form a rendering path, the target graphic is rendered step by step, and the rendering process is recorded to generate an animation file, ensuring that the rendering path is consistent with the shape of the target graphic.
It improves the generation effect of text and graphic animations, and enhances the smoothness of the rendering path and the fluidity of the animation.
Smart Images

Figure CN114612590B_ABST
Abstract
Description
Technical Field
[0001] This invention relates to the field of computer technology, and in particular to a method and system for generating graphic rendering animations, a control device, and a storage medium. Background Technology
[0002] Existing methods for generating animations of text graphics are quite complex. Furthermore, due to the irregular trajectory of text, if the rendering is guided by the trajectory of the text, the text graphics may appear distorted during the rendering process, resulting in poor animation effects. Summary of the Invention
[0003] This invention aims to at least solve one of the technical problems existing in the prior art. To this end, this invention proposes a method and system for generating graphic rendering animations, a control device, and a storage medium to improve the generation effect of text and graphic animations.
[0004] A method for generating a graphic rendering animation according to a first aspect of the present invention includes: establishing a display layer and a handwriting rendering layer; acquiring a target graphic to the display layer; forming an anchor point outline of the target graphic on the display layer based on the target graphic; using the display layer as a mask for the handwriting rendering layer; the handwriting rendering layer defining at least one rendering path with the anchor point outline as a boundary; rendering the target graphic step by step according to the rendering path; and recording the rendering process of the handwriting rendering layer to form an animation file.
[0005] A method for generating a graphical rendering animation according to an embodiment of the present invention has at least the following beneficial effects:
[0006] The generation method of this invention first forms anchor point outlines based on the input target graphic, then uses the anchor point outlines on the display layer as a mask for the handwriting rendering layer, and then confirms the rendering path based on the anchor point outlines as boundaries, so that the rendering path is basically consistent with the shape of the target graphic, and then performs rendering and generates animation. This design can improve the smoothness of the generated target graphic and improve the generation effect of text graphic animation.
[0007] According to some embodiments of the present invention, the process of determining at least one rendering path in the handwriting rendering layer with the anchor point outline as the boundary includes: setting multiple rendering points within the anchor point outline along the extension direction of the target graphic; and connecting two adjacent rendering points among the multiple rendering points to obtain at least one rendering path.
[0008] According to some embodiments of the present invention, the stepwise rendering of the target graphic along the rendering path includes: determining the beginning and end of the rendering path according to a set rendering direction; determining a circumferential neighboring region for each first pixel point on the handwriting rendering layer, with each first pixel point on the rendering path as the center, wherein the circumferential neighboring region is a region range less than a first set spacing from the first pixel point; constraining the circumferential neighboring region according to the anchor point contour to form a rendering region corresponding to each first pixel point; and gradually coloring the uncolored second pixels in the rendering region corresponding to each first pixel point from the beginning to the end of the rendering path.
[0009] According to some embodiments of the present invention, the step of gradually coloring the uncolored second pixels within the rendering area corresponding to each first pixel includes: sequentially coloring the uncolored second pixels within the rendering area corresponding to each first pixel at a set time interval.
[0010] According to some embodiments of the present invention, constraining the circumferential adjacent region according to the anchor point contour to form a rendering region corresponding to each first pixel includes: determining whether any position of the circumferential adjacent region is within the anchor point contour; if not, deleting the circumferential adjacent region below the position outside the anchor point contour to form a rendering region.
[0011] According to some embodiments of the present invention, setting multiple rendering points within the anchor point contour along the extension direction of the target graphic includes: sequentially setting rendering points along the extension direction of the target graphic, and setting the next rendering point at a position within the anchor point contour at a second predetermined spacing from the previously set rendering point.
[0012] According to some embodiments of the present invention, the rendering process of the handwriting rendering layer is associated with a timeline to form an animation file.
[0013] A generation system according to a second aspect of the present invention includes: an input module for inputting a target graphic; and a processing module connected to the input module, wherein the processing module establishes a display layer and a handwriting rendering layer, the processing module acquires the target graphic into the display layer and forms anchor point outlines of the target graphic on the display layer based on the target graphic; the processing module uses the display layer as a mask for the handwriting rendering layer; the handwriting rendering layer confirms at least one rendering path with the anchor point outlines as boundaries; the processing module renders the target graphic step by step according to the rendering path; and the processing module records the rendering process of the handwriting rendering layer to form an animation file.
[0014] The generation system according to embodiments of the present invention has at least the following beneficial effects:
[0015] The generation system of this invention can improve the smoothness of the generated target graphics and enhance the generation effect of text and graphic animation.
[0016] A control device according to a third aspect of the present invention includes: one or more memories; one or more processors, configured to execute one or more computer programs stored in the one or more memories, and further configured to execute the method for generating graphics rendering animation disclosed in any of the above embodiments.
[0017] A computer-readable storage medium according to a fourth aspect of the present invention includes instructions that, when executed on a computer, cause the computer to perform the method for generating graphics rendering animation disclosed in any of the above embodiments.
[0018] Additional aspects and advantages of the invention will be set forth in part in the description which follows, and in part will be obvious from the description, or may be learned by practice of the invention. Attached Figure Description
[0019] The above and / or additional aspects and advantages of the present invention will become apparent and readily understood from the description of the embodiments taken in conjunction with the following drawings, in which:
[0020] Figure 1 This is a first flowchart of one embodiment of the generation method of the present invention;
[0021] Figure 2 This is a second flowchart of one embodiment of the generation method of the present invention;
[0022] Figure 3 This is a third flowchart of one embodiment of the generation method of the present invention;
[0023] Figure 4 This is a schematic diagram of the principle structure of one embodiment of the generation system of the present invention;
[0024] Figure 5 This is a schematic diagram of the control device of the present invention in one embodiment.
[0025] Figure label:
[0026] Input module 100, processing module 200, memory 300, processor 400. Detailed Implementation
[0027] Embodiments of the present invention are described in detail below. Examples of these embodiments are shown in the accompanying drawings, wherein the same or similar reference numerals denote the same or similar elements or elements having the same or similar functions throughout. The embodiments described below with reference to the accompanying drawings are exemplary and are only used to explain the present invention, and should not be construed as limiting the present invention.
[0028] In the description of this invention, it should be understood that the orientation descriptions, such as the terms "upper", "lower", "front", "rear", "left", "right", "vertical", "horizontal", "top", "bottom", "inner", and "outer", indicate the orientation or positional relationship based on the orientation or positional relationship shown in the accompanying drawings. They are only for the convenience of describing this invention and simplifying the description, and do not indicate or imply that the device or element referred to must have a specific orientation, or be constructed and operated in a specific orientation. Therefore, they should not be construed as limiting this invention.
[0029] In the description of this invention, "several" means one or more, "more than" means two or more, "greater than," "less than," and "exceeding" are understood to exclude the stated number, while "above," "below," and "within" are understood to include the stated number. The use of "first" and "second" in the description is merely for distinguishing technical features and should not be construed as indicating or implying relative importance, or implicitly indicating the number of indicated technical features, or implicitly indicating the order of the indicated technical features.
[0030] In the description of this invention, it should be noted that, unless otherwise explicitly specified and limited, the terms "installation," "connection," and "linking" should be interpreted broadly. For example, they can refer to a fixed connection, a detachable connection, or an integral connection; they can refer to a mechanical connection or an electrical connection; they can refer to a direct connection or an indirect connection through an intermediate medium; and they can refer to the internal connection of two components. Those skilled in the art can understand the specific meaning of the above terms in this invention based on the specific circumstances.
[0031] like Figure 1 As shown in Figure 3, a method for generating a graphics rendering animation according to a first aspect embodiment of the present invention includes:
[0032] S100, Establish the display layer and the handwriting rendering layer;
[0033] S200: Obtain the target graphic to the display layer, and form the anchor point outline of the target graphic on the display layer according to the target graphic;
[0034] S300, Use the display layer as a mask for the handwriting rendering layer;
[0035] S400, the handwriting rendering layer uses the anchor point outline as the boundary to confirm at least one rendering path;
[0036] S500: Render the target graphic step by step according to the rendering path;
[0037] S600 records the rendering process of the handwriting rendering layer to form an animation file.
[0038] Specifically, this can be achieved using Adobe Illustrator. Create a canvas in Adobe Illustrator, then create two layers: a presentation layer and a handwriting rendering layer. Place the handwriting rendering layer on top of the presentation layer, and export the generated AI file as an SVG file.
[0039] The generation method of this invention first forms anchor point outlines based on the input target graphic, then uses the anchor point outlines on the display layer as a mask for the handwriting rendering layer, and then confirms the rendering path based on the anchor point outlines as boundaries, so that the rendering path is basically consistent with the shape of the target graphic, and then performs rendering and generates animation. The anchor point outlines are on the display layer and will not have any impact on the display of the handwriting rendering layer. This design can improve the smoothness of the generated target graphic and improve the generation effect of text graphic animation.
[0040] In some embodiments of the present invention, such as Figure 2 As shown, in step S400, the handwriting rendering layer confirms at least one rendering path bounded by the anchor point outline, including:
[0041] S410. Set multiple rendering points within the anchor point outline along the extension direction of the target graphic.
[0042] S420. Connect two adjacent rendering points among multiple rendering points to obtain at least one rendering path.
[0043] It should be noted that after obtaining the target graphic, this system can identify the trend of the extension of the target graphic outline, and then randomly arrange multiple rendering points within the anchor point outline. The rendering path is obtained by connecting two adjacent rendering points. The rendering path is relatively smooth. Using the rendering path to guide the rendering process can make the rendering of the target graphic smoother and improve the animation presentation effect.
[0044] Specifically, there can be multiple rendering paths. For example, if you input the letter "a", you can split the letter "a" into two rendering paths: "c" and an inverted "L". If you input the letter "l", you can directly generate a single rendering path. Of course, you can also input letter strings such as "all". For letter strings such as "all", you can analyze different letters and then split them into different rendering paths.
[0045] In some embodiments of the present invention, such as Figure 3 As shown, step S500, rendering the target graphic step by step according to the rendering path, includes:
[0046] S510. Determine the beginning and end of the rendering path according to the set rendering direction.
[0047] S520. Determine the circumferential neighboring region of each first pixel point as the center of each first pixel point on the handwriting rendering layer of the rendering path, wherein the circumferential neighboring region is the area range that is less than a first set spacing away from the first pixel point.
[0048] S530 constrains the circumferential adjacent regions based on the anchor point contour to form a rendering region corresponding to each first pixel.
[0049] S540. From the beginning to the end of the rendering path, gradually color the uncolored second pixels within the rendering area corresponding to each first pixel.
[0050] It should be noted that the handwriting rendering layer is composed of an array of pixels. The rendering is guided by the rendering path. The first pixel is formed at the position where the rendering path overlaps with the handwriting rendering layer. During rendering, the second pixels around each first pixel are gradually colored together, thereby gradually coloring the area within the anchor point outline along the rendering path. This makes the rendering process orderly and improves the animation effect.
[0051] Specifically, the rendering direction can be set by the user, such as from the top of the handwriting rendering layer to the bottom of the handwriting rendering layer, or from the left side of the handwriting rendering layer to the right side of the handwriting rendering layer.
[0052] The first preset spacing can be set by the user, and is generally the width of the stroke within the anchor point outline. The circumferential adjacent area is equivalent to the area within the circumference obtained by taking the first pixel as the center and using the first preset spacing as the radius.
[0053] In some embodiments of the present invention, gradually coloring the uncolored second pixels in the rendering area corresponding to each first pixel includes: sequentially coloring the uncolored second pixels in the rendering area corresponding to each first pixel at a set time interval. Specifically, the set time interval can be set by the user, so that the rendering area is gradually colored at a constant gradient rate, thereby improving the animation effect of the rendering.
[0054] In some embodiments of the present invention, constraining the circumferential adjacent region according to the anchor point contour to form a rendering region corresponding to each first pixel includes: determining whether any position of the circumferential adjacent region is within the anchor point contour; if not, deleting the position of the circumferential adjacent region below the anchor point contour to form a rendering region.
[0055] After obtaining the circumferential neighboring region, the regions in the circumferential neighboring region that are not within the anchor point outline are deleted, and the remaining regions form the rendering region. This allows the rendering region to fill the region within the anchor point outline without exceeding it, making the strokes smoother and improving the animation rendering effect.
[0056] In some embodiments of the present invention, setting multiple rendering points within the anchor point contour along the extension direction of the target graphic includes: sequentially setting rendering points along the extension direction of the target graphic, and setting the next rendering point at a position within the anchor point contour at a second predetermined spacing from the previously set rendering point.
[0057] This system can make a basic determination of the extension direction of the target graphic. For the setting of multiple rendering points, an initial rendering point can be randomly set within the anchor point outline. The next rendering point is selected at intervals of the second set distance along the approximate extension direction. The position of the rendering point is then determined to see if it is within the anchor point outline. If it is, the rendering point is determined to be formed. If not, the position of the next rendering point relative to the previous rendering point is adjusted to form another rendering point. The system then checks whether the rendering point is within the anchor point outline again. This process is repeated until the next rendering point is located within the anchor point outline.
[0058] In some embodiments of the present invention, the rendering process of the handwriting rendering layer is associated with a timeline to form an animation file.
[0059] Specifically, by linking the rendering process with the timeline, users gain more control over the playback of animations, such as pausing playback, callbacks, and specifying playback positions, thereby optimizing the animation playback effect.
[0060] The generation system according to the second aspect of the present invention, such as Figure 4 As shown, it includes: an input module 100 for inputting a target graphic; and a processing module 200 connected to the input module 100. The processing module 200 establishes a display layer and a handwriting rendering layer. The processing module 200 acquires the target graphic into the display layer and forms the anchor point outline of the target graphic on the display layer based on the target graphic. The processing module 200 uses the display layer as a mask for the handwriting rendering layer. The handwriting rendering layer confirms at least one rendering path based on the anchor point outline. The processing module 200 renders the target graphic step by step according to the rendering path. The processing module 200 records the rendering process of the handwriting rendering layer to form an animation file.
[0061] The input module 100 can be composed of a touch screen or a mouse and display screen, while the processing module 200 can be composed of an MCU or CPU and auxiliary circuits.
[0062] The generation system of this invention can improve the smoothness of the generated target graphics and enhance the generation effect of text and graphic animation.
[0063] Control device according to a third aspect embodiment of the present invention, such as Figure 5As shown, it includes: one or more memories 300; one or more processors 400, for executing one or more computer programs stored in one or more memories 300, and also for executing the method for generating graphics rendering animations disclosed in any of the above embodiments.
[0064] It should be noted that the specific implementation process of this embodiment can be found in the specific implementation process of the above method embodiments, and will not be described again here.
[0065] A computer-readable storage medium according to a fourth aspect of the present invention includes instructions that, when executed on a computer, cause the computer to perform the method for generating graphics rendering animation disclosed in any of the above embodiments.
[0066] It should be noted that the specific implementation process of this embodiment can be found in the specific implementation process of the above method embodiments, and will not be described again here.
[0067] This application also discloses a computer program product, wherein when the computer program product is run on a computer, the computer performs some or all of the steps of the methods described in the above method embodiments.
[0068] Those skilled in the art will understand that all or part of the steps in the various methods of the above embodiments can be implemented by a program instructing related hardware. The program can be stored in a computer-readable storage medium, including a read-only memory (ROM), random access memory (RAM), programmable read-only memory (PROM), erasable programmable read-only memory (EPROM), one-time programmable read-only memory (OTPROM), electrically erasable programmable read-only memory (EEPROM), compact disc read-only memory (CD-ROM) or other optical disc storage 300, disk storage 300, magnetic tape storage 300, or any other computer-readable medium capable of carrying or storing data.
[0069] The technical features of the above embodiments can be combined in any way. For the sake of brevity, not all possible combinations of the technical features in the above embodiments are described. However, as long as there is no contradiction in the combination of these technical features, they should be considered to be within the scope of this specification.
[0070] Although embodiments of the invention have been shown and described, those skilled in the art will understand that various changes, modifications, substitutions and alterations can be made to these embodiments without departing from the principles and spirit of the invention, the scope of which is defined by the claims and their equivalents.
Claims
1. A method for generating graphical rendering animation, characterized in that, include: Establish a display layer and a handwriting rendering layer; Obtain the target graphic to the display layer, and form the anchor point outline of the target graphic on the display layer based on the target graphic; The display layer is used as a mask for the handwriting rendering layer; The handwriting rendering layer defines at least one rendering path based on the anchor point outline. Render the target graphic step by step according to the rendering path; Record the rendering process of the handwriting rendering layer to form an animation file; The handwriting rendering layer includes at least one rendering path defined by the anchor point outline, comprising: Multiple rendering points are randomly set within the anchor point outline along the extension direction of the target graphic; Connect two adjacent rendering points among multiple rendering points to obtain at least one rendering path; The step-by-step rendering of the target graphic according to the rendering path includes: The beginning and end of the rendering path are determined according to the set rendering direction. Each first pixel is formed at the overlapping position of the rendering path on the handwriting rendering layer; A circumferential neighboring region is determined for each first pixel as the center, wherein the circumferential neighboring region is the area range that is less than a first predetermined spacing from the first pixel; The circumferential adjacent region is constrained according to the anchor point contour to form a rendering region corresponding to each first pixel point; From the beginning to the end of the rendering path, the uncolored second pixels within the rendering area corresponding to each first pixel are gradually colored. The step of randomly setting multiple rendering points within the anchor point contour along the extension direction of the target graphic includes: Rendering points are sequentially set along the extension direction of the target graphic. The next rendering point is set at a position within the anchor point outline, at a second predetermined interval from the previous rendering point. That is, an initial rendering point is first randomly set within the anchor point outline. The next rendering point is selected at intervals of the second predetermined interval along the extension direction. The position of the rendering point is then determined to see if it is within the anchor point outline. If it is, the rendering point is determined to be formed. If not, the orientation of the next rendering point relative to the previous rendering point is adjusted to form another rendering point. The determination of whether the rendering point is within the anchor point outline is then repeated. This process is repeated in sequence.
2. The method for generating a graphics rendering animation according to claim 1, characterized in that, The stepwise coloring of the uncolored second pixels within the rendering area corresponding to each first pixel includes: At set time intervals, color the uncolored second pixels within the rendering area corresponding to each first pixel.
3. The method for generating a graphics rendering animation according to claim 1, characterized in that, The step of constraining the circumferential neighboring region according to the anchor point contour to form a rendering region corresponding to each first pixel includes: Determine whether any position of the circumferential adjacent region is within the anchor point outline. If not, delete the circumferential adjacent region below the position outside the anchor point outline to form a rendering area.
4. The method for generating a graphics rendering animation according to claim 1, characterized in that, The rendering process of the handwriting rendering layer is associated with the timeline to form an animation file.
5. A generation system for performing the method for generating graphical rendering animation as described in any one of claims 1 to 4, characterized in that, The generation system includes: The input module is used to input the target graphic. A processing module, connected to the input module, establishes a display layer and a handwriting rendering layer. The processing module acquires a target graphic into the display layer and forms the anchor point outline of the target graphic on the display layer based on the target graphic. The processing module uses the display layer as a mask for the handwriting rendering layer. The handwriting rendering layer confirms at least one rendering path using the anchor point outline as a boundary. The processing module renders the target graphic step by step according to the rendering path. The processing module records the rendering process of the handwriting rendering layer to form an animation file.
6. A control device, characterized in that, include: One or more memory units; One or more processors are configured to execute one or more computer programs stored in the one or more memories, and also to execute a method for generating a graphics rendering animation as described in any one of claims 1 to 4.
7. A computer-readable storage medium, characterized in that, Includes instructions that, when run on a computer, cause the computer to perform a method for generating a graphics rendering animation as described in any one of claims 1 to 4.
Citation Information
Patent Citations
A mask animation implementation method and apparatus based on an Android system
CN109242935A
Automated character stroke demonstration
TWI237800B