Method and apparatus for presenting animation in application, and device and medium

Abstract

Provided are a method and apparatus for presenting an animation in an application, and a device and a medium. The method comprises: acquiring the starting state of an animation, wherein the starting state comprises a first starting state of a first element in a first page in an application and a second starting state of a second element in a second page in the application, and the first element and the second element are movement elements in the animation; creating a virtual page in the application; adding a first copy of the first element and a second copy of the second element to the virtual page, wherein the first copy is set to be in the first starting state and the second copy is set to be in the second starting state; and presenting the first copy and the second copy in the virtual page on the basis of animation parameters of the animation, wherein the animation parameters specify the states of the movement elements between the starting state and the ending state.

Description

Methods, apparatuses, devices and media for presenting animations in applications

[0001] This application claims priority to the Chinese patent application No. 202410466047.0, filed on April 17, 2024, entitled “Methods, apparatuses, devices and media for presenting animations in applications”, the entire contents of which are incorporated herein by reference. TECHNICAL FIELD

[0002] Exemplary implementations of the present disclosure generally relate to the field of computers, and particularly relate to methods, apparatuses, devices and computer-readable storage media for presenting animations in applications. BACKGROUND

[0003] With the rapid development of computer technology, more and more applications provide various functions through animations. When creating animations, developers of the applications usually obtain a current view, provide a path and / or an interpolator of the animation to create a specified animation to complete various effects. This requires that the execution and display of the animation must be located on a view hierarchy (referred to as “hierarchy” for short) of a view page (referred to as “page” for short) in which the current view is located. However, an application usually includes multiple view pages, and it is difficult to present animations across multiple view hierarchies. SUMMARY

[0004] In a first aspect of the present disclosure, a method for presenting animations in an application is provided. The method includes obtaining a start state of an animation, the start state including a first start state of a first element in a first page in the application and a second start state of a second element in a second page in the application, the first element and the second element being moving elements in the animation; creating a virtual page in the application; adding a first copy of the first element and a second copy of the second element to the virtual page, the first copy being set to the first start state and the second copy being set to the second start state; and presenting the first copy and the second copy in the virtual page based on animation parameters of the animation, the animation parameters specifying states of the moving elements between the start state and an end state.

[0005] In a second aspect of the present disclosure, a device for presenting an animation in an application is provided. The device includes: a start state acquisition module configured to acquire a start state of the animation, the start state including a first start state of a first element in a first page of the application and a second start state of a second element in a second page of the application, the first element and the second element being motion elements in the animation; a virtual page creation module configured to create a virtual page in the application; a copy addition module configured to add a first copy of the first element and a second copy of the second element to the virtual page, the first copy being set to the first start state and the second copy being set to the second start state; and a copy presentation module configured to present the first copy and the second copy in the virtual page based on animation parameters of the animation, the animation parameters specifying states of the motion elements between the start state and the end state.

[0006] In a third aspect of the present disclosure, an electronic device is provided. The electronic device includes: at least one processing unit; and at least one memory, the at least one memory being coupled to the at least one processing unit and storing instructions for execution by the at least one processing unit, the instructions, when executed by the at least one processing unit, causing the electronic device to perform the method according to the first aspect of the present disclosure.

[0007] In a fourth aspect of the present disclosure, a computer-readable storage medium is provided, on which a computer program is stored. When the computer program is executed by a processor, the processor implements the method according to the first aspect of the present disclosure.

[0008] According to a fifth aspect of the present disclosure, a computer program product is provided, comprising a computer program, wherein when the computer program is executed by a processor, the method according to the first aspect of the present disclosure is implemented.

[0009] It should be understood that the content described in this summary section is not intended to limit the key features or important features of the implementation of the present disclosure, nor is it intended to limit the scope of the present disclosure. Other features of the present disclosure will become easy to understand through the following description. BRIEF DESCRIPTION OF THE DRAWINGS

[0010] The above and other features, advantages and aspects of various implementations of the present disclosure will become more apparent hereinafter with reference to the following detailed description in conjunction with the accompanying drawings. In the accompanying drawings, the same or similar reference numerals represent the same or similar elements, wherein:

[0011] FIG1 shows a schematic diagram of an example environment in which embodiments of the present disclosure can be implemented;

[0012] 2A to 2C are schematic diagrams showing examples of conventionally presenting animations in an application;

[0013] FIG. 3 shows a flowchart of a process for presenting an animation in an application, according to some embodiments of the present disclosure;

[0014] FIG. 4 shows a schematic diagram of an example of adding a copy in a virtual page, according to some embodiments of the present disclosure;

[0015] FIG. 5 shows a schematic diagram of an example of presenting an animation in an application, according to some embodiments of the present disclosure;

[0016] FIG. 6 shows a schematic diagram of an example, according to some embodiments of the present disclosure;

[0017] FIG. 7 shows a schematic diagram of an example, according to some other embodiments of the present disclosure;

[0018] FIG. 8 shows a schematic structural block diagram of an apparatus for presenting an animation in an application, according to some embodiments of the present disclosure; and

[0019] FIG. 9 shows a block diagram of an electronic device in which one or more embodiments of the present disclosure can be implemented. DETAILED DESCRIPTION

[0020] Embodiments of the present disclosure will be described in more detail with reference to the drawings. While certain embodiments of the present disclosure are shown in the drawings, it is understood that the present disclosure can be embodied in various forms and should not be interpreted as being limited to the embodiments set forth herein; rather, these embodiments are provided so that the present disclosure can be more thoroughly and completely understood. It will be appreciated that the drawings of the present disclosure are for illustrative purposes only and are not intended to limit the scope of the present disclosure.

[0021] In the description of embodiments of the present disclosure, the term "includes" and its derivatives, such as "including," should be understood in an open, inclusive sense, that is, "including, but not limited to." The term "based on" should be understood as "based at least in part on." The term "one embodiment" or "an embodiment" should be understood as "at least one embodiment." The term "some embodiments" should be understood as "at least some embodiments." The terms "a first," "a second," etc. can refer to different or identical objects. Other explicit or implicit definitions can also be included below.

[0022] In this document, unless explicitly stated otherwise, performing a step "in response to" an A does not mean that the step is performed immediately after A, but can include one or more intermediate steps.

[0023] It can be understood that the data involved in the technical solution (including but not limited to the data itself, the obtaining or use of the data) should comply with the requirements of the relevant laws and regulations and relevant provisions.

[0024] It can be understood that, before using the technical solutions disclosed in the embodiments of the present disclosure, the type of personal information involved in the present disclosure, the use range, the use scenario, etc. should be informed to the user and the authorization of the user should be obtained through appropriate means according to relevant laws and regulations.

[0025] For example, in response to receiving an active request of a user, prompt information is sent to the user to explicitly prompt the user that the operation requested to be performed will require obtaining and using personal information of the user, so that the user can voluntarily choose whether to provide personal information to the software or hardware such as an electronic device, an application, a server or a storage medium, etc. that performs the operation of the technical solutions of the present disclosure according to the prompt information.

[0026] As an optional but non-limiting implementation manner, in response to receiving an active request of a user, the manner of sending prompt information to the user may, for example, be a pop-up window manner, and the prompt information may be presented in the form of text in the pop-up window. In addition, the pop-up window may also carry selection controls for the user to select "agree" or "disagree" to provide personal information to the electronic device.

[0027] It can be understood that the above notification and user authorization process is only illustrative and does not limit the implementation manner of the present disclosure, and other manners meeting relevant laws and regulations can also be applied to the implementation manner of the present disclosure.

[0028] Example Environment

[0029] FIG. 1 shows a schematic diagram of an example environment 100 in which embodiments of the present disclosure can be implemented. In the example environment 100, a terminal device 110 has an application 120 installed therein. A user 140 can interact with the application 120 via the terminal device 110 and / or an attached device of the terminal device 110.

[0030] In some embodiments, the application 120 can be any appropriate application that can provide an animation presentation service. In the environment 100 of FIG. 1, if the application 120 is in an active state, the terminal device 110 can present a page 150 of the application 120. The page 150 can include various types of pages that can be provided by the application 120, such as a content presentation page, a content creation page, a content publishing page, a message page, a personal homepage, etc. in a content recommendation application.

[0031] In some embodiments, the terminal device 110 communicates with the server 130 to implement the provisioning of services for the application 120. The terminal device 110 can be any type of mobile terminal, fixed terminal, or portable terminal including a mobile handset, a tablet computer, a laptop computer, a notebook computer, a netbook computer, a tablet computer, a media computer, a multimedia tablet, a personal communication system (PCS) device, a personal navigation device, a personal digital assistant (PDA), an audio / video player, a digital camera / camcorder, a positioning device, a television receiver, a radio broadcast receiver, an electronic book device, a game device, or any combination thereof, including accessories and peripherals of these devices, or any combination thereof. In some embodiments, the terminal device 110 can also be capable of supporting any type of interface for user interaction (such as a "wearable" circuit, etc.). The server 130 can be various types of computing systems / servers capable of providing computing power, including but not limited to mainframes, edge computing nodes, computing devices in a cloud environment, etc.

[0032] It should be understood that the structure and functionality of the various elements in the environment 100 are described for illustrative purposes only and do not imply any limitation on the scope of the present disclosure.

[0033] In making / presenting an animation, the terminal device 110 often needs to obtain the position coordinates and view attributes corresponding to the start state and the end state of the animation, respectively. The position coordinates are relative to the overall screen of the terminal device 110, and the view attributes can include, for example, the size, rotation, transparency, etc. of the view. The terminal device 110 then needs to determine the trajectory of the animation. The user can employ different processing methods to determine the trajectory of different types of animations.

[0034] As mentioned previously, when creating an animation, the user often needs to obtain the current view, a given path of the animation, and an interpolator to create a specified animation to complete various effects. This requires that the execution and presentation of the animation must be located on the level of the current view, making it difficult to present the animation across different levels. In the context of the present disclosure, a level refers to a data structure used to organize and manage a page. An application can include one or more pages, each of which is displayed in a superimposed manner, and each page can have a unique identifier. For example, the identifier 0 can be used to represent a level located at the top layer, the identifier 1 can be used to represent a level located at the second layer, and so on.

[0035] Currently, there are techniques to present animations across levels, such as adjusting backgrounds of different levels to the same level and using a gradient animation to create an illusion. Note that the multiple levels can include any suitable number of levels, and in this document, the multiple levels can also be referred to as multiple pages. In addition, for ease of description, this document only exemplarily describes an example including two levels, and does not limit the number of the multiple levels.

[0036] The conventional scheme of presenting animations in an application is described below with reference to FIGS. 2A-2C, which show schematic diagrams of conventional examples (i.e., example 200A-200C) of presenting animations in an application. As shown in FIG. 2A, page 210 and page 220 can be two pages of different levels provided by an application (e.g., application 120). When operating an element in a specific page, information of elements in other pages cannot be obtained, and thus the element in page 210 cannot be moved from position 211 of page 210 to position 221 of page 220.

[0037] As shown in FIG. 2B, elements in different pages can be adjusted to the same page level, and in example 200B, page 210 and page 220 are adjusted to the same level. In this case, page 210 and page 220 at the same level can be regarded as belonging to the same page, and terminal device 110 can then present an animation of the element moving from position 211 to position 221 according to the conventional scheme of presenting animations in the same page. However, such a scheme requires modification of the underlying code of the application, which can cause code pollution.

[0038] As shown in FIG. 2C, an illusion can be created using a gradient animation, and in example 200C, terminal device 110 can present an animation of the element moving from position 211 to position 212 (the ending position of the element in page 210) in page 210 and an animation of the element moving from position 213 (the starting position of the element in page 220) to position 221 in page 220. That is, terminal device 110 can simulate an animation of the element moving from position 211 to position 221 by presenting different animations in the two pages. Although this can achieve animations of multiple-level pages, the presentation effect of the animations can have problems such as jitter.

[0039] Summary of presenting animations in an application

[0040] In view of this, embodiments of the present disclosure propose an improved solution for presenting an animation in an application. According to the solution, a start state of the animation is obtained, the start state including a first start state of a first element in a first page in the application and a second start state of a second element in a second page in the application, the first element and the second element being moving elements in the animation. A virtual page is created in the application. A first copy of the first element and a second copy of the second element are added to the virtual page, the first copy being set to the first start state and the second copy being set to the second start state. The first copy and the second copy are presented in the virtual page based on animation parameters of the animation, the animation parameters specifying states of the moving elements between the start state and an end state.

[0041] In this way, in embodiments of the present disclosure, by creating a virtual page and presenting the animation in the virtual page, it is possible to operate copies of different elements from different pages in a single virtual page at the same time. In this way, it is possible to present the animation in a simpler and more efficient manner, which helps to improve the presentation effect of the animation involving multiple pages. Various example implementations of the solution are described in further detail below in conjunction with the accompanying drawings.

[0042] Detailed process of presenting an animation

[0043] FIG. 3 shows a flowchart of a process 300 for presenting an animation in an application according to some embodiments of the present disclosure. The process 300 can be implemented at the terminal device 110. It is to be noted that the operations performed by the aforementioned terminal device 110 and the operations performed by the terminal device 110 described later can be performed by a relevant application (e.g., the application 120) installed on the terminal device 110. In some embodiments, the operations performed on the terminal device 110 can be completed with the assistance of the server 130. The process 300 is described below with reference to FIG. 1.

[0044] It is to be noted that in some embodiments, the terminal device 110 performs the process 300 in response to detecting that a first user operation in the application meets a predetermined condition. The predetermined condition can be a condition that is pre-set for triggering the presentation of the animation of multiple levels / pages. For ease of description, the process of presenting the animation is described by way of example only with respect to the image capturing process. Assume that the application includes two pages respectively located at two levels: a first page related to the capturing function, and a second page related to the album function. It is desired to present the following animation across the two pages: the image being captured in the first page shrinks to the area where the album control is located in the second page, and the album control in the second page appears to shake after receiving the image to prompt that the image is received. At this time, the terminal device 110 can capture the image via the camera in response to receiving the triggering operation of the user on the capturing control, and then start to perform the process 300 so as to display the animation of the image shrinking to the album control. The image and the capturing function can be at the first level / first page, and the album control can be at the second level / second page.

[0045] In some embodiments, the first page and the second page can be at different view levels. The page layout can be utilized to manage the hierarchical relationship between the various pages in the application. In this way, the animation can be presented across different levels in a simpler and more effective manner, thereby providing a more rich visual effect.

[0046] For another example, if the page presented by the application 120 includes a media item publishing page, the terminal device 110 can display the publishing process of the media item (e.g., which can include an image, audio, video, image set, text, etc.) in an animation in response to receiving the triggering operation of the user on the publishing control. For another example, if the page presented by the application 120 includes a media item presentation page, the terminal device 110 can display the addition of the media item to the favorites in an animation in response to receiving the sliding operation of the user on the media item. The media item can be at the first level / first page, and the favorites can be at the second level / second page.

[0047] At block 310, the terminal device 110 obtains a start state of the animation, the start state including a first start state of a first element in a first page in the application and a second start state of a second element in a second page in the application, the first element and the second element being motion elements in the animation. It can be understood that the application can include multiple pages corresponding to different levels, and the present disclosure is only exemplarily described with respect to the example of including two pages. Each page can include motion elements and non-motion elements, the motion elements can be elements in a motion state in the animation, and the non-motion elements can be elements in a static state in the animation. The first element and the second element can each include multiple elements.

[0048] The first element and the second element are both elements that will move in the animation. The first start state of the first element can include a position coordinate of the first element relative to the whole screen and a view attribute of the first element. The second start state of the second element can include a position coordinate of the second element relative to the whole screen and a view attribute of the second element.

[0049] At block 320, the terminal device 110 creates a virtual page in the application. Regarding the specific way of creating the virtual page, in some embodiments, the terminal device 110 can obtain a page layout of the application, which can indicate, for example, a hierarchical relationship between the first page and the second page. For example, the terminal device 110 can determine which of the first page and the second page corresponds to a higher level based on the page layout.

[0050] The page layout can be implemented using a tree structure, in which case the terminal device 110 can insert the virtual page at a root position (which can also be referred to as a root layout) in the page layout, which is at the topmost level in the page layout. Thus, the virtual page can be above all pages (including the first page and the second page) and be displayed on top of other pages. In some embodiments, the virtual page can be a transparent page, for example. After the transparent virtual page is displayed on top of all pages, the user can still browse the content of other pages below the virtual page.

[0051] In some embodiments, to improve the browsing effect of the virtual page, the terminal device 110 can also generate a background image of the virtual page based on the first page and the second page. For example, the terminal device 110 can obtain non-moving elements in the first page and the second page and generate a background image of the virtual page based on the non-moving elements. Thus, the background image in the virtual page can block the non-moving elements in other pages below the virtual page, which can improve the page effect of the virtual page.

[0052] At block 330, the terminal device 110 adds a first copy of the first element and a second copy of the second element to the virtual page, the first copy being set to the first start state and the second copy being set to the second start state.

[0053] Exemplarily, FIG. 4 shows a schematic diagram of an example 400 of adding copies in a virtual page according to some embodiments of the present disclosure. As shown in FIG. 4, a page 410 can be a page after superimposed rendering of a first page and a second page, where an element 412 is located in the first page and an element 414 is located in the second page, and the element 412 and the element 414 are moving elements in an animation. The terminal device 110 can add a copy 422 corresponding to the element 412 and a copy 424 corresponding to the element 414 to a virtual page 420. The element 412 and the copy 422 can correspond to the same element, i.e., the copy 422 can present the same content as the element 412. Similarly, the element 414 and the copy 424 can correspond to the same element, i.e., the copy 424 can present the same content as the element 414.

[0054] At a starting time point of the animation, the copy 422 is set to a first starting state, and the copy 424 is set to a second starting state. That is, the copy 422 and the element 412 have the same position coordinates and view attributes, and the copy 424 and the element 414 have the same position coordinates and view attributes.

[0055] At block 340, the terminal device 110 presents the first copy and the second copy in the virtual page based on animation parameters of the animation, the animation parameters specifying states of the moving element between the starting state and an ending state. Exemplarily, the animation parameters can specify a motion trajectory, a motion speed, etc. of the moving element.

[0056] Exemplarily, the animation can be presented based on a tweening animation mode. A user (e.g., a developer of the application) can set the starting and ending positions, and the terminal device 110 can automatically fill in the animation effects and trajectories in the middle without setting the effects of each frame. The tweening animation can support transformations of properties such as transparency, rotation, displacement, and inclination. For property animation, the user can create an animation of any property. The user needs to provide more animation information, e.g., the user can control the states of the animation through custom keyframes (e.g., determine the view effects of each frame according to the refresh frequency of the animation, determine the properties and positions of the views of each keyframe at each frame callback).

[0057] In some embodiments, the animation parameters can specify a change of a state of the first element and the second element. This state may, for example, include a position (which may, for example, indicate a trajectory of the element), an orientation, a size, a fade (which may, for example, indicate a transparency of the element), a velocity, an acceleration, a loop, and / or a delay of the first element and the second element. The terminal device 110 may, for example, determine respective intermediate states of the first copy and the second copy at respective time points in the animation based on the change of the state. Each intermediate state may, for example, indicate a position coordinate and a view attribute of the first copy and the second copy at the respective time point. The change of the state may, for example, be represented as a time-dependent function (e.g., a function f(t)). The terminal device 110 may, for example, determine the intermediate states of the first copy and the second copy at the respective time points in the animation directly based on this function. The user may, for example, adjust the animation effect by modifying this function. Thereby, the terminal device 110 can render a more rich animation effect based on the animation parameters which can specify the change of the state. In this way, the animation effect can be rendered in a simple and efficient way.

[0058] Alternatively or additionally, the animation can be rendered based on a keyframe animation mode. The animation effect at other time points can be generated by predefining keyframes and utilizing an interpolator and the keyframes. Specifically, the user can set a change rule of the attribute value from an initial value to an end value, such as uniform speed, acceleration / deceleration, etc., i.e., determine a mode of the change of the animation effect, such as uniform change, acceleration change, etc. The user can also configure basic attributes such as time, speed, loop, delay, fade, etc., i.e., determine the animation duration, the number of repetitions / repetition behavior of the animation, the refresh frequency of the animation, the resource set of the animation, etc.

[0059] In some embodiments, the animation parameters can specify keyframes of key time points in the animation, which may, for example, describe the state of the first element and the second element at the key time points. The terminal device 110 can also determine intermediate states of the first copy and the second copy at respective time points in the animation based on the keyframes. Illustratively, if the animation has a total duration of 4 seconds, the keyframes include 1, 2, 3 seconds, the start state specifies a 0-second keyframe, and the end state specifies a 4-second keyframe, the terminal device 110 can determine the intermediate states of the first copy and the second copy at respective time points in the animation based on the keyframes and an interpolator. After determining the intermediate states of the first copy and the second copy at respective time points in the animation, the terminal device 110 can render the first copy and the second copy at the respective time points based on the respective intermediate states, respectively. In this way, the animation including a more rich visual effect can be rendered.

[0060] In some embodiments, the terminal device 110 can also determine an ending state of the animation. The ending state can include a first ending state of the first element and a second ending state of the second element. Similar to the starting state, the first ending state of the first element can include a position coordinate of the first element relative to the whole screen and a view attribute of the first element. The second ending state of the second element can include a position coordinate of the second element relative to the whole screen and a view attribute of the second element. The terminal device 110 can set the first element in the first page to the first ending state and set the second element in the second page to the second ending state, respectively. The terminal device 110 can delete the virtual page in a case that the first copy has met the first ending state and the second copy has met the second ending state, i.e., the animation ends.

[0061] It should be appreciated that the virtual page is independent of other pages in the application and does not interfere with the normal functions of the other pages. The virtual page is only used for the purpose of presenting the animation and can be deleted after the complete animation process has been presented. Then, the operations of the other pages can be managed in the existing manner.

[0062] FIG. 5 shows a schematic diagram of an example 500 of presenting an animation in an application, according to some embodiments of the present disclosure. As shown in FIG. 5, in the example 500, the application can present a page 510 and a page 520, which can be presented in a superimposed manner. The page 510 includes an element 511 and the page 520 includes an element 521. The terminal device 110 can present an animation of a process including the element 511 moving to the element 521. The animation can also include, for example, a process of adjusting the display state (e.g., zooming, flashing, etc.) of the element 521 when the element 521 moves to the element 521.

[0063] To present the animation, the terminal device 110 can create a virtual page 530 and add a copy 531 corresponding to the element 511 and a copy 532 corresponding to the element 521 in the virtual page 530. The starting state of the copy 531 and the copy 532 is the same as the starting state of the element 511 and the element 521. The terminal device 110 can present the 531 and the 532 in the virtual page 530 based on the animation parameters of the animation. The virtual page 530 can be presented in a superimposed manner on the page 510 and the page 520. The terminal device 110 can determine the ending state of the copy 531 and the copy 532, respectively, and delete the virtual page 530 in a case that the copy 531 and the copy 532 meet the respective ending states. The terminal device 110 can continue to present the page 510 and the page 520 in a superimposed manner.

[0064] With respect to the animation parameters mentioned above, in some embodiments, the terminal device 110 can further set the animation parameters based on a second user operation in the application in response to detecting the second user operation. For example, FIG. 6 shows a schematic diagram of an example 600 according to some embodiments of the present disclosure. In the example 600, the terminal device 110 can present a page 610 and a page 620. The page 610 and the page 620 can each be a page presented on the screen after a plurality of pages are superimposed. The elements 601 and 603 in the page 610 and the page 620 can be two elements located in different pages, for example. The terminal device 110 can present an animation in response to receiving a triggering operation on the control 602 in the page 610, for example. The terminal device 110 can further present the element 621 in response to receiving a triggering operation of the element 601 in the page 620 (which can include a sliding operation, a moving operation, a rotating operation, etc.), for example. When the element 621 is presented, the terminal device 110 can present an animation in response to the triggering operation ending (e.g., the sliding operation stopping, the moving operation stopping, the rotating operation stopping, etc.).

[0065] When the page 620 is presented, the terminal device 110 can further set the animation parameters based on the triggering operation of the element 601 by the user, for example. For example, the terminal device 110 can set the animation parameters based on a rotation angle of the rotating operation (i.e., different rotation angles can correspond to different animation parameters), the terminal device 110 can set the animation parameters based on a distance corresponding to the sliding operation / moving operation (i.e., different distances can correspond to different animation parameters), etc. In this way, different animation effects are allowed to be presented via the interactive operation between the user and the terminal device 110, thereby improving the interactive effect between the user and the application.

[0066] Specifically, FIG. 7 shows a schematic diagram of an example 700 according to some other embodiments of the present disclosure. For a certain moving element in an animation, the terminal device 110 can determine a start state and an end state of the element. The start state can indicate a starting point 701 of the element, for example, and the end state can indicate an ending point 702 of the element, for example. The terminal device 110 can determine the animation parameters based on a rotation angle of the rotating operation in response to receiving the rotating operation of the element, for example. The correspondence between different rotation angles and different animation parameters can be pre-set. For example, the moving track of the element in the animation can be a symmetrical arc, and the key frame can be the middle position of the arc. Assuming that the distance between the starting point 701 and the ending point 702 is a / 2, and the inclination angle of the element (or the rotation angle of the element) is x, the position offset corresponding to the key frame (i.e., the distance between the middle position of the arc and the straight line connecting the starting point 701 and the ending point 702) is a / 2*tan x.

[0067] In some embodiments, the terminal device 110 can also present different animations based on the user's triggering operation on the element. For example, the terminal device 110 can present an animation of the element reverting to the starting position (i.e., the rotation angle is back to 0) when the rotation angle is in the first range (e.g., angle A, which is in the first range). The terminal device 110 can present an animation of the element moving from the starting point 701 to the ending point 702 when the rotation angle is in the second range (e.g., angle B, which is in the second range).

[0068] In summary, according to embodiments of the present disclosure, by creating a virtual page and presenting animations in the virtual page, it is possible to simultaneously operate copies of different elements from different pages in a single virtual page. In this way, animations can be presented in a simpler and more effective manner, which helps to improve the presentation effect of animations involving multiple pages.

[0069] Example apparatuses and devices

[0070] Embodiments of the present disclosure also provide corresponding apparatuses for implementing the above-mentioned methods or processes. FIG. 8 shows a schematic structural block diagram of an apparatus 800 for presenting animations in an application according to some embodiments of the present disclosure. The apparatus 800 can be included in the terminal device 110 in FIG. 1, for example. Various modules / components in the apparatus 800 can be implemented by hardware, software, firmware, or any combination thereof.

[0071] As shown, the apparatus 800 includes a starting state obtaining module 810 configured to obtain a starting state of an animation, the starting state including a first starting state of a first element in a first page in the application and a second starting state of a second element in a second page in the application, the first element and the second element being motion elements in the animation. The apparatus 800 also includes a virtual page creating module 820 configured to create a virtual page in the application. The apparatus 800 further includes a copy adding module 830 configured to add a first copy of the first element and a second copy of the second element to the virtual page, the first copy being set to the first starting state and the second copy being set to the second starting state. The apparatus 800 also includes a copy presenting module 840 configured to present the first copy and the second copy in the virtual page based on animation parameters of the animation, the animation parameters specifying states of the motion elements between the starting state and an ending state.

[0072] In some embodiments, the first page and the second page are in different view hierarchies.

[0073] In some embodiments, the virtual page creation module 820 includes: a page layout obtaining module configured to obtain a page layout of the application, the page layout indicating a hierarchical relationship between the first page and the second page; and a virtual page inserting module configured to insert the virtual page at a root position in the page layout.

[0074] In some embodiments, the virtual page is a transparent page, and the virtual page creation module 820 includes: a background image generating module configured to generate a background image of the virtual page based on the first page and the second page.

[0075] In some embodiments, the animation parameter specifies a change of a state of the first element and the second element, and the copy presenting module 840 includes: a first intermediate state determining module configured to determine respective intermediate states of the first copy and the second copy at respective time points in the animation based on the change of the state; and a first presenting module configured to present the first copy and the second copy based on the respective intermediate states at the respective time points, respectively.

[0076] In some embodiments, the animation parameter specifies key frames of key time points in the animation, the key frames describing states of the first element and the second element at the key time points, and the copy presenting module 840 includes: a second intermediate state determining module configured to determine intermediate states of the first copy and the second copy at respective time points in the animation based on the key frames, respectively; and a second presenting module configured to present the first copy and the second copy based on the respective intermediate states at the respective time points, respectively.

[0077] In some embodiments, the state includes at least any of the following of the first element and the second element: position, orientation, size, opacity, velocity, acceleration, looping, delay.

[0078] In some embodiments, the virtual page is overlaid on top of the first page and the second page.

[0079] In some embodiments, the apparatus 800 further includes: an end state determining module configured to determine an end state of the animation, the end state including a first end state of the first element and a second end state of the second element; an element setting module configured to set the first element to the first end state and the second element to the second end state, respectively; and a virtual page deleting module configured to delete the virtual page in response to determining that the first copy has met the first end state and the second copy has met the second end state.

[0080] In some embodiments, the apparatus 800 further includes: a method executing module configured to execute the method in response to detecting that the first user operation in the application meets a predetermined condition.

[0081] In some embodiments, the apparatus 800 further includes an animation parameter setting module configured to, in response to detecting the second user operation in the application, set an animation parameter based on the second user operation.

[0082] The units and / or modules included in the apparatus 800 can be implemented with various means including software, hardware, firmware, or any combination of these. In some embodiments, one or more units and / or modules can be implemented using software and / or firmware, e.g., machine-executable instructions stored on a storage medium. In addition to or alternatively, some or all of the units and / or modules in the apparatus 800 can be implemented at least partially by one or more hardware logic components. As an example and not by way of limitation, example types of hardware logic components include field-programmable gate arrays (FPGAs), application-specific integrated circuits (ASICs), application-specific standard products (ASSPs), system-on-a-chip (SOCs), complex programmable logic devices (CPLDs), etc.

[0083] It should be understood that one or more steps in the above methods can be performed by an appropriate electronic device or combination of electronic devices. Such an electronic device or combination of electronic devices may, for example, include the terminal device 110 in FIG. 1.

[0084] FIG. 9 shows a block diagram of an electronic device 900 in which one or more embodiments of the present disclosure can be implemented. It should be understood that the electronic device 900 illustrated in FIG. 9 is merely exemplary and should not be construed as limiting the functionality and scope of the embodiments described herein. The electronic device 900 illustrated in FIG. 9 can be used to implement the terminal device 110 of FIG. 1, and / or the apparatus 800 of FIG. 8.

[0085] As shown in FIG. 9, the electronic device 900 is in the form of a general electronic device. Components of the electronic device 900 can include, but are not limited to, one or more processors or processing units 910, a memory 920, a storage device 930, one or more communication units 940, one or more input devices 950, and one or more output devices 960. The processing unit 910 can be a real or virtual processor and is capable of performing various processing according to programs stored in the memory 920. In a multi-processor system, multiple processing units perform computer-executable instructions in parallel to improve the parallel processing capability of the electronic device 900.

[0086] The electronic device 900 typically includes a plurality of computer storage media. Such media can be any available media that is accessible by the electronic device 900 and includes both volatile and nonvolatile media, removable and non-removable media. The memory 920 can be volatile (such as register, cache, RAM), non-volatile (such as ROM, EEPROM, flash memory), or some combination of the two. The storage device 930 can be a removable or non-removable media, and can include machine-readable media, such as flash drives, magnetic disks, or any other media that can be used to store information and / or data and that can be accessed by the electronic device 900.

[0087] The electronic device 900 can further include additional removable / non-removable, volatile / non-volatile storage media. Although not shown in FIG. 9, a disk drive for reading from or writing to a removable, non- volatile magnetic disk (e.g., a "floppy disk"), and an optical disk drive for reading from or writing to a removable, non-volatile optical disk (e.g., a CD-ROM) can be provided. In such instances, each drive can be connected to the bus (not shown) by one or more data media interfaces. The memory 920 can include a computer program product 925 having one or more program modules configured to carry out the various methods or actions of the various embodiments of the present disclosure.

[0088] The communication unit 940 enables communication with other electronic devices over a communication medium. Additionally, the functionality of the components of the electronic device 900 can be implemented in a single computing cluster or a plurality of computer machines capable of communicating over a communication connection. As such, the electronic device 900 can operate in a networked environment using logical connections to one or more other servers, network personal computers (PCs), or another network nodes in the networking environment.

[0089] The input device 950 can be one or more input devices, such as a mouse, a keyboard, a trackball, etc. The output device 960 can be one or more output devices, such as a display, a speaker, a printer, etc. The electronic device 900 can also communicate with one or more external devices (not shown) such as a storage device, a display device, etc. through the communication unit 940, with one or more devices that enable a user to interact with the electronic device 900, or with any devices (e.g., a network card, a modem, etc.) that enable the electronic device 900 to communicate with one or more other electronic devices. Such communication can be enabled by an input / output (I / O) interface (not shown).

[0090] According to an example implementation of the present disclosure, a computer readable storage medium is provided having computer executable instructions stored thereon, where the computer executable instructions are executed by a processor to implement the method described above. According to an example implementation of the present disclosure, a computer program product is also provided that is tangibly stored on a non-transitory computer readable medium and includes computer executable instructions, where the computer executable instructions are executed by a processor to implement the method described above.

[0091] The computer readable program instructions can also be loaded onto a computer, other programmable data processing apparatus, or other device to cause a series of operational steps to be performed on the computer, other programmable apparatus or other device to produce a computer implemented process such that the instructions which execute on the computer or other programmable apparatus provide processes for implementing the functions / acts specified in the flowchart and / or block diagram block or blocks.

[0092] The computer readable program instructions can also be loaded onto a computer, other programmable data processing apparatus, or other device to cause a series of operational steps to be performed on the computer, other programmable apparatus or other device to produce a computer implemented process such that the instructions which execute on the computer or other programmable apparatus provide processes for implementing the functions / acts specified in the flowchart and / or block diagram block or blocks.

[0093] The computer readable program instructions can also be loaded onto a computer, other programmable data processing apparatus, or other device to cause a series of operational steps to be performed on the computer, other programmable apparatus or other device to produce a computer implemented process such that the instructions which execute on the computer or other programmable apparatus provide processes for implementing the functions / acts specified in the flowchart and / or block diagram block or blocks.

[0094] The computer program product of the present disclosure can have a signal including said computer program. This signal can be electronic, electromagnetic, optical, or any other suitable type of signal. Such a signal can be provided through a communication connection, such as electrical wiring, optical fiber, wireless interface, etc. Examples of computer program products include computer program implemented on a personal computer, server, or other networked device. A non-transitory computer readable medium, such as a floppy disk, CD-ROM, DVD-ROM, Blu-ray Disc, hard disk, or memory stick, can also be used to implement the present disclosure. The computer program product of the present disclosure can also be provided as a service to download and use the computer program over a network, such as the Internet.

[0095] Having described several implementations of the present disclosure, it will be clear to those skilled in the art that many modifications, additions, and substitutions are possible without departing from the scope and spirit of the described implementations. Many modifications and variations of the present disclosure are possible in light of the above teachings. It is, therefore, to be understood that within the scope of the appended claims, the present disclosure can be practiced otherwise than as specifically described. While the present disclosure has been described with reference to the implementation figures, it will be understood by those skilled in the art that various changes can be made and equivalents can be substituted for elements thereof without departing from the scope of the present disclosure. In addition, many modifications can be made to adapt a particular situation or material to the teachings of the disclosure without departing from its scope. Therefore, it is contemplated to cover any and all adaptations and modifications falling within the scope of the appended claims. It should also be noted that, in this document, the term "can" is used to mean various possible constructions, for example, a structure, device, or apparatus can be configured to perform one or more functions.

Claims

1. A method for presenting an animation in an application, comprising: obtaining a start state of the animation, the start state comprising a first start state of a first element in a first page in the application and a second start state of a second element in a second page in the application, the first and second elements being moving elements in the animation; creating a virtual page in the application; adding a first copy of the first element and a second copy of the second element into the virtual page, the first copy being set to the first start state and the second copy being set to the second start state; and presenting the first and second copies in the virtual page based on animation parameters of the animation, the animation parameters specifying states of the moving elements between the start state and an end state. the first page and the second page are at different view levels.

2. The method of claim 1, wherein, 3. The method of claim 1, wherein creating the virtual page comprises: obtaining a page layout of the application, the page layout indicating a view level relationship between the first page and the second page; and inserting the virtual page at a root position in the page layout. generating a background image of the virtual page based on the first and second pages.

5. The method of claim 1, wherein the animation parameters specify changes of states of the first and second elements, and presenting the first and second copies comprises:

4. The method of claim 1, wherein the virtual page is a transparent page, and creating the virtual page comprises: determining respective intermediate states of the first and second copies at respective time points in the animation based on the changes of the states, respectively; and presenting the first and second copies based on the respective intermediate states at the respective time points, respectively.

6. The method of claim 1, wherein the animation parameters specify key frames of key time points in the animation, the key frames describing states of the first and second elements at the key time points, and presenting the first and second copies comprises: determining intermediate states of the first and second copies at respective time points in the animation based on the key frames, respectively; and presenting the first and second copies based on the respective intermediate states at the respective time points, respectively.

7. The method of claim 5, wherein the states comprise at least any of the following of the first and second elements: position, orientation, size, opacity, velocity, acceleration, cycle, delay.

8. The method of claim 1, wherein the virtual page is presented overlaid on top of the first and second pages.

9. The method of claim 8, further comprising: determining an end state of the animation, the end state comprising a first end state of the first element and a second end state of the second element; setting the first element to the first end state and the second element to the second end state, respectively; and ​ ​ ​ ​ ​ in response to determining that the first copy has satisfied the first end state and the second copy has satisfied the second end state, deleting the virtual page.

10. The method of claim 1, further comprising: in response to detecting that a first user operation in the application satisfies a predetermined condition, performing the method.

11. The method of claim 10, further comprising: in response to detecting a second user operation in the application, setting the animation parameters based on the second user operation. 12.An apparatus for presenting an animation in an application, comprising: a start state obtaining module configured to obtain a start state of the animation, the start state comprising a first start state of a first element in a first page in the application and a second start state of a second element in a second page in the application, the first element and the second element being moving elements in the animation; a virtual page creating module configured to create a virtual page in the application; a copy adding module configured to add a first copy of the first element and a second copy of the second element to the virtual page, the first copy being set to the first start state and the second copy being set to the second start state; and a copy presenting module configured to present the first copy and the second copy in the virtual page based on animation parameters of the animation, the animation parameters specifying states of the moving elements between the start state and an end state. 13.An electronic device, comprising: at least one processing unit; and at least one memory coupled to the at least one processing unit and storing instructions for execution by the at least one processing unit, the instructions, when executed by the at least one processing unit, causing the electronic device to perform the method according to any one of claims 1-11. 14.A computer-readable storage medium having stored thereon a computer program, the computer program being executable by a processor to implement the method according to any one of claims 1-11. 15.A computer program product comprising a computer program, wherein the computer program, when executed by a processor, implements the method according to any one of claims 1-11.

Images