Animation mixed display method and device, computer equipment and storage medium

Abstract

The embodiment of the invention discloses an animation mixed display method and device, computer equipment and a storage medium. According to the scheme, the two-dimensional animation to be displayed and the three-dimensional animation to be displayed are obtained; a user interface node tree is created, the user interface node tree comprises a plurality of levels of user interface nodes, the user interface nodes comprise a first user interface node corresponding to a two-dimensional animation and a second user interface node corresponding to a three-dimensional animation, then the two-dimensional animation is hooked to the first user interface node, and the two-dimensional animation is hooked to the second user interface node. Rendering the three-dimensional animation into a plurality of first animation images, and hooking the first animation images to a second user interface node; and finally, the two-dimensional animation is displayed through the first user interface node, and the multiple first animation images are displayed through the second user interface node, so that mixed overlapping display of the two-dimensional animation and the three-dimensional animation can be realized, and the animation performance effect is improved.

Description

TECHNICAL FIELD

[0001] The present application relates to the technical field of computers, in particular to an animation mixed display method and device, computer equipment and a computer readable storage medium. BACKGROUND

[0002] Spine is a 2D animation software specially designed for game development, which binds pictures to bones and controls the bones to realize animation. In the production of games, in order to realize perfect game expression effect, a series of game animations can be designed.

[0003] In the related art, Spine animations are usually produced by using Spine skeleton animation technology, and then the Spine animations are played in the game to show the game animation effect. However, the details of the characters on the 2D skeleton animation are not detailed enough, and the effect is poor. Or 3D animations are produced to show the game animation effect, but in some special scenes, the performance effect of 3D animations is poor. SUMMARY

[0004] The embodiments of the present application provide an animation mixed display method and device, computer equipment and a computer readable storage medium, which can improve the animation performance effect.

[0005] The embodiments of the present application provide an animation mixed display method, which comprises:

[0006] Obtaining a two-dimensional animation and a three-dimensional animation to be displayed;

[0007] Creating a user interface node tree, the user interface node tree comprising a plurality of hierarchical user interface nodes, the user interface nodes comprising a first user interface node corresponding to the two-dimensional animation and a second user interface node corresponding to the three-dimensional animation;

[0008] Hanging the two-dimensional animation to the first user interface node;

[0009] Rendering the three-dimensional animation into a plurality of first animation images and hanging the first animation images to the second user interface node;

[0010] Displaying the two-dimensional animation through the first user interface node and displaying the plurality of first animation images through the second user interface node.

[0011] Correspondingly, the embodiments of the present application also provide an animation mixed display device, which comprises:

[0012] An obtaining unit is configured to obtain a two-dimensional animation and a three-dimensional animation to be displayed;

[0013] The creating unit is configured to create a user interface node tree including a plurality of levels of user interface nodes, the user interface nodes including a first user interface node corresponding to the two-dimensional animation and a second user interface node corresponding to the three-dimensional animation.

[0014] The first hooking unit is configured to hook the two-dimensional animation to the first user interface node.

[0015] The second hooking unit is configured to render the three-dimensional animation into a plurality of first animation images and hook the first animation images to the second user interface node.

[0016] The displaying unit is configured to display the two-dimensional animation through the first user interface node and display the plurality of first animation images through the second user interface node.

[0017] Correspondingly, the embodiment of the present application further provides a computer device, including a memory, a processor and a computer program stored in the memory and executable on the processor, wherein the processor executes the animation mixed display method provided by any of the embodiments of the present application.

[0018] Correspondingly, the embodiment of the present application further provides a computer readable storage medium, the computer readable storage medium stores a plurality of instructions, the instructions are suitable for being loaded by a processor to execute the animation mixed display method as above.

[0019] The embodiment of the present application obtains a two-dimensional animation and a three-dimensional animation to be displayed, creates a user interface node tree including a plurality of levels of user interface nodes, the user interface nodes including a first user interface node corresponding to the two-dimensional animation and a second user interface node corresponding to the three-dimensional animation, hooks the two-dimensional animation to the first user interface node, renders the three-dimensional animation into a plurality of first animation images and hooks the first animation images to the second user interface node, and finally displays the two-dimensional animation through the first user interface node and displays the plurality of first animation images through the second user interface node, so that the mixed superimposed display of the two-dimensional animation and the three-dimensional animation can be realized, and the animation performance effect is improved. BRIEF DESCRIPTION OF DRAWINGS

[0020] In order to more clearly illustrate the technical solutions in the embodiments of the present application, the following will briefly introduce the drawings needed to be used in the embodiment description. Obviously, the drawings in the following description are only some embodiments of the present application, and other drawings can be obtained by those skilled in the art without creative labor.

[0021] Figure 1 A flowchart of an animation mixed display method provided by an embodiment of the present application.

[0022] Figure 2 An application scenario schematic diagram of an animation mixed display method provided by an embodiment of the present application.

[0023] Figure 3 An application scenario schematic diagram of another animation mixed display method provided by an embodiment of the present application.

[0024] Figure 4 An application scenario schematic diagram of another animation mixed display method provided by an embodiment of the present application.

[0025] Figure 5 An application scenario schematic diagram of another animation mixed display method provided by an embodiment of the present application.

[0026] Figure 6 A flow schematic diagram of another animation mixed display method provided by an embodiment of the present application.

[0027] Figure 7 An application scenario schematic diagram of another animation mixed display method provided by an embodiment of the present application.

[0028] Figure 8 An application scenario schematic diagram of another animation mixed display method provided by an embodiment of the present application.

[0029] Figure 9 A structure block diagram of an animation mixed display device provided by an embodiment of the present application.

[0030] Figure 10 A structure schematic diagram of a computer device provided by an embodiment of the present application. DETAILED DESCRIPTION

[0031] 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. Obviously, the described embodiments are only a part of the embodiments of the present application, rather than all the embodiments of the present application. Based on the embodiments in the present application, all the other embodiments obtained by those skilled in the art without creative work fall within the scope of the present application.

[0032] The embodiment of the present application provides a kind of animation mixed display method, device, computer readable storage medium and computer equipment.The specific animation mixed display method of the embodiment of the present application can be executed by computer equipment, wherein the computer equipment can be terminal or server and the like equipment.The terminal can be smart phone, tablet computer, notebook computer, touch screen, personal computer (PC, Personal Computer), personal digital assistant (Personal Digital Assistant, PDA) and the like terminal equipment.The server can be independent physical server, can also be the server cluster or distributed system of multiple physical servers, can also be cloud server of providing cloud service, cloud database, cloud computing, cloud function, cloud storage, network service, cloud communication, middleware service, domain name service, security service, CDN (Content Delivery Network, content distribution network), and basic cloud computing services such as big data and artificial intelligence platform.

[0033] For example, the computer equipment can be terminal, which can acquire two-dimensional animation and three-dimensional animation to be displayed;Create user interface node tree, and the user interface node tree includes multiple levels of user interface nodes, and the user interface node includes first user interface node corresponding to two-dimensional animation and second user interface node corresponding to three-dimensional animation;Two-dimensional animation is hung to first user interface node;Three-dimensional animation is rendered into multiple first animation images, and is hung to second user interface node;Two-dimensional animation is displayed through first user interface node, and multiple first animation images are displayed through second user interface node.

[0034] Based on the above problems, the first animation mixed display method, device, computer equipment and computer readable storage medium provided by the embodiment of the present application can improve the animation performance effect.

[0035] The following are described in detail respectively.It should be noted that the description order of the following embodiments is not limited as the preferred order of the embodiments.

[0036] The embodiment of the present application provides a kind of animation mixed display method, which can be executed by terminal or server, and the embodiment of the present application is described by taking the example that animation mixed display method is executed by terminal.

[0037] Please refer to Figure 1 , Figure 1 The flowchart of a kind of animation mixed display method provided by the embodiment of the present application is shown.The specific flow of the animation mixed display method can be as follows:

[0038] 101, acquire two-dimensional animation and three-dimensional animation to be displayed.

[0039] In the embodiments of the present application, the two-dimensional animation and the three-dimensional animation to be displayed refer to a plurality of animations which need to be superimposed and displayed on a graphical user interface to realize a specified animation effect.

[0040] The two-dimensional animation and the three-dimensional animation to be displayed can be pre-made.

[0041] The two-dimensional animation can include a plurality of types, for example, the two-dimensional animation can include a two-dimensional skeletal animation (also referred to as a 2D skeletal animation) and the like.

[0042] Specifically, the 2D skeletal animation is a technology for simulating the movement of living beings in a two-dimensional space, and is commonly used for making game character animations. Each 2D image (or part of an image) is bound to one or more “bones”, a process known as “skinning”. These bones can move and rotate, thus driving the movement of the image. By setting the position and rotation of the bones at different time points, a complex animation sequence can be created, a process also known as “keyframe animation”. Therefore, the 2D skeletal animation is to drive the movement of the image by changing the shape of the bone structure, thus simulating the movement of living beings in a two-dimensional space.

[0043] The 2D skeletal animation can be realized by the Spine animation technology, and Spine is a 2D skeletal animation software specially designed for game and software developers. It provides an efficient way to create animations, and the 2D skeletal animation generated by the Spine technology can be used in games or other applications.

[0044] Spine needs to create bones and joints, and then attach images (referred to as skins) to the bones. By moving and rotating the bones, complex animations can be created, and Spine also includes an event system. The event system of Spine allows animations to trigger responses of game code at specified times, so that the game does something at a specific time when Spine plays, such as playing a sound or generating a particle effect.

[0045] The 2D skeletal animation generated by Spine includes multiple animation files, including image files, atlas files, and exported binary or JSON files. The image files are images attached to the bones, usually in PNG format, and are typically organized in one or more directories. The atlas file is a file that describes how to pack multiple images into one or more textures. It is usually used with one or more PNG texture files that contain all the images described in the atlas. The exported binary or JSON file contains the key content of the Spine animation, including the overall animation information recorded in the skeleton, all bones defined in the bones (each bone contains information such as position and rotation), skin defines skin information, which contains the relationship between bones and pictures, so that bones can drive pictures to display and form animation, animations contain animation information, which defines the motion state of each bone at each time point. Through the current time point, the motion state of all bones at the current time can be calculated, and the corresponding animation picture can be displayed.

[0046] The three-dimensional animation can include various types, such as three-dimensional skeletal animation (also known as 3D skeletal animation) and three-dimensional special effect animation (also known as 3D special effect).

[0047] Specifically, 3D skeletal animation drives the movement of 3D models by simulating the skeletal structure of living beings. Simply put, each model has an internal "skeleton" that can move and rotate. The model's skin (which can be considered as the surface or skin in a colloquial sense) will move with the movement of the skeleton, and this process is called "skin binding". By setting the position and rotation of the skeleton at different time points, a complex animation sequence can be created, and this process is called "keyframe animation".

[0048] Specifically, 3D special effects are various technical means used in three-dimensional space to achieve various effects. They are visual effects created in three-dimensional space to enhance or simulate the visual experience of the real world. These special effects are commonly used in movies, television, video games, virtual reality, and augmented reality. 3D special effects can include various types of visual elements, such as particle systems (used to create fire, smoke, rain, snow, explosions, etc.), lighting and shadow effects, physical simulation (such as collision, gravity, fluid dynamics, etc.), surface texture and material, and animation, etc.

[0049] In some embodiments, the 3D special effect can include a 3D particle special effect, which is a technique for creating dynamic visual effects in three-dimensional space by generating, controlling, and rendering a large number of small particles to simulate various natural phenomena and abstract effects. In a 3D particle special effect, each particle is a small, independent object that has its own properties such as position, velocity, color, size, lifetime, etc. By changing these properties and applying various forces (such as gravity, wind, etc.) and constraints (such as collision, damping, etc.), various complex dynamic effects can be created. 3D particle special effects can be used to simulate various natural phenomena such as fire, smoke, rain, snow, water flow, sparks, explosions, etc. It can also be used to create various abstract effects such as halos, light rays, magic effects, energy fields, etc.

[0050] In some embodiments, the two-dimensional animation to be displayed can include multiple, the three-dimensional animation to be displayed can also include multiple, the specified animation effect to be implemented includes the superposition of multiple two-dimensional animations and multiple three-dimensional animations.

[0051] 102, create a user interface node tree.

[0052] The user interface node tree is a feature in the UI system, which is a tree structure that can be used to organize and manage UI elements (also known as UI nodes). In this tree structure, each UI element is a node, and each node can have a parent node and multiple child nodes. Each node in the UI node tree has different types of UI controls, which are generally 2D controls such as image controls, button controls, etc. The UI node tree has a hierarchical relationship, which determines the rendering order of the UI elements. In the case of the same position and size, the node with a higher level will cover the display of the node control with a lower level.

[0053] The UI system is a set of tools and frameworks specifically designed for creating, managing, and rendering game user interfaces (User Interface). It provides a series of components and services that make it easier for developers to create complex user interfaces.

[0054] In the embodiments of the present application, the user interface node tree can be created according to the two-dimensional animation and three-dimensional animation to be displayed, and the obtained user interface node tree can include multiple levels of user interface nodes (also known as UI nodes), and the multiple user interface nodes can include first user interface nodes corresponding to the two-dimensional animation and second user interface nodes corresponding to the three-dimensional animation.

[0055] The first user interface node is a user interface node for displaying animation images of a two-dimensional animation; the second user interface node is a user interface node for displaying animation images of a three-dimensional animation.

[0056] In some embodiments, to achieve mixed display of 2D animation and 3D animation, the step of "creating a user interface node tree" may include the following operations:

[0057] determining a first number of two-dimensional animations to be displayed, and a second number of three-dimensional animations to be displayed;

[0058] creating a first number of first user interface nodes and a second number of second user interface nodes;

[0059] A user interface node tree is constructed based on a first number of first user interface nodes and a second number of second user interface nodes.

[0060] The first number refers to the number of two-dimensional animations to be displayed, and the second number refers to the number of three-dimensional animations to be displayed.

[0061] Among them, creating a first number of first user interface nodes and creating a second number of second user interface nodes may include: creating a corresponding user interface node for each two-dimensional animation to obtain a first number of first user interface nodes, and creating a corresponding user interface node for each three-dimensional animation to obtain a second number of second user interface nodes.

[0062] For example, the two-dimensional animation to be displayed may include two-dimensional animation A and two-dimensional animation B; the three-dimensional animation to be displayed may include three-dimensional animation C and three-dimensional animation D. A first user interface node A corresponding to two-dimensional animation A, a first user interface node B corresponding to two-dimensional animation B, a second user interface node C corresponding to three-dimensional animation C, and a second user interface node D corresponding to two-dimensional animation C may be created, thereby obtaining the following multiple user interface nodes: first user interface node A, first user interface node B, second user interface node C, and second user interface node D.

[0063] Then, a node tree may be formed according to the created multiple user interface nodes to obtain a user interface node tree.

[0064] In some embodiments, to improve the effect of displaying multiple animations in a mixed and superimposed manner, the step of "building a user interface node tree based on a first number of first user interface nodes and a second number of second user interface nodes" may include the following operations:

[0065] Get the display level corresponding to each 2D animation and each 3D animation;

[0066] determining a depth level of each first user interface node and each second user interface node according to the display level;

[0067] The first user interface nodes and the second user interface nodes are arranged according to the depth level to obtain a user node tree.

[0068] The display level refers to a position level of the animation when the animation is displayed on the graphical user interface. The higher the display level of the animation, the higher the priority of the animation when the animation is displayed on the graphical user interface, that is, the animation can cover other animations of a lower display level.

[0069] For example, the display levels can include a first display level, a second display level, a third display level, and the like. The display priority of the first display level can be lower than the display priority of the second display level. The display priority of the second display level can be lower than the display priority of the third display level. That is, the third display level can cover the second display level, and the second display level can cover the first display level.

[0070] In the embodiments of the present application, the display levels of the two-dimensional animations and the three-dimensional animations to be displayed can be preset.

[0071] For example, the two-dimensional animations to be displayed can include a two-dimensional animation A and a two-dimensional animation B. The three-dimensional animations to be displayed can include a three-dimensional animation C and a three-dimensional animation D. The display level of the two-dimensional animation A can be set as the first display level. The display level of the three-dimensional animation C can be set as the second display level. The display level of the two-dimensional animation B can be set as the third display level. The display level of the three-dimensional animation D can be set as the fourth display level.

[0072] Therefore, according to the display priorities of the display levels on the graphical user interface, the three-dimensional animation D can cover the two-dimensional animation B, the two-dimensional animation B can cover the three-dimensional animation C, and the three-dimensional animation C can cover the two-dimensional animation A. That is, the distance between the user observation position and the display layer of the two-dimensional animation A is greater than the distance between the user observation position and the display layer of the three-dimensional animation C, the distance between the user observation position and the display layer of the three-dimensional animation C is greater than the distance between the user and the two-dimensional animation B, and the distance between the user and the two-dimensional animation B is greater than the distance between the user and the three-dimensional animation D.

[0073] For example, refer to Figure 2 , Figure 2 An application scenario diagram of the animation mixed display method provided in the embodiments of the present application. Figure 2The position relationship between each display layer and the user observation position is shown when multiple levels of animations are displayed by multiple display layers through a display screen. The multiple display layers include display layer L1, display layer L2, display layer L3, and display layer L4. Display layer L1 can be used to display two-dimensional animation A, display layer L2 can be used to display three-dimensional animation C, display layer L3 can be used to display two-dimensional animation B, and display layer L4 can be used to display three-dimensional animation D. The distance between the user observation position and display layer L4 is less than the distance between the user observation position and display layer L3, the distance between the user observation position and display layer L3 is less than the distance between the user observation position and display layer L2, and the distance between the user observation position and display layer L2 is less than the distance between the user observation position and display layer L1.

[0074] The depth level refers to the depth position of the user interface node in the graphical user interface. The higher the depth level of the user interface node, the higher the priority of the animation corresponding to the user interface node in the graphical user interface.

[0075] According to the display level, the depth level of each first user interface node and each second user interface node can be determined, which can include determining the depth level of the user interface node corresponding to each animation according to the display level of each animation.

[0076] For example, the two-dimensional animations to be displayed can include two-dimensional animation A and two-dimensional animation B, and the three-dimensional animations to be displayed can include three-dimensional animation C and three-dimensional animation D. Two-dimensional animation A corresponds to first user interface node A, three-dimensional animation C corresponds to second user interface node C, two-dimensional animation B corresponds to first user interface node B, and three-dimensional animation D corresponds to second user interface node D.

[0077] The display level of two-dimensional animation A can be a first display level, the display level of three-dimensional animation C can be a second display level, the display level of two-dimensional animation B can be a third display level, and the display level of three-dimensional animation D can be a fourth display level. According to the display level of each animation, the depth level of each graphical user interface node is determined, and the first user interface node A is determined to be a first depth level, the second user interface node C is determined to be a second depth level, the first user interface node B is determined to be a third depth level, and the second user interface node D is determined to be a fourth depth level. Thus, the depth level of each user interface node is obtained.

[0078] That is, the priority of displaying three-dimensional animation D through second user interface node D is higher than the priority of displaying two-dimensional animation B through first user interface node B, the priority of displaying two-dimensional animation B through first user interface node B is higher than the priority of displaying three-dimensional animation C through second user interface node C, and so on.

[0079] Further, the first user interface nodes and the second user interface nodes are arranged in a hierarchical manner according to the depth level of the user interface nodes, and a user node tree with multiple levels is obtained.

[0080] 103, attach the two-dimensional animation to the first user interface node.

[0081] In some embodiments, the two-dimensional animation can be a two-dimensional skeletal animation, and the two-dimensional skeletal animation can be directly loaded into the user interface node for display. Therefore, the step of "attaching the two-dimensional animation to the first user interface node" can include the following operations:

[0082] obtaining a base image of the two-dimensional skeletal animation and skeletal information corresponding to the base image;

[0083] adding the base image and the skeletal information to the first user interface node.

[0084] The base image refers to a basic two-dimensional image that needs to be controlled by a skeleton, for example, the base image can be an initial image of a game character.

[0085] The skeletal information refers to the information of the position and movement of the skeleton of the object in the base image at each frame. The skeletal information can be used to control the object in the base image to make corresponding actions at each frame.

[0086] Then, the base image and the skeletal information can be added to the first user interface node, so that the first user interface node generates each frame of image animation for display according to the base image and the skeletal information.

[0087] In some embodiments, the two-dimensional skeletal animation generated by Spine can be attached to the UI node according to the following steps: first, the Spine plug-in needs to be imported in Unity (game engine) to use the Spine animation, so the Spine plug-in can be downloaded in Unity, and then the two-dimensional skeletal animation generated by Spine in advance can be attached to the UI node in Unity. The two-dimensional skeletal animation can be attached to the UI node by selecting the Spine animation in the "Animator" property of the UI node.

[0088] 104, render the three-dimensional animation into a plurality of first animation images and attach the first animation images to the second user interface node.

[0089] In the embodiments of the present application, since the three-dimensional animation cannot be directly mounted to the UI node for display, the three-dimensional animation can be rendered into a two-dimensional image, and then the two-dimensional image can be mounted to the UI node for display, so as to realize the display of the three-dimensional animation effect.

[0090] The first animation image refers to a two-dimensional image generated according to each animation frame of the three-dimensional animation.

[0091] In some embodiments, the three-dimensional animation can include a three-dimensional special effect animation, and the step of rendering the three-dimensional animation into a plurality of first animation images and attaching to the second user interface node can include the following operations:

[0092] Collecting a special effect frame of the three-dimensional special effect animation;

[0093] Rendering the special effect frame into a two-dimensional image to obtain a first animation image.

[0094] The special effect frame refers to a frame corresponding to each animation frame of the three-dimensional special effect animation.

[0095] The rendering of the special effect frame into a two-dimensional image can use the RenderToTexture technology, also known as the rendering to texture technology, which is a common technology in 3D graphics technology. The 3D scene is rendered into a 2D texture (i.e., a RenderTarget), and then the texture is used for other rendering operations or displayed on the UI.

[0096] Specifically, in the rendering process, first, a Camera is created, and the view of the Camera is rendered to a 2D texture. This texture is like a "window" of the Camera, which captures all the content seen by the Camera. Then, the texture can be used as a material and applied to a UI element (such as a panel or a sprite), so that the view of the Camera can be displayed on the UI.

[0097] For example, for each special effect frame of the collected three-dimensional special effect animation, the RenderToTexture is used to render a corresponding two-dimensional image, thereby obtaining a plurality of first animation images corresponding to the three-dimensional special effect animation.

[0098] In some embodiments, the three-dimensional animation can include a three-dimensional skeletal animation, and the step of rendering the three-dimensional animation into a plurality of first animation images and attaching to the second user interface node can include the following operations:

[0099] Collecting an animation frame of the three-dimensional skeletal animation;

[0100] Rendering the animation frame into a two-dimensional image to obtain a first animation image.

[0101] The animation frame refers to a frame corresponding to each animation frame of the three-dimensional skeletal animation.

[0102] The rendering of the animation frame into a two-dimensional image can use the RenderToTexture technology.

[0103] For example, for each animation frame picture of the collected three-dimensional skeletal animation, a corresponding two-dimensional image is rendered by the RenderToTexture technology, so as to obtain a plurality of first animation images corresponding to the three-dimensional skeletal animation.

[0104] 105. display the two-dimensional animation through the first user interface node, and display the plurality of first animation images through the second user interface node.

[0105] In some embodiments, the two-dimensional animation can be a two-dimensional skeletal animation, and the step of "displaying the two-dimensional animation through the first user interface node" can include the following operations:

[0106] controlling the change of the base image according to the skeletal information to obtain a second animation image of the two-dimensional animation;

[0107] displaying the second animation image through the first user interface node.

[0108] In some embodiments, the step of "displaying the two-dimensional animation through the first user interface node, and displaying the plurality of first animation images through the second user interface node" can include the following operations in order to control the synchronous display of the two-dimensional animation and the three-dimensional animation:

[0109] In some embodiments, the step of "displaying the two-dimensional animation through the first user interface node, and displaying the plurality of first animation images through the second user interface node" can include the following operations in order to control the synchronous display of the two-dimensional animation and the three-dimensional animation:

[0110] obtaining a first playback time axis of the two-dimensional animation;

[0111] obtaining a second playback time axis corresponding to the three-dimensional animation;

[0112] based on the first playback time axis and the second playback time axis, sequentially displaying the second animation image and the first animation image corresponding to each time point through the first user interface node and the second user interface node, respectively.

[0113] The first playback time axis refers to a time axis for controlling the playback of each animation frame of the two-dimensional animation. The first playback time axis can include a plurality of time points and a second animation image of the two-dimensional animation played at each time point.

[0114] The second playback time axis refers to a time axis for controlling the playback of each animation frame of the three-dimensional skeletal animation. The second playback time can include a plurality of time points and a first animation image of the three-dimensional animation played at each time point.

[0115] The time points on the first playback timeline correspond to the time points on the second playback timeline one by one. That is, the time length of the first playback timeline is the same as the time length of the second playback timeline, and each time point on the first playback timeline has a corresponding time point on the second playback timeline.

[0116] For example, please participate Figure 3 , Figure 3 Another application scenario of the animation mixed display method provided in the embodiments of the present application is shown in the figure. The first playback timeline is the timeline of a two-dimensional animation, and the first playback timeline includes a plurality of time points, namely, time point 1, time point 2, time point 3, time point 4, time point 5, time point 6, time point 7, and time point 8. Time point 1 corresponds to the first animation frame of the two-dimensional animation, time point 2 corresponds to the second animation frame of the two-dimensional animation, and so on.

[0117] The second playback timeline is the timeline of a three-dimensional animation, and the second playback timeline includes a plurality of time points, namely, time point 1, time point 2, time point 3, time point 4, time point 5, time point 6, time point 7, and time point 8. Time point 1 corresponds to the first animation frame of the three-dimensional animation, time point 2 corresponds to the second animation frame of the two-dimensional animation, and so on.

[0118] The time points on the first playback timeline correspond to the time points on the second playback timeline one by one, that is, time point 1 on the first playback timeline corresponds to time point 1 on the second playback timeline, time point 2 on the first playback timeline corresponds to time point 2 on the second playback timeline, and so on. Then, when the time point is 1, the two-dimensional animation plays the first animation frame, and the three-dimensional animation also plays the first animation frame, which can realize the synchronous playback of the two-dimensional animation and the three-dimensional animation.

[0119] In some embodiments, after setting the playback timelines of the two-dimensional animation and the three-dimensional animation to be the same, the synchronous display of the two-dimensional animation and the three-dimensional animation can be controlled by inserting events in the two-dimensional animation.

[0120] The time points on the first playback timeline correspond to the time points on the second playback timeline one by one, that is, time point 1 on the first playback timeline corresponds to time point 1 on the second playback timeline, time point 2 on the first playback timeline corresponds to time point 2 on the second playback timeline, and so on. Then, when the time point is 1, the two-dimensional animation plays the first animation frame, and the three-dimensional animation also plays the first animation frame, which can realize the synchronous playback of the two-dimensional animation and the three-dimensional animation.

[0121] Table 1:

[0122] Event name Animation play time point (second) EVENT_1 2 EVENT_2 2.5 EVENT_3 3.3

[0123] In Table 1, the animation playing time points refer to the set occurrence time of each event, for example, in the process of playing the two-dimensional skeletal animation, when time point 2 is reached, EVENT_1 is executed, and when time point 2.5 is reached, EVENT_2 is executed. EVENT_1 indicates the animation frame corresponding to the two-dimensional skeletal animation playing time point 2 and the animation frame corresponding to the three-dimensional skeletal animation playing time point 2.

[0124] Based on the first playing timeline and the second playing timeline, the second animation image and the first animation image corresponding to each time point are displayed through the first user interface node and the second user interface node, respectively. The synchronization playing of the two-dimensional animation and the three-dimensional animation corresponding to the time points on the first playing timeline and the second playing timeline can be controlled in the manner of inserting events in the two-dimensional skeletal animation as described above.

[0125] For example, please continue to refer to Figure 3 In Figure 3 It is shown that at time point 1, the second animation image corresponding to the first animation frame of the two-dimensional skeletal animation is displayed through the first user interface node, and the first animation image corresponding to the first animation frame of the three-dimensional skeletal animation is displayed through the second user interface node. In this way, all second animation images of the two-dimensional skeletal animation are played through the first user interface node, and all first animation images of the three-dimensional skeletal animation are played through the second user interface node.

[0126] In some embodiments, the three-dimensional animation can include a three-dimensional special effect animation, and the display duration of the three-dimensional special effect animation can be different from the display duration of the two-dimensional skeletal animation. Then, the step of “displaying the two-dimensional animation through the first user interface node and displaying the plurality of first animation images through the second user interface node” can include the following operations:

[0127] Obtaining a first playing timeline of the two-dimensional animation;

[0128] Obtaining a third playing timeline corresponding to the three-dimensional special effect animation;

[0129] Based on the first playing timeline and the third playing timeline, the second animation image and / or the special effect animation image corresponding to each time point are displayed through the first user interface node and the second user interface node, respectively.

[0130] The first playing timeline includes a plurality of time points, and the second animation image of the two-dimensional animation played at each time point.

[0131] The third playing time axis refers to a time axis for controlling each animation frame of the three-dimensional special effect animation to play. The third playing time axis can include a plurality of time points, and each time point corresponds to a special effect animation image of the three-dimensional special effect animation played.

[0132] The time points of the third playing time axis correspond to part of the time points of the first playing time axis. That is, the time length of the first playing time axis is greater than the time length of the second playing time axis, and part of the time points on the first playing axis correspond to the time points of the second playing time axis.

[0133] For example, please participate Figure 4 , Figure 4 The application scenario of another animation mixed display method provided by the embodiment of the application is shown in the figure. The first playing time axis is a time axis of a two-dimensional animation, and the first playing time axis includes a plurality of time points, i.e., time point 1, time point 2, time point 3, time point 4, time point 5, time point 6, time point 7, and time point 8. The time point 1 corresponds to the first animation frame of the two-dimensional animation, the time point 2 corresponds to the second animation frame of the two-dimensional animation, and so on.

[0134] The third playing time axis is a time axis of a three-dimensional special effect animation, and the first playing time axis includes a plurality of time points, i.e., time point 1, time point 2, time point 3, time point 4, and time point 5. The time point 1 corresponds to the first animation frame of the three-dimensional special effect animation, the time point 2 corresponds to the second animation frame of the three-dimensional special effect animation, and so on.

[0135] The time point 3 on the first playing time axis corresponds to the time point 1 on the third playing time axis, the time point 4 on the first playing time axis corresponds to the time point 2 on the third playing time axis, and so on. That is, when the time point 3 on the first playing time axis of the two-dimensional animation corresponds to the animation frame, the time point 1 on the third playing time axis of the three-dimensional special effect animation is synchronously played. It is similar to inserting the playing of the three-dimensional special effect animation in the playing process of the two-dimensional animation.

[0136] In some embodiments, after setting part of the playing time axis of the two-dimensional animation to be the same as the playing time axis of the three-dimensional special effect animation, the three-dimensional animation inserted in the playing process of the two-dimensional animation can be controlled to be synchronously displayed by inserting an event in the two-dimensional animation.

[0137] The event mechanism of Spine is used to set appropriate events to play the three-dimensional special effect. Please refer to Table 2 as follows:

[0138] Table 2:

[0139]

[0140] In the table II, the animation playing time points refer to the occurrence time of each event. For example, EVENT_4 is used to control the playing of 3D special effects. When EVENT_4 is triggered, a particle special effect in a 3D scene is started, and then the RenderTexture technology is used to display the special effect in the game.

[0141] In some embodiments, the two-dimensional animation can include a two-dimensional skeletal animation, the three-dimensional animation can include a three-dimensional skeletal animation and a three-dimensional special effect animation, and the created user node tree can include a user interface node A corresponding to the two-dimensional skeletal animation, a user interface node B corresponding to the three-dimensional skeletal animation, and a user interface node C corresponding to the three-dimensional special effect animation. The method can further include the following steps:

[0142] obtaining a first playing time axis of the two-dimensional skeletal animation, a second playing time axis corresponding to the three-dimensional skeletal animation, and a third playing time axis corresponding to the three-dimensional special effect animation;

[0143] based on the first playing time axis, the second playing time axis, and the third playing time axis, sequentially displaying the two-dimensional skeletal animation image, the three-dimensional skeletal animation image, and / or the three-dimensional special effect animation image corresponding to each time point through the user interface node A, the user interface node B, and the user interface node C, respectively.

[0144] For example, please participate Figure 5 , Figure 5 Another application scenario of the animation mixed display method provided by the embodiments of the present application is shown in the figure. Figure 5 The first playing time axis corresponding to the two-dimensional skeletal animation, the second playing time axis corresponding to the three-dimensional skeletal animation, and the third playing time axis corresponding to the three-dimensional special effect animation are shown.

[0145] The time points on the first playing time axis correspond to the time points on the second playing axis one by one, and some time points on the first playing time axis correspond to the time points on the third playing time axis.

[0146] Then, when the animation mixed playback is performed, at the time point 1 of the first playback timeline, the first animation frame of the two-dimensional skeletal animation corresponds to the two-dimensional skeletal animation image displayed by the user interface node A, the first animation frame of the three-dimensional skeletal animation corresponds to the three-dimensional skeletal animation image displayed by the user interface node B, and so on. At the time point 3 of the first playback timeline, the third animation frame of the two-dimensional skeletal animation corresponds to the two-dimensional skeletal animation image displayed by the user interface node A, the third animation frame of the three-dimensional skeletal animation corresponds to the three-dimensional skeletal animation image displayed by the user interface node B, and the first animation frame of the three-dimensional special effect animation corresponds to the three-dimensional special effect animation image displayed by the user interface C, and so on. The animation images of the two-dimensional skeletal animation, the animation images of the three-dimensional skeletal animation, and the animation images of the three-dimensional special effect animation are synchronously played by the user interface node A, the user interface node B, and the user interface node C, respectively.

[0147] The embodiment of the present application discloses an animation mixed display method, which comprises: obtaining a two-dimensional animation and a three-dimensional animation to be displayed; creating a user interface node tree, the user interface node tree comprising a plurality of levels of user interface nodes, the user interface nodes comprising a first user interface node corresponding to the two-dimensional animation and a second user interface node corresponding to the three-dimensional animation; connecting the two-dimensional animation to the first user interface node; rendering the three-dimensional animation into a plurality of first animation images and connecting the first animation images to the second user interface node; displaying the two-dimensional animation through the first user interface node and displaying the plurality of first animation images through the second user interface node. Thus, the animation performance effect can be improved.

[0148] According to the above description, the animation mixed display method of the present application will be further illustrated by examples. Please refer to Figure 6 , Figure 6 The flowchart of another animation mixed display method provided by the embodiment of the present application is taken as an example, in which the animation mixed display method is applied to the login animation effect of a game login interface, and the specific process can be as follows:

[0149] 201. Obtain a plurality of animations required to realize the login animation effect.

[0150] In the embodiment of the present application, the plurality of animations required to realize the login animation effect can comprise a background animation, a character animation, a foreground animation, and a special effect animation. The login animation effect is realized by the superimposed display of the background animation, the character animation, the foreground animation, and the special effect animation.

[0151] The background animation, the character animation, the foreground animation, and the special effect animation are respectively pre-designed.

[0152] In some embodiments, the background animation can be used to show the effect of the background scene, the character animation can be used to show the movement effect of the virtual role, the foreground animation can be used to show the effect of the foreground scene, and the special effect animation can be used to show the special effect of the scene, such as the wind and sand effect.

[0153] For example, please refer to Figure 7 , Figure 7 Another application scenario diagram of the animation mixing display method provided by the embodiment of the present application is shown. Figure 7 The background animation, character animation, foreground animation and special effect animation required to realize the login animation effect are shown.

[0154] Among them, the background animation can be a two-dimensional skeletal animation type animation made by the spine technology; the character animation can be a three-dimensional skeletal animation type animation made by the 3D skeletal animation technology; the foreground animation can be a two-dimensional skeletal animation type animation made by the spine technology; and the special effect animation can be a three-dimensional special effect animation realized by the particle technology.

[0155] For example, the background animation can be used as the background of the game login interface, which can be played by the Spine animation control, and is a background that is always played in a loop, showing the continuous movement and scene change of the scene. From the perspective of the observer, the background is the content of the direction farthest from the observer.

[0156] In some embodiments, the character animation displays a plurality of 3D characters, which are always playing walking actions, but do not perform horizontal displacement, but are displaced by the background to form the effect of the characters advancing. Since the characters will climb or descend, the characters will perform vertical displacement to cooperate with the background to achieve the performance of the characters ascending or descending. From the perspective of the observer, the characters are closer to the observer than the background Spine.

[0157] In some embodiments, the foreground animation is played in a position in front of the characters from the perspective of the observer, which is closer to the observer. The foreground plays some stones, trees and other contents, which are located between the observer and the characters.

[0158] 202, create a corresponding user node tree according to the plurality of animations.

[0159] Among them, creating a corresponding user node tree according to the plurality of animations can include: first creating a user interface node corresponding to each animation according to the plurality of animations.

[0160] For example, a corresponding first user interface node A is created for the background animation, a corresponding second user interface node is created for the character animation, a corresponding first user interface node B is created for the foreground animation, and a corresponding third user interface node is created for the special effect animation.

[0161] Further, the depth levels of the user interface nodes can be set according to the display levels of the animations to form a user interface tree. The depth levels of the user interface nodes can be set according to the display levels of the animations, which can be referred to the description of the above embodiments and will not be described here in detail.

[0162] For example, the background animation needs to be displayed in the innermost layer of the display screen, the character animation needs to be displayed in the upper layer of the background animation, the foreground animation needs to be displayed in the upper layer of the character animation, and the special effect animation needs to be displayed in the upper layer of the foreground animation. It can be determined that the depth level of the third user interface node is greater than that of the first user interface node B, the depth level of the first user interface node B is greater than that of the second user interface node, and the depth level of the second user interface node is greater than that of the first user interface node A, that is, the display priority of the user interface nodes from high to low is: the third user interface node, the first user interface node B, the second user interface node, and the first user interface node A.

[0163] 203, the animations of the two-dimensional skeletal animation type in the plurality of animations are attached to the first user interface node of the user node tree.

[0164] The animations of the two-dimensional skeletal animation type in the plurality of animations can include the foreground animation and the background animation.

[0165] Specifically, the background animation is attached to the first user interface node A, and the foreground animation is attached to the second user interface node B.

[0166] 204, the animations of the three-dimensional skeletal animation type in the plurality of animations are rendered into a plurality of three-dimensional skeletal animation images, and the plurality of three-dimensional skeletal animation images are attached to the second user interface node of the user node tree.

[0167] The animations of the three-dimensional skeletal animation type in the plurality of animations can include the character animation.

[0168] Specifically, the character animation can be rendered into a two-dimensional image as a three-dimensional skeletal animation image through the RenderTexture technology, and then the three-dimensional skeletal animation image can be attached to the second user interface node.

[0169] 205、render the animations belonging to the three-dimensional special effect animation type in the plurality of animations as a plurality of three-dimensional special effect animation images, and attach the plurality of three-dimensional special effect animation images to the third user interface node of the user node tree.

[0170] The animations belonging to the three-dimensional special effect animation type in the plurality of animations can include special effect animations.

[0171] Specifically, the special effect animations can be rendered as two-dimensional images as the three-dimensional special effect animation images by using the RenderTexture technology, and then the three-dimensional special effect animation images can be attached to the third user interface node.

[0172] 206、display the two-dimensional bone animation through the first user interface node, display the three-dimensional bone animation through the second user interface node, and display the three-dimensional special effect animation through the third user interface node.

[0173] In the embodiments of the present application, when the superimposed display of the plurality of animations is performed, a timer can be used to display the animation frames of the background animation through the first user interface node A every frame; the latest frames of the character animation are constantly obtained every frame and rendered into 2D pictures, so that the 2D pictures of the character animation are displayed through the second user interface node; the animation frames of the foreground animation are displayed through the first user interface node B every frame; the latest frames of the special effect animation are constantly obtained every frame and rendered into 2D pictures, so that the 2D pictures of the special effect animation are displayed through the third user interface node. In this way, the mixed and synchronous display of the two-dimensional animation and the three-dimensional animation can be realized, so that the animation performance effect of the game login interface is improved.

[0174] For example, please refer to Figure 8 , Figure 8 The application scenario diagram of another animation mixed display method provided in the embodiments of the present application is shown. Figure 8 The display effect of the mixed and superimposed display of the background animation, the character animation, the foreground animation and the special effect animation is shown.

[0175] The embodiment of the application discloses an animation mixed display method, which comprises the following steps: obtaining a plurality of animations required for realizing a login animation effect; creating a corresponding user node tree according to the plurality of animations; hanging an animation of a two-dimensional skeleton animation type in the plurality of animations to a first user interface node of the user node tree; rendering an animation of a three-dimensional skeleton animation type in the plurality of animations into a plurality of three-dimensional skeleton animation images, and hanging the plurality of three-dimensional skeleton animation images to a second user interface node of the user node tree; rendering an animation of a three-dimensional special effect animation type in the plurality of animations into a plurality of three-dimensional special effect animation images, and hanging the plurality of three-dimensional special effect animation images to a third user interface node of the user node tree; displaying the two-dimensional skeleton animation through the first user interface node, displaying the three-dimensional skeleton animation through the second user interface node, and displaying the three-dimensional special effect animation through the third user interface node. In this way, the animation performance effect of a game login interface is improved.

[0176] In order to better implement the animation mixed display method provided by the embodiment of the application, the embodiment of the application further provides an animation mixed display device based on the above-mentioned animation mixed display method. The meanings of the terms are the same as those in the above-mentioned animation mixed display method, and the specific implementation details can be referred to the description in the method embodiment.

[0177] Please refer to Figure 9 , Figure 9 The structural block diagram of the animation mixed display device provided by the embodiment of the application comprises the following:

[0178] The obtaining unit 301 is configured to obtain a two-dimensional animation and a three-dimensional animation to be displayed.

[0179] The creating unit 302 is configured to create a user interface node tree, wherein the user interface node tree comprises a plurality of hierarchical user interface nodes, and the user interface nodes comprise a first user interface node corresponding to the two-dimensional animation and a second user interface node corresponding to the three-dimensional animation.

[0180] The first hanging unit 303 is configured to hang the two-dimensional animation to the first user interface node.

[0181] The second hanging unit 304 is configured to render the three-dimensional animation into a plurality of first animation images and hang the plurality of first animation images to the second user interface node.

[0182] The display unit 305 is configured to display the two-dimensional animation through the first user interface node and display the plurality of first animation images through the second user interface node.

[0183] In some embodiments, the display unit 305 can comprise:

[0184] The first obtaining sub-unit is configured to obtain a first playing timeline of the two-dimensional animation, the first playing timeline comprising a plurality of time points and a second animation image of the two-dimensional animation corresponding to each time point,

[0185] The second obtaining sub-unit is configured to obtain a second playing timeline corresponding to the three-dimensional animation, the second playing timeline comprising a plurality of time points and a first animation image of the three-dimensional animation corresponding to each time point, wherein the time points on the first playing timeline and the second playing timeline correspond to each other in one-to-one manner.

[0186] The first display sub-unit is configured to sequentially display the second animation image and the first animation image corresponding to each time point through the first user interface node and the second user interface node, respectively, based on the first playing timeline and the second playing timeline.

[0187] In some embodiments, the three-dimensional animation comprises a three-dimensional special effect animation; and the display unit 305 can comprise:

[0188] The third obtaining sub-unit is configured to obtain a first playing timeline of the two-dimensional animation, the first playing timeline comprising a plurality of time points and a second animation image of the two-dimensional animation corresponding to each time point;

[0189] The fourth obtaining sub-unit is configured to obtain a third playing timeline corresponding to the three-dimensional special effect animation, the third playing timeline comprising a plurality of time points and a special effect animation image of the three-dimensional special effect animation corresponding to each time point, wherein the time points on the third playing timeline correspond to part of the time points on the first playing timeline.

[0190] The second display sub-unit is configured to sequentially display the second animation image and / or the special effect animation image corresponding to each time point through the first user interface node and the second user interface node, respectively, based on the first playing timeline and the third playing timeline.

[0191] In some embodiments, the second hooking unit 304 can comprise:

[0192] The first collecting sub-unit is configured to collect a special effect picture of the three-dimensional special effect animation.

[0193] The first rendering unit is configured to render the special effect picture to a two-dimensional image to obtain the first animation image.

[0194] In some embodiments, the two-dimensional animation comprises a two-dimensional skeleton animation; and the first hooking unit 303 can comprise:

[0195] The fifth obtaining subunit is configured to obtain a base image of the two-dimensional skeletal animation and skeletal information corresponding to the base image.

[0196] The adding subunit is configured to add the base image and the skeletal information into the first user interface node.

[0197] In some embodiments, the display unit 305 can include:

[0198] The first determining subunit is configured to control the base image to change according to the skeletal information, to obtain a second animation image of the two-dimensional animation.

[0199] The third display subunit is configured to display the second animation image through the first user interface node.

[0200] In some embodiments, the three-dimensional animation includes a three-dimensional skeletal animation, and the second hooking unit 304 can include:

[0201] The second collecting subunit is configured to collect an animation frame picture of the three-dimensional skeletal animation.

[0202] The second rendering subunit is configured to render the animation frame picture to a two-dimensional image, to obtain the first animation image.

[0203] In some embodiments, the creating unit 302 can include:

[0204] The second determining subunit is configured to determine a first quantity of two-dimensional animations to be displayed and a second quantity of three-dimensional animations to be displayed.

[0205] The creating subunit is configured to create the first quantity of first user interface nodes and the second quantity of second user interface nodes.

[0206] The constructing subunit is configured to construct the user interface node tree based on the first quantity of first user interface nodes and the second quantity of second user interface nodes.

[0207] In some embodiments, the constructing subunit can be specifically configured to:

[0208] Obtain a display level corresponding to each two-dimensional animation and each three-dimensional animation respectively.

[0209] Determine a depth level of each first user interface node and each second user interface node according to the display level.

[0210] Arrange each first user interface node and each second user interface according to the depth level, to obtain the user node tree.

[0211] The embodiment of the present application discloses an animation mixed display device, a two-dimensional animation and a three-dimensional animation to be displayed are acquired by an acquisition unit 301; a user interface node tree is created by a creation unit 302, the user interface node tree comprises a plurality of hierarchical user interface nodes, the user interface nodes comprise a first user interface node corresponding to the two-dimensional animation and a second user interface node corresponding to the three-dimensional animation; a first hooking unit 303 hooks the two-dimensional animation to the first user interface node; a second hooking unit 304 renders the three-dimensional animation into a plurality of first animation images and hooks the first animation images to the second user interface node; and a display unit 305 displays the two-dimensional animation through the first user interface node and displays the plurality of first animation images through the second user interface node. In this way, the animation performance effect is improved.

[0212] Correspondingly, the embodiment of the present application also provides a computer device, which can be a terminal. Figure 10 As shown in the figure, Figure 10 The computer device provided by the embodiment of the present application is a structural diagram. The computer device 500 comprises a processor 501 having one or more processing cores, a memory 502 having one or more computer readable storage media, and a computer program stored in the memory 502 and executable on the processor. Wherein, the processor 501 is electrically connected with the memory 502. Those skilled in the art can understand that the computer device structure shown in the figure does not constitute a limitation on the computer device, and can include more or fewer components than the figure, or combine certain components, or different component arrangement.

[0213] The processor 501 is the control center of the computer device 500, which connects the whole computer device 500 through various interfaces and lines, executes various functions of the computer device 500 and processes data by running or loading the software program and / or module stored in the memory 502 and calling the data stored in the memory 502, so as to monitor the whole computer device 500.

[0214] In the embodiment of the present application, the processor 501 in the computer device 500 will load the instructions corresponding to the process of one or more application programs into the memory 502, and run the application program stored in the memory 502 by the processor 501, so as to realize various functions:

[0215] Acquire the two-dimensional animation and the three-dimensional animation to be displayed;

[0216] Create a user interface node tree, the user interface node tree comprises a plurality of hierarchical user interface nodes, the user interface nodes comprise a first user interface node corresponding to the two-dimensional animation and a second user interface node corresponding to the three-dimensional animation;

[0217] linking the two-dimensional animation to the first user interface node;

[0218] rendering the three-dimensional animation as a plurality of first animation images, and linking the first animation images to the second user interface node;

[0219] displaying the two-dimensional animation through the first user interface node, and displaying the plurality of first animation images through the second user interface node.

[0220] The embodiments of the present application obtain a two-dimensional animation and a three-dimensional animation to be displayed, create a user interface node tree including a plurality of hierarchical user interface nodes, the user interface nodes including a first user interface node corresponding to the two-dimensional animation and a second user interface node corresponding to the three-dimensional animation, link the two-dimensional animation to the first user interface node, and render the three-dimensional animation as a plurality of first animation images, and link the first animation images to the second user interface node. Finally, the two-dimensional animation is displayed through the first user interface node, and the plurality of first animation images are displayed through the second user interface node. In this way, the mixed and superimposed display of the two-dimensional animation and the three-dimensional animation can be realized, and the animation performance effect is improved.

[0221] The specific implementation of each operation can refer to the foregoing embodiments, which will not be described here.

[0222] Optionally, as shown in Figure 10 The computer device 500 further includes a touch display screen 503, a radio frequency circuit 504, an audio circuit 505, an input unit 506, and a power supply 507. The processor 501 is electrically connected with the touch display screen 503, the radio frequency circuit 504, the audio circuit 505, the input unit 506, and the power supply 507, respectively. Those skilled in the art can understand that the computer device structure shown in the Figure 10 The computer device structure shown in the

[0223] The touch display screen 503 can be used to display a graphical user interface and receive operation instructions generated by user acting on the graphical user interface. The touch display screen 503 can include a display panel and a touch panel. The display panel can be used to display information input by the user or provided to the user and various graphical user interfaces of the computer device, which can be composed of graphics, guidance information, icons, videos and any combination thereof. Optionally, the display panel can be configured in the form of a liquid crystal display (LCD), an organic light-emitting diode (OLED) or the like. The touch panel can be used to collect touch operations (such as operations of the user using a finger, a stylus or any suitable object or accessory on or near the touch panel) of the user thereon or therearound, and generate corresponding operation instructions, and the operation instructions execute corresponding programs. Optionally, the touch panel can include two parts of a touch detection device and a touch controller. The touch detection device detects the touch position of the user and detects signals generated by the touch operation, and transmits the signals to the touch controller; the touch controller receives the touch information from the touch detection device, and converts it into touch coordinates, and then sends it to the processor 501, and can also receive commands from the processor 501 and execute them. The touch panel can cover the display panel, and when the touch panel detects a touch operation thereon or therearound, it transmits to the processor 501 to determine the type of the touch event, and then the processor 501 provides corresponding visual output on the display panel according to the type of the touch event. In the embodiments of the present application, the touch panel and the display panel can be integrated into the touch display screen 503 to realize the input and output functions. However, in some embodiments, the touch panel and the touch panel can realize the input and output functions as two independent components. That is, the touch display screen 503 can also realize the input function as part of the input unit 506.

[0224] The radio frequency circuit 504 can be used to transceive radio frequency signals to establish wireless communication with network devices or other computer devices, and transceive signals between network devices or other computer devices.

[0225] The audio circuit 505 can be used to provide an audio interface between the user and the computer device through the speaker and the microphone. The audio circuit 505 can convert the received audio data into an electrical signal and transmit it to the speaker, which converts it into a sound signal output. On the other hand, the microphone collects sound signals and converts them into electrical signals, which are received by the audio circuit 505 and converted into audio data. After the audio data is output by the processor 501, it is processed by the radio frequency circuit 504 to send to another computer device, for example, or output to the memory 502 for further processing. The audio circuit 505 can also include an earphone jack to provide communication between an external earphone and the computer device.

[0226] The input unit 506 can be configured to receive inputted digital, character information or user feature information (e.g. fingerprint, iris, face information, etc.), and generate keyboard, mouse, joystick, optical or trackball signal input related to user placement and function control.

[0227] The power supply 507 is configured to supply power to various components of the computer device 500. Optionally, the power supply 507 can be logically connected to the processor 501 through a power management system, so as to realize functions such as management of charging, discharging and power consumption management through the power management system. The power supply 507 can also include one or more than one direct current or alternating current power supply, a recharging system, a power failure detection circuit, a power converter or inverter, a power status indicator, etc.

[0228] Although Figure 10 The computer device 500 can also include a camera, a sensor, a wireless fidelity module, a Bluetooth module, etc. which are not shown in the embodiments and will not be described herein.

[0229] In the above embodiments, the description of each embodiment is focused on different aspects, and the parts not described in detail in a certain embodiment can be referred to the related description of other embodiments.

[0230] As can be seen from the above, the computer device provided by the embodiments can acquire a two-dimensional animation and a three-dimensional animation to be displayed; create a user interface node tree, the user interface node tree including a plurality of hierarchical user interface nodes, the user interface nodes including a first user interface node corresponding to the two-dimensional animation and a second user interface node corresponding to the three-dimensional animation; attach the two-dimensional animation to the first user interface node; render the three-dimensional animation into a plurality of first animation images and attach the first animation images to the second user interface node; display the two-dimensional animation through the first user interface node, and display the plurality of first animation images through the second user interface node.

[0231] Those skilled in the art can understand that all or part of the steps of the various methods in the above embodiments can be completed by instructions, or by related hardware controlled by the instructions, the instructions can be stored in a computer readable storage medium and loaded and executed by a processor.

[0232] To this end, the embodiments of the present application provide a computer readable storage medium, which stores a plurality of computer programs, the computer programs can be loaded by a processor to execute the steps in any of the animation mixing display methods provided by the embodiments of the present application. For example, the computer programs can execute the following steps:

[0233] acquire a two-dimensional animation and a three-dimensional animation to be displayed;

[0234] create a user interface node tree, the user interface node tree including a plurality of levels of user interface nodes, the user interface nodes including a first user interface node corresponding to the two-dimensional animation and a second user interface node corresponding to the three-dimensional animation;

[0235] attach the two-dimensional animation to the first user interface node;

[0236] render the three-dimensional animation as a plurality of first animation images, attached to the second user interface node;

[0237] display the two-dimensional animation via the first user interface node and the plurality of first animation images via the second user interface node.

[0238] The embodiments of the present application can achieve the mixed and superimposed display of the two-dimensional animation and the three-dimensional animation, and improve the animation performance effect.

[0239] The specific implementation of each operation can refer to the foregoing embodiments, and will not be described here.

[0240] The computer readable storage medium can include a read only memory (ROM), a random access memory (RAM), a magnetic disk or an optical disk, etc.

[0241] The computer program stored in the computer readable storage medium can execute the steps of any one of the animation mixed display methods provided by the embodiments of the present application, and thus can achieve the beneficial effects of any one of the animation mixed display methods provided by the embodiments of the present application. Details are described in the foregoing embodiments, and will not be described here.

[0242] The above describes in detail the animation mixed display method, the device, the computer readable storage medium and the computer device provided by the embodiments of the present application. The specific examples are applied to describe the principles and implementation manners of the present application. The above embodiment is only used to help understand the method and the core idea of the present application. Meanwhile, for those skilled in the art, according to the idea of the present application, the specific implementation manner and the application range can be changed. The above description should not be understood as the limitation of the present application.

Claims

1. An animation mixing display method characterized by comprising: The method comprises: acquiring a two-dimensional animation and a three-dimensional animation to be displayed; creating a user interface node tree, the user interface node tree comprising a plurality of levels of user interface nodes, the user interface nodes comprising a first user interface node corresponding to the two-dimensional animation and a second user interface node corresponding to the three-dimensional animation; attaching the two-dimensional animation to the first user interface node; rendering the three-dimensional animation into a plurality of first animation images and attaching the first animation images to the second user interface node; displaying the two-dimensional animation through the first user interface node and displaying the plurality of first animation images through the second user interface node.

2. The method of claim 1, wherein, The displaying of the two-dimensional animation through the first user interface node and the displaying of the plurality of first animation images through the second user interface node comprises: acquiring a first playback timeline of the two-dimensional animation, the first playback timeline comprising a plurality of time points and a second animation image of the two-dimensional animation corresponding to each time point; acquiring a second playback timeline corresponding to the three-dimensional animation, the second playback timeline comprising a plurality of time points and a first animation image of the three-dimensional animation corresponding to each time point, wherein the time points on the first playback timeline and the second playback timeline correspond to each other one by one; based on the first playback timeline and the second playback timeline, sequentially displaying the second animation image and the first animation image corresponding to each time point through the first user interface node and the second user interface node respectively.

3. The method of claim 1, wherein, The three-dimensional animation comprises a three-dimensional special effect animation. The displaying of the two-dimensional animation through the first user interface node and the displaying of the plurality of first animation images through the second user interface node comprises: acquiring a first playback timeline of the two-dimensional animation, the first playback timeline comprising a plurality of time points and a second animation image of the two-dimensional animation corresponding to each time point; acquiring a third playback timeline corresponding to the three-dimensional special effect animation, the third playback timeline comprising a plurality of time points and a special effect animation image of the three-dimensional special effect animation corresponding to each time point, wherein the time points of the third playback timeline correspond to part of the time points of the first playback timeline; based on the first playback timeline and the third playback timeline, sequentially displaying the second animation image and / or the special effect animation image corresponding to each time point through the first user interface node and the second user interface node respectively.

4. The method of claim 3, wherein, The rendering of the three-dimensional animation into a plurality of first animation images and the attaching of the first animation images to the second user interface node comprises: collecting a special effect picture of the three-dimensional special effect animation; rendering the special effect picture into a two-dimensional image to obtain the first animation image.

5. The method of claim 1, wherein, The two-dimensional animation comprises a two-dimensional skeletal animation. The attaching of the two-dimensional animation to the first user interface node comprises: acquiring a base image of the two-dimensional skeletal animation and skeletal information corresponding to the base image; adding the base image and the skeletal information to the first user interface node.

6. The method of claim 5, wherein, The displaying of the two-dimensional animation through the first user interface node comprises: The base image is changed according to the skeleton information, and a second animation image of the two-dimensional animation is obtained; The second animation image is displayed through the first user interface node.

7. The method of claim 1, wherein, The three-dimensional animation includes a three-dimensional skeleton animation; The rendering of the three-dimensional animation into a plurality of first animation images and the hooking to the second user interface node include: An animation frame picture of the three-dimensional skeleton animation is collected; The animation frame picture is rendered into a two-dimensional image, and the first animation image is obtained.

8. The method of claim 1, wherein, The creation of the user interface node tree includes: A first quantity of two-dimensional animations to be displayed and a second quantity of three-dimensional animations to be displayed are determined; The first quantity of first user interface nodes and the second quantity of second user interface nodes are created; The user interface node tree is constructed based on the first quantity of first user interface nodes and the second quantity of second user interface nodes.

9. The method of claim 8, wherein, The construction of the user interface node tree based on the first quantity of first user interface nodes and the second quantity of second user interface nodes includes: Display levels corresponding to each two-dimensional animation and each three-dimensional animation are obtained; Depth levels of each first user interface node and each second user interface node are determined according to the display levels; The user node tree is obtained by arranging each first user interface node and each second user interface according to the depth levels.

10. An animation mixing display apparatus, characterized by comprising: The apparatus includes: An obtaining unit is configured to obtain two-dimensional animations and three-dimensional animations to be displayed; A creating unit is configured to create a user interface node tree, the user interface node tree including a plurality of levels of user interface nodes, the user interface nodes including first user interface nodes corresponding to the two-dimensional animations and second user interface nodes corresponding to the three-dimensional animations; A first hooking unit is configured to hook the two-dimensional animations to the first user interface nodes; A second hooking unit is configured to render the three-dimensional animations into a plurality of first animation images and hook the first animation images to the second user interface nodes; A display unit is configured to display the two-dimensional animations through the first user interface nodes and display the plurality of first animation images through the second user interface nodes.

11. A computer device comprising a memory, a processor and a computer program stored on the memory and running on the processor, wherein, The processor implements the animation mixed display method according to any one of claims 1 to 9 when executing the program.

12. A computer-readable storage medium, characterized in that, The computer readable storage medium stores a plurality of instructions adapted to be loaded by the processor to execute the animation mixed display method according to any one of claims 1 to 9.

Images