Animation effect display method and electronic equipment

Abstract

The invention discloses an animation effect display method and electronic equipment, the method is executed by the electronic equipment, in the method, after an animation trigger event is received, an application process of an application program determines first information according to description information of a first animation effect, and sends the first information to a rendering process; the animation trigger event is used for triggering display of a first animation effect, the first animation effect comprises M frames, the first information comprises description information of an Nth frame of the first animation effect and an image corresponding to at least one control in the Nth frame, M is a positive integer, and N is a positive integer smaller than or equal to M; and after first information from the application process is received, the rendering process generates display data of the Nth frame of the first animation effect according to the first information. As the rendering process does not need to re-draw the image corresponding to the at least one control in the Nth frame, the load of the rendering process is reduced, and the possibility of animation interface jamming is reduced.

Description

Technical Field

[0001] The present application relates to the field of electronic technology, and in particular to a method for displaying animation effects and an electronic device. Background Art

[0002] With the development of electronic technology, more and more electronic devices are involved in users' daily lives. In addition, as the resolution and size of electronic device screens become higher and higher, more and more content can be displayed on electronic devices.

[0003] An application can display animation effects to users by adjusting the values ​​of properties such as the size, position, and transparency of controls displayed on the interface.

[0004] When an application runs, it creates an application process, which includes the application's UI (user interface) thread. In the current animation framework, the application and rendering processes are separate. Before displaying an animation effect, the rendering process determines the property values ​​of the controls in each frame of the animation effect and renders the controls in that frame based on the property values ​​to generate a bitmap corresponding to that frame. Because the application's UI thread is not required to measure, lay out, or draw each frame, the display of the animation effect is not affected by a blocked application UI thread.

[0005] However, the rendering process suffers from redundant rendering when rendering controls in each frame based on the values ​​of the controls' properties. For example, compared to Control 1 in the first frame of an animation effect, only the position property value of Control 1 in the second frame of the animation effect has changed, while the values ​​of other properties remain unchanged. However, the rendering process still needs to redraw Control 1 when generating the bitmap corresponding to the second frame, which increases the rendering process load and causes the animation interface to freeze. Summary of the Invention

[0006] The embodiments of the present application provide a method for displaying animation effects and an electronic device to solve the problem of animation interface freeze.

[0007] In a first aspect, an embodiment of the present application provides a method for displaying animation effects, which is applicable to an electronic device or a component in the electronic device (such as a unit / module, circuit or chip, etc.). Taking the method applicable to an electronic device as an example, the method includes: after receiving an animation trigger event, the application process of the application determines the first information based on the description information of the first animation effect, and sends the first information to the rendering process; wherein, the animation trigger event is used to trigger the display of the first animation effect, the first animation effect includes M frames, the first information includes the description information of the Nth frame of the first animation effect and the image corresponding to at least one control in the Nth frame, M is a positive integer, and N is a positive integer less than or equal to M; after receiving the first information from the application process, the rendering process generates display data of the Nth frame of the first animation effect based on the first information.

[0008] In an embodiment of the present application, the description information of the Nth frame can be used to determine the properties of each control in the Nth frame, such as size, position, and transparency. The application process can determine the image corresponding to at least one control in the Nth frame based on the description information of the Nth frame, and the rendering process can directly use the image corresponding to the at least one control in the Nth frame when generating the display data of the Nth frame. Because the rendering process does not need to redraw the image corresponding to the at least one control in the Nth frame, the load on the rendering process is reduced, thereby reducing the possibility of animation interface lag.

[0009] In one possible implementation, the application process includes a UI thread of the application and a rendering client thread of the application, and the application process determines the first information based on the description information of the first animation effect, including: the UI thread determines the time corresponding to the start frame of the first animation effect, the time corresponding to the end frame of the first animation effect, and the description information of the end frame based on the description information of the first animation effect; when receiving the vertical synchronization signal corresponding to the Nth frame, the UI thread or the rendering client thread determines the description information of the Nth frame based on the time corresponding to the start frame, the time corresponding to the end frame, the description information of the end frame, and the time corresponding to the Nth frame; the rendering client thread determines the value of the first attribute of the at least one control based on the description information of the Nth frame, and determines the image corresponding to the at least one control based on the value of the first attribute of the at least one control.

[0010] In this implementation, the generation of the image corresponding to at least one control in the Nth frame can be performed by the rendering client thread. Since the UI thread does not need to generate the image corresponding to at least one control in the Nth frame, the load of the UI thread is reduced, thereby reducing the possibility of the animation interface being stuck. In addition, determining the description information of the Nth frame can be performed by the UI thread or by the rendering client thread. Among them, when determining that the description information of the Nth frame is executed by the rendering client thread, the load of the UI thread can be further reduced, thereby reducing the possibility of the animation interface being stuck.

[0011] In one possible implementation, the method further includes: when N is equal to 1, the at least one control is a control among all controls in the Nth frame; or, when N is greater than or equal to 2, the at least one control is a control in the Nth frame whose value of the first attribute changes compared to the N-1th frame of the first animation effect, and / or, a control newly added to the Nth frame compared to the N-1th frame.

[0012] In this implementation, for the first frame of the first animation effect, the rendering client thread needs to generate images corresponding to all controls in the first frame. For frames after the first frame of the first animation effect, the rendering client thread can compare the controls in the frame with the controls in the frame before the frame to determine the controls whose first attribute values ​​have changed and / or newly added controls. The rendering client thread only needs to generate images corresponding to the controls whose first attribute values ​​have changed and / or newly added controls in the frame. That is, for controls whose first attribute values ​​have not changed, the rendering client thread does not need to generate images corresponding to the controls, thereby reducing the load on the rendering client thread and thus reducing the possibility of animation interface freezes.

[0013] In a possible implementation, the first attribute includes an attribute related to content carried by the control; and / or the first attribute includes an attribute related to the appearance of the control.

[0014] In this implementation, the first attribute may include one or more attributes. When the first attribute includes multiple attributes, such as attributes related to the content carried by the control and attributes related to the appearance of the control, the workload of the rendering process in generating display data corresponding to at least one control in the Nth frame can be further reduced, thereby reducing the load of the rendering process and thus reducing the possibility of animation interface freezes. In addition, the first attribute may also include other attributes.

[0015] In one possible implementation, the rendering process generates display data for the Nth frame of the first animation effect based on the first information, including: the rendering process determines, based on description information of the Nth frame, a value of a second attribute for each control in the Nth frame; wherein the second attribute includes an attribute related to content carried on the control, an attribute related to the appearance of the control, an attribute related to the position of the control, and an attribute related to the size of the control; the rendering process updates a first rendering tree based on the value of the second attribute of each control; wherein the updated first rendering tree includes a first rendering node and a second rendering node, the first rendering node corresponding to a first type of image, and the second rendering node corresponding to a second type of image, the second type of image being an image corresponding to a control in the Nth frame whose value of the first attribute has not changed compared to the N-1th frame of the first animation effect, the first type of image being an image corresponding to a control in the Nth frame whose value of the first attribute has changed compared to the N-1th frame, and / or an image corresponding to a control newly added in the Nth frame compared to the N-1th frame; the rendering process pasting the first type of image at the location of the first rendering node and pasting the second type of image at the location of the second rendering node to generate display data for the Nth frame of the first animation effect.

[0016] In this implementation, for controls whose first attribute values ​​have changed in the Nth frame compared to the N-1th frame, and / or for controls that have been newly added in the Nth frame compared to the N-1th frame, the rendering process has re-received the image corresponding to the control (i.e., the first type of image), and the rendering process can paste the re-received image corresponding to the control to the position of the control; for controls whose first attribute values ​​have not changed in the Nth frame compared to the N-1th frame, the rendering process has not re-received the image corresponding to the control (i.e., the second type of image), so the rendering process can paste the previously received image corresponding to the same control in the N-1th frame to the position of the control. Since the rendering process does not need to redraw the image corresponding to each control in the Nth frame, the rendering process load is reduced, thereby solving the problem of animation interface freezes caused by high rendering process load.

[0017] In one possible implementation, the second attribute includes an attribute related to the position of the control, and the rendering process updates the first rendering tree according to the value of the second attribute of each control, including: the rendering process updates the position of the rendering node in the first rendering tree according to the value of the attribute related to the position of each control.

[0018] In this implementation, the rendering process can update the position of the rendering node corresponding to the control in the first rendering tree according to the value of the position attribute of the control in the Nth frame, so that the position of the rendering node in the first rendering tree is the position of the control in the Nth frame, so as to generate display data for the Nth frame and improve rendering efficiency.

[0019] In one possible implementation, the method further includes: after not receiving the first information from the application process, the rendering process generates display data of the Nth frame of the first animation effect based on the description information of the N-1th frame of the first animation effect and the image corresponding to at least one control in the N-1th frame; or, after receiving the description information of the Nth frame from the application process and not receiving the image corresponding to at least one control in the Nth frame from the application process, the rendering process generates display data of the Nth frame of the first animation effect based on the description information of the Nth frame and the image corresponding to at least one control in the N-1th frame of the first animation effect; or, after receiving the image corresponding to at least one control in the Nth frame from the application process and not receiving the description information of the Nth frame from the application process, the rendering process generates display data of the Nth frame of the first animation effect based on the description information of the N-1th frame of the first animation effect and the image corresponding to at least one control in the N frame.

[0020] In this implementation, if the rendering process does not receive the description information of frame N and / or the image corresponding to at least one control in frame N, the rendering process can reuse the description information of frame N-1 and / or the image corresponding to each control in frame N-1 to generate display data for frame N. Because the rendering process does not need to wait for a long time to receive the description information of frame N and the image corresponding to at least one control in frame N, the possibility of animation interface freezes is reduced.

[0021] In one possible implementation, the rendering process generates display data for the Nth frame of the first animation effect based on the description information of the N-1th frame of the first animation effect and the image corresponding to at least one control in the N-1th frame, including: the rendering process determines the value of the second attribute of each control in the Nth frame based on the description information of the N-1th frame; wherein the second attribute includes attributes related to the content carried on the control, attributes related to the appearance of the control, attributes related to the position of the control, and attributes related to the size of the control; the rendering process updates the first rendering tree according to the value of the second attribute of each control; wherein the updated first rendering tree includes a third rendering node, the third rendering node corresponds to a third type of image, and the third type of image is an image corresponding to at least one control in the N-1th frame; the rendering process pastes the third type of image at the position of the third rendering node to generate display data for the Nth frame of the first animation effect.

[0022] In this implementation, if the rendering process does not receive the description information of the Nth frame and the image corresponding to at least one control in the Nth frame, then for each control in the Nth frame, the rendering process can determine the value of the second attribute (such as position, size, transparency, etc.) of the control that is identical to the control in the N-1th frame based on the description information of the N-1th frame, and determine the value of the second attribute of the control that is identical to the control in the N-1th frame as the value of the second attribute corresponding to the control (that is, the second attribute remains unchanged). Since the rendering process has not received the image corresponding to the control again, the rendering process can paste the image corresponding to the control that is identical to the control in the N-1th frame previously received to the position of the control. Since the rendering process does not need to redraw the image corresponding to each control in the Nth frame, the rendering process load is reduced, thereby solving the problem of animation interface freezes caused by high rendering process load.

[0023] In one possible implementation, the rendering process generates display data for the Nth frame of the first animation effect based on the description information of the Nth frame and the image corresponding to at least one control in the N-1th frame of the first animation effect, including: the rendering process determines the value of the second attribute of each control in the Nth frame based on the description information of the Nth frame; wherein the second attribute includes attributes related to the content carried by the control, attributes related to the appearance of the control, attributes related to the position of the control, and attributes related to the size of the control; the rendering process updates the first rendering tree based on the value of the second attribute of each control; wherein the updated first rendering tree includes a third rendering node, the third rendering node corresponds to a third type of image, and the third type of image is an image corresponding to at least one control in the N-1th frame; the rendering process pastes the third type of image at the position of the third rendering node to generate display data for the Nth frame of the first animation effect.

[0024] In this implementation, if the rendering process receives the description information of the Nth frame but does not receive the image corresponding to at least one control in the Nth frame, then for each control in the Nth frame, the rendering process can determine the value of the second attribute of the control (such as position, size, transparency, etc.) based on the description information of the Nth frame. However, since the rendering process has not received the image corresponding to the control again, the rendering process can paste the image corresponding to the control that is identical to the control in the N-1th frame previously received to the position of the control. Since the rendering process does not need to redraw the image corresponding to each control in the Nth frame, the rendering process load is reduced, thereby solving the problem of animation interface lag caused by high rendering process load.

[0025] In a possible implementation, the rendering process generates display data for the Nth frame of the first animation effect based on the description information of the N-1th frame of the first animation effect and the image corresponding to at least one control in the Nth frame, including: the rendering process determines the value of the second attribute of each control in the Nth frame based on the description information of the N-1th frame; wherein the second attribute includes an attribute related to the content carried by the control, an attribute related to the appearance of the control, an attribute related to the position of the control, and an attribute related to the size of the control; the rendering process updates the first rendering tree based on the value of the second attribute of each control; wherein the updated first rendering tree includes a first A rendering node and a second rendering node, wherein the first rendering node corresponds to a first type of image, and the second rendering node corresponds to a second type of image, wherein the second type of image is an image corresponding to a control whose value of the first attribute has not changed compared with the N-1 frame in the N-th frame, and the first type of image is an image corresponding to a control whose value of the first attribute has changed compared with the N-1 frame in the N-th frame, and / or an image corresponding to a newly added control in the N-1 frame in the N-th frame; the rendering process pastes the first type of image at the position of the first rendering node and pastes the second type of image at the position of the second rendering node to generate display data of the N-th frame of the first animation effect.

[0026] In this implementation, if the rendering process does not receive the description information of the Nth frame, but receives an image corresponding to at least one control in the Nth frame, then for each control in the Nth frame, the rendering process can determine the value of the second attribute (e.g., position, size, transparency, etc.) of the control that is identical to the control in the N-1th frame based on the description information of the N-1th frame, and determine the value of the second attribute of the control that is identical to the control in the N-1th frame as the value of the second attribute corresponding to the control (i.e., the second attribute remains unchanged). Furthermore, for controls whose values ​​of the first attributes in the Nth frame have changed compared to the N-1th frame, and / or for controls that are newly added in the Nth frame compared to the N-1th frame, the rendering process has re-received the image corresponding to the control (i.e., the first type of image), and the rendering process can paste the re-received image corresponding to the control to the position of the control; for controls whose values ​​of the first attributes in the Nth frame have not changed compared to the N-1th frame, the rendering process has not re-received the image corresponding to the control (i.e., the second type of image), and the rendering process can paste the previously received image corresponding to the control that is identical to the control in the N-1th frame to the position of the control. Since the rendering process does not need to redraw the image corresponding to each control in the Nth frame, the rendering process load is reduced, thereby solving the problem of animation interface jamming caused by high rendering process load.

[0027] In one possible implementation, before the rendering process generates display data of the Nth frame of the first animation effect, the method further includes: the rendering process determines whether the first information is received from the application process within a first time length; wherein the starting time point of the first time length is the time point when the rendering process receives the vertical synchronization signal corresponding to the Nth frame.

[0028] In this implementation, if the rendering process receives the description information of the Nth frame and the image corresponding to at least one control in the Nth frame within the first time period after receiving the vertical synchronization signal corresponding to the Nth frame, the rendering process generates the display data of the Nth frame based on the description information of the Nth frame and the image corresponding to at least one control in the Nth frame. If the rendering process does not receive the description information of the Nth frame and / or the image corresponding to at least one control in the Nth frame within the first time period after receiving the vertical synchronization signal corresponding to the Nth frame, the rendering process reuses the description information of the N-1th frame and / or the image corresponding to each control in the N-1th frame to generate the display data of the Nth frame. Since the rendering process does not need to wait for a long time to receive the description information of the Nth frame and the image corresponding to at least one control in the Nth frame, the possibility of the animation interface being stuck is reduced.

[0029] In a possible implementation, the format of the image is a format supported by a graphics processing unit (GPU) of the electronic device.

[0030] In this implementation, the format of the image corresponding to at least one control in the Nth frame generated by the application process can be a format supported by the GPU, for example, a hardware image, so that the display data of the Nth frame generated by the rendering process based on the image corresponding to at least one control in the Nth frame can be directly read by the GPU without the need for decoding or other operations, thereby improving the efficiency of the GPU.

[0031] In a second aspect, an embodiment of the present application further provides an electronic device, comprising a processor, a memory, and one or more programs; wherein the one or more programs are stored in the memory, and the one or more programs include instructions, which, when executed by the processor, enable the electronic device to perform the method described in the first aspect or any possible design of the first aspect.

[0032] In a third aspect, an embodiment of the present application further provides a computer-readable storage medium, which is used to store a computer program. When the computer program runs on a computer, the computer executes the method described in the first aspect or any possible design of the first aspect.

[0033] In a fourth aspect, an embodiment of the present application further provides a computer program product, comprising a computer program, which, when executed on a computer, enables the computer to execute the method described in the first aspect or any possible design of the first aspect.

[0034] In a fifth aspect, an embodiment of the present application also provides a chip system, comprising a processor and an interface, wherein the processor is used to call and run instructions from the interface so that the chip system executes the method described in the first aspect or any possible design of the first aspect.

[0035] The beneficial effects of the above-mentioned second to fifth aspects and their possible designs can refer to the description of the beneficial effects of the method described in the above-mentioned first aspect and any possible design thereof. BRIEF DESCRIPTION OF THE DRAWINGS

[0036] Figure 1 A schematic diagram of the hardware structure of an electronic device provided in an embodiment of the present application;

[0037] Figure 2 A schematic diagram of the software structure of an electronic device provided in an embodiment of the present application;

[0038] Figure 3 A schematic diagram of an interface configured with animation effects provided in an embodiment of the present application;

[0039] Figure 4 A schematic diagram of another interface configured with animation effects provided in an embodiment of the present application;

[0040] Figure 5 A schematic diagram of a flow chart of a method for displaying animation effects provided in an embodiment of the present application;

[0041] Figure 6 A flowchart of another method for displaying animation effects provided in an embodiment of the present application;

[0042] Figure 7 A schematic diagram of a first animation effect provided in an embodiment of the present application;

[0043] Figure 8 A flowchart of another method for displaying animation effects provided in an embodiment of the present application;

[0044] Figure 9 A schematic diagram of a first rendering tree provided in an embodiment of the present application;

[0045] Figure 10 A schematic diagram of determining description information of the Nth frame of a first animation effect provided in an embodiment of the present application;

[0046] Figure 11A schematic diagram of an image corresponding to at least one control in an Nth frame for generating a first animation effect provided by an embodiment of the present application;

[0047] Figure 12 A flowchart of another method for displaying animation effects provided in an embodiment of the present application;

[0048] Figure 13 A flowchart of another method for displaying animation effects provided in an embodiment of the present application;

[0049] Figure 14 A flowchart of another method for displaying animation effects provided in an embodiment of the present application;

[0050] Figure 15 A flowchart of another method for displaying animation effects provided in an embodiment of the present application;

[0051] Figure 16 A flowchart of another method for displaying animation effects provided in an embodiment of the present application;

[0052] Figure 17 A flowchart of another method for displaying animation effects provided in an embodiment of the present application;

[0053] Figure 18 A flowchart of another method for displaying animation effects provided in an embodiment of the present application;

[0054] Figure 19 A schematic diagram of the hardware structure of another electronic device provided in an embodiment of the present application. DETAILED DESCRIPTION

[0055] In order to make the purpose, technical solutions and advantages of the embodiments of the present application clearer, the embodiments of the present application will be further described in detail below with reference to the accompanying drawings.

[0056] The technical solutions provided in the embodiments of the present application can be applied to electronic devices. The electronic devices can be mobile phones, tablet computers, desktop computers, laptop computers, handheld computers, notebook computers, ultra-mobile personal computers (UMPCs), netbooks, as well as cellular phones, personal digital assistants (PDAs), augmented reality (AR) devices, virtual reality (VR) devices, artificial intelligence (AI) devices, wearable devices, in-vehicle devices, smart home devices, and / or smart city devices. The embodiments of the present application do not impose any special restrictions on the specific types of the electronic devices.

[0057] For example, Figure 1 A schematic diagram of the hardware structure of an electronic device provided in an embodiment of the present application.

[0058] like Figure 1 As shown, the electronic device may include a processor 110, an external memory interface 120, an internal memory 121, a universal serial bus (USB) interface 130, a charging management module 140, a power management module 141, a battery 142, an antenna 1, an antenna 2, a mobile communication module 150, a wireless communication module 160, an audio module 170, a speaker 170A, a receiver 170B, a microphone 170C, an earphone interface 170D, a sensor module 180, a button 190, a motor 191, an indicator 192, a camera 193, a display screen 194, and a subscriber identification module (SIM) card interface 195, etc. The sensor module 180 may include a pressure sensor 180A, a gyroscope sensor 180B, an air pressure sensor 180C, a magnetic sensor 180D, an acceleration sensor 180E, a distance sensor 180F, a proximity light sensor 180G, a fingerprint sensor 180H, a temperature sensor 180I, a touch sensor 180J, an ambient light sensor 180K, a bone conduction sensor 180L, etc.

[0059] It is understood that the structures illustrated in the embodiments of the present invention do not constitute specific limitations on the electronic device. In other embodiments of the present application, the electronic device may include more or fewer components than shown, or may combine or separate certain components, or arrange the components differently. The illustrated components may be implemented in hardware, software, or a combination of software and hardware.

[0060] The processor 110 may include one or more processing units. For example, the processor 110 may include an application processor (AP), a modem processor, a graphics processing unit (GPU), an image signal processor (ISP), a controller, a video codec, a digital signal processor (DSP), a baseband processor, and / or a neural-network processing unit (NPU). The different processing units may be independent devices or integrated into one or more processors.

[0061] The controller can generate operation control signals according to the instruction operation code and timing signal to complete the control of instruction fetching and execution.

[0062] Processor 110 may also include a memory for storing instructions and data. In some embodiments, the memory in processor 110 is a cache memory. This memory can store instructions or data that have just been used or are being recycled by processor 110. If processor 110 needs to use the same instruction or data again, it can directly access the memory. This avoids duplicate accesses, reduces processor 110 latency, and thus improves system efficiency.

[0063] In some embodiments, the processor 110 may include one or more interfaces. The interfaces may include an inter-integrated circuit (I2C) interface, an inter-integrated circuit sound (I2S) interface, a pulse code modulation (PCM) interface, a universal asynchronous receiver / transmitter (UART) interface, a mobile industry processor interface (MIPI), a general-purpose input / output (GPIO) interface, a subscriber identity module (SIM) interface, and / or a universal serial bus (USB) interface.

[0064] The I2C interface is a bidirectional synchronous serial bus that includes a serial data line (SDA) and a serial clock line (SCL). In some embodiments, the processor 110 may include multiple I2C busses. The processor 110 may be coupled to the touch sensor 180J, charger, flash, camera 193, etc. via different I2C bus interfaces. For example, the processor 110 may be coupled to the touch sensor 180J via the I2C interface, enabling communication between the processor 110 and the touch sensor 180J via the I2C bus interface, thereby implementing the touch function of the electronic device.

[0065] The I2S interface can be used for audio communication. In some embodiments, the processor 110 can include multiple I2S buses. The processor 110 can be coupled to the audio module 170 via the I2S bus to enable communication between the processor 110 and the audio module 170. In some embodiments, the audio module 170 can transmit audio signals to the wireless communication module 160 via the I2S interface, enabling the function of answering calls through a Bluetooth headset.

[0066] The PCM interface can also be used for audio communication, sampling, quantizing, and encoding analog signals. In some embodiments, the audio module 170 and the wireless communication module 160 can be coupled via a PCM bus interface. In some embodiments, the audio module 170 can also transmit audio signals to the wireless communication module 160 via the PCM interface, enabling the function of answering calls via a Bluetooth headset. Both the I2S interface and the PCM interface can be used for audio communication.

[0067] The UART interface is a universal serial data bus used for asynchronous communication. This bus can be a bidirectional communication bus. It converts the data to be transmitted between serial communication and parallel communication. In some embodiments, the UART interface is typically used to connect the processor 110 and the wireless communication module 160. For example, the processor 110 communicates with the Bluetooth module in the wireless communication module 160 via the UART interface to implement Bluetooth functionality. In some embodiments, the audio module 170 can transmit audio signals to the wireless communication module 160 via the UART interface, enabling the function of playing music through Bluetooth headphones.

[0068] The MIPI interface can be used to connect the processor 110 to peripheral devices such as the display 194 and the camera 193. MIPI interfaces include the camera serial interface (CSI) and the display serial interface (DSI). In some embodiments, the processor 110 and the camera 193 communicate via the CSI interface to implement the electronic device's camera function. The processor 110 and the display 194 communicate via the DSI interface to implement the electronic device's display function.

[0069] The GPIO interface can be configured via software. The GPIO interface can be configured as either a control signal or a data signal. In some embodiments, the GPIO interface can be used to connect the processor 110 to the camera 193, display 194, wireless communication module 160, audio module 170, sensor module 180, etc. The GPIO interface can also be configured as an I2C interface, an I2S interface, a UART interface, a MIPI interface, etc.

[0070] USB port 130 is an interface that complies with USB standards and may be a Mini USB port, a Micro USB port, a USB Type-C port, or the like. USB port 130 can be used to connect a charger to charge an electronic device, transfer data between the electronic device and peripherals, connect headphones to play audio, and connect other electronic devices, such as augmented reality devices.

[0071] It is understood that the interface connection relationship between the modules illustrated in the embodiments of the present invention is only a schematic illustration and does not constitute a structural limitation of the electronic device. In other embodiments of the present application, the electronic device may also adopt different interface connection methods in the above embodiments, or a combination of multiple interface connection methods.

[0072] The charging management module 140 is configured to receive charging input from a charger. The charger can be either a wireless charger or a wired charger. In some wired charging embodiments, the charging management module 140 can receive charging input from the wired charger via the USB interface 130. In some wireless charging embodiments, the charging management module 140 can receive wireless charging input via the electronic device's wireless charging coil. While charging the battery 142, the charging management module 140 can also power the electronic device through the power management module 141.

[0073] The power management module 141 is used to connect the battery 142, the charging management module 140, and the processor 110. The power management module 141 receives input from the battery 142 and / or the charging management module 140, and provides power to the processor 110, the internal memory 121, the display 194, the camera 193, and the wireless communication module 160. The power management module 141 can also be used to monitor parameters such as battery capacity, battery cycle count, and battery health status (leakage, impedance). In some other embodiments, the power management module 141 can also be set in the processor 110. In other embodiments, the power management module 141 and the charging management module 140 can also be set in the same device.

[0074] The wireless communication function of the electronic device can be implemented through antenna 1, antenna 2, mobile communication module 150, wireless communication module 160, modem processor and baseband processor.

[0075] Antenna 1 and Antenna 2 are used to transmit and receive electromagnetic wave signals. Each antenna in an electronic device can be used to cover a single or multiple communication frequency bands. Different antennas can also be reused to improve antenna utilization. For example, antenna 1 can be reused as a diversity antenna for a wireless local area network. In other embodiments, the antennas can be used in conjunction with a tuning switch.

[0076] The mobile communication module 150 can provide solutions for wireless communications including 2G / 3G / 4G / 5G applied in electronic devices. The mobile communication module 150 may include at least one filter, a switch, a power amplifier, a low noise amplifier (LNA), etc. The mobile communication module 150 can receive electromagnetic waves from the antenna 1, and filter, amplify, and process the received electromagnetic waves, and transmit them to the modulation and demodulation processor for demodulation. The mobile communication module 150 can also amplify the signal modulated by the modulation and demodulation processor, and convert it into electromagnetic waves for radiation through the antenna 1. In some embodiments, at least some of the functional modules of the mobile communication module 150 can be set in the processor 110. In some embodiments, at least some of the functional modules of the mobile communication module 150 can be set in the same device as at least some of the modules of the processor 110.

[0077] The modem processor may include a modulator and a demodulator. The modulator is used to modulate the low-frequency baseband signal to be transmitted into a medium-high frequency signal. The demodulator is used to demodulate the received electromagnetic wave signal into a low-frequency baseband signal. The demodulator then transmits the demodulated low-frequency baseband signal to the baseband processor for processing. After being processed by the baseband processor, the low-frequency baseband signal is passed to the application processor. The application processor outputs a sound signal through an audio device (not limited to the speaker 170A, the receiver 170B, etc.) or displays an image or video through the display screen 194. In some embodiments, the modem processor may be an independent device. In other embodiments, the modem processor may be independent of the processor 110 and be set in the same device as the mobile communication module 150 or other functional modules.

[0078] The wireless communication module 160 can provide wireless communication solutions for electronic devices, including wireless local area networks (WLAN) (such as wireless fidelity (Wi-Fi) networks), Bluetooth (BT), global navigation satellite system (GNSS), frequency modulation (FM), near field communication (NFC), infrared (IR), etc. The wireless communication module 160 can be one or more devices that integrate at least one communication processing module. The wireless communication module 160 receives electromagnetic waves via the antenna 2, frequency modulates and filters the electromagnetic wave signals, and sends the processed signals to the processor 110. The wireless communication module 160 can also receive the signal to be sent from the processor 110, frequency modulate it, amplify it, and convert it into electromagnetic waves for radiation through the antenna 2.

[0079] In some embodiments, the antenna 1 of the electronic device is coupled to the mobile communication module 150, and the antenna 2 is coupled to the wireless communication module 160, so that the electronic device can communicate with the network and other devices through wireless communication technology. The wireless communication technology may include global system for mobile communications (GSM), general packet radio service (GPRS), code division multiple access (CDMA), wideband code division multiple access (WCDMA), time-division code division multiple access (TD-SCDMA), long term evolution (LTE), BT, GNSS, WLAN, NFC, FM, and / or IR technology. The GNSS may include global positioning system (GPS), global navigation satellite system (GLONASS), Beidou navigation satellite system (BDS), quasi-zenith satellite system (QZSS) and / or satellite based augmentation system (SBAS).

[0080] The electronic device implements display functionality through a GPU, display screen 194, and an application processor. A GPU is a microprocessor for image processing that connects display screen 194 and the application processor. The GPU is used to perform mathematical and geometric calculations for graphics rendering. Processor 110 may include one or more GPUs that execute program instructions to generate or modify display information.

[0081] Display screen 194 is used to display images, videos, etc. Display screen 194 includes a display panel. The display panel can be a liquid crystal display (LCD). The display panel can also be made of an organic light-emitting diode (OLED), an active-matrix organic light-emitting diode or an active-matrix organic light-emitting diode (AMOLED), a flexible light-emitting diode (FLED), a mini-LED, a micro-LED, a micro-OLED, a quantum dot light-emitting diode (QLED), etc. In some embodiments, the electronic device can include one or N display screens 194, where N is a positive integer greater than one.

[0082] The electronic device can realize the shooting function through the ISP, camera 193, video codec, GPU, display 194 and application processor.

[0083] The ISP processes data fed back by camera 193. For example, when taking a photo, the shutter is opened, and light is transmitted through the lens to the camera's photosensitive element. The light signal is converted into an electrical signal, which is then passed to the ISP for processing and converted into a visible image. The ISP can also perform algorithmic optimization on image noise, brightness, and color. It can also optimize parameters such as exposure and color temperature of the captured scene. In some embodiments, the ISP can be located within camera 193.

[0084] The camera 193 is used to capture still images or videos. The object generates an optical image through the lens and projects it onto the photosensitive element. The photosensitive element can be a charge coupled device (CCD) or a complementary metal-oxide-semiconductor (CMOS) phototransistor. The photosensitive element converts the light signal into an electrical signal, and then passes the electrical signal to the ISP for conversion into a digital image signal. The ISP outputs the digital image signal to the DSP for processing. The DSP converts the digital image signal into an image signal in a standard RGB, YUV or other format. In some embodiments, the electronic device may include 1 or N cameras 193, where N is a positive integer greater than 1.

[0085] Digital signal processors (DSPs) are used to process digital signals. Besides digital image signals, they can also process other digital signals. For example, when an electronic device selects a frequency, the DSP performs a Fourier transform on the frequency energy.

[0086] Video codecs are used to compress or decompress digital video. Electronic devices may support one or more video codecs. This allows them to play or record videos in a variety of encoding formats, such as Moving Picture Experts Group (MPEG) 1, MPEG2, MPEG3, and MPEG4.

[0087] The NPU is a neural network (NN) computing processor. Drawing on the structure of biological neural networks, such as the transmission patterns between neurons in the human brain, it rapidly processes input information and can continuously self-learn. The NPU enables intelligent cognitive applications in electronic devices, such as image recognition, face recognition, speech recognition, and text comprehension.

[0088] The internal memory 121 may include one or more random access memories (RAM) and one or more non-volatile memories (NVM).

[0089] Random access memory may include static random-access memory (SRAM), dynamic random access memory (DRAM), synchronous dynamic random access memory (SDRAM), double data rate synchronous dynamic random access memory (DDR SDRAM, for example, the fifth generation of DDR SDRAM is generally referred to as DDR5 SDRAM), etc.

[0090] Non-volatile memory may include disk storage devices and flash memory.

[0091] Flash memory can be divided into NOR FLASH, NAND FLASH, 3D NAND FLASH, etc. according to the operating principle; single-level cell (SLC), multi-level cell (MLC), triple-level cell (TLC), quad-level cell (QLC), etc. according to the storage cell potential level; universal flash storage (UFS) and embedded multi media card (eMMC) can be divided into UFS and embedded multi media card according to the storage specification.

[0092] The random access memory can be directly read and written by the processor 110, and can be used to store executable programs (such as machine instructions) of the operating system or other running programs, and can also be used to store user and application data.

[0093] The non-volatile memory may also store executable programs and user and application data, etc., and may be loaded into the random access memory in advance for direct reading and writing by the processor 110 .

[0094] The external memory interface 120 can be used to connect to an external non-volatile memory device to expand the storage capacity of the electronic device. The external non-volatile memory device communicates with the processor 110 via the external memory interface 120 to implement data storage. For example, files such as music and videos can be stored in the external non-volatile memory device.

[0095] The electronic device can implement audio functions such as music playback and recording through the audio module 170, the speaker 170A, the receiver 170B, the microphone 170C, the headphone jack 170D, and the application processor.

[0096] The audio module 170 is used to convert digital audio information into analog audio signal output, and is also used to convert analog audio input into digital audio signals. The audio module 170 can also be used to encode and decode audio signals. In some embodiments, the audio module 170 can be provided in the processor 110, or some functional modules of the audio module 170 can be provided in the processor 110.

[0097] The speaker 170A, also called a "speaker," is used to convert audio electrical signals into sound signals. The electronic device can listen to music or make hands-free calls through the speaker 170A.

[0098] The receiver 170B, also called a "handset", is used to convert audio electrical signals into sound signals. When the electronic device receives a call or voice message, the voice can be heard by placing the receiver 170B close to the human ear.

[0099] Microphone 170C, also known as "microphone" or "microphone", is used to convert sound signals into electrical signals. When making a call or sending a voice message, the user can speak by putting their mouth close to the microphone 170C to input the sound signal into the microphone 170C. The electronic device can be provided with at least one microphone 170C. In other embodiments, the electronic device can be provided with two microphones 170C, which can not only collect sound signals but also realize noise reduction function. In other embodiments, the electronic device can also be provided with three, four or more microphones 170C to realize sound signal collection, noise reduction, and identification of sound sources, and realize directional recording function, etc.

[0100] The headphone jack 170D is used to connect a wired headphone and can be the USB interface 130 or a 3.5mm open mobile terminal platform (OMTP) standard interface or a cellular telecommunications industry association of the USA (CTIA) standard interface.

[0101] The pressure sensor 180A is used to sense pressure signals and convert the pressure signals into electrical signals.

[0102] The gyro sensor 180B may be used to determine the motion posture of the electronic device.

[0103] The air pressure sensor 180C is used to measure air pressure. In some embodiments, the electronic device calculates the altitude using the air pressure value measured by the air pressure sensor 180C to assist in positioning and navigation.

[0104] The magnetic sensor 180D includes a Hall sensor, and the electronic device can use the magnetic sensor 180D to detect the opening and closing of the flip cover.

[0105] The accelerometer 180E can detect the magnitude of an electronic device's acceleration in all directions (generally three axes). When the electronic device is stationary, it can detect the magnitude and direction of gravity. It can also be used to identify the electronic device's posture, enabling applications such as switching between landscape and portrait modes and pedometers.

[0106] Distance sensor 180F is used to measure distance. The electronic device can measure distance using infrared or laser. In some embodiments, when shooting a scene, the electronic device can use distance sensor 180F to measure distance to achieve fast focus.

[0107] The proximity light sensor 180G may include, for example, a light emitting diode (LED) and a light detector such as a photodiode.

[0108] The ambient light sensor 180K senses ambient light brightness. The electronic device can adaptively adjust the brightness of the display 194 based on the perceived ambient light. The ambient light sensor 180K can also be used to automatically adjust the white balance when taking photos. The ambient light sensor 180K can also work with the proximity sensor 180G to detect whether the electronic device is in a pocket to prevent accidental touches.

[0109] Fingerprint sensor 180H is used to collect fingerprints. Electronic devices can use the collected fingerprint characteristics to achieve fingerprint unlocking, access application locks, fingerprint photography, fingerprint answering calls, etc.

[0110] The temperature sensor 180I is used to detect temperature.

[0111] Touch sensor 180J, also known as a "touch-sensitive device," can be mounted on display screen 194. The touch sensor 180J and display screen 194 form a touch screen, also known as a "touchscreen." Touch sensor 180J detects touch operations applied to or near the touch sensor. The touch sensor can transmit the detected touch operations to an application processor to determine the type of touch event. Visual output related to the touch operations can be provided via display screen 194.

[0112] The bone conduction sensor 180L can acquire vibration signals.

[0113] Keys 190 include a power button, a volume button, and the like. Keys 190 may be mechanical keys or touch-sensitive keys. The electronic device may receive key inputs and generate key signal inputs related to user settings and function control of the electronic device.

[0114] Motor 191 can generate vibration prompts. Motor 191 can be used for incoming call vibration prompts, and can also be used for touch vibration feedback. For example, touch operations acting on different applications (such as taking pictures, audio playback, etc.) can correspond to different vibration feedback effects. For touch operations acting on different areas of the display screen 194, motor 191 can also correspond to different vibration feedback effects. Different application scenarios (for example: time reminders, receiving messages, alarm clocks, games, etc.) can also correspond to different vibration feedback effects. The touch vibration feedback effect can also support customization.

[0115] The indicator 192 may be an indicator light, which may be used to indicate the charging status, power level changes, messages, missed calls, notifications, etc.

[0116] The SIM card interface 195 is used to connect a SIM card. The SIM card can be connected to and separated from the electronic device by inserting it into or removing it from the SIM card interface 195. The electronic device can support 1 or N SIM card interfaces, where N is a positive integer greater than 1. The SIM card interface 195 can support Nano SIM cards, Micro SIM cards, SIM cards, and the like. Multiple cards can be inserted into the same SIM card interface 195 at the same time. The types of the multiple cards can be the same or different. The SIM card interface 195 can also be compatible with different types of SIM cards. The SIM card interface 195 can also be compatible with external memory cards. Electronic devices interact with the network through SIM cards to implement functions such as calls and data communications. In some embodiments, the electronic device uses an eSIM, i.e., an embedded SIM card. The eSIM card can be embedded in the electronic device and cannot be separated from the electronic device.

[0117] For example, Figure 2 A schematic diagram of the software structure of an electronic device provided in an embodiment of the present application.

[0118] like Figure 2 As shown, a layered architecture divides software into several layers, each with distinct roles and responsibilities. Layers communicate with each other via software interfaces. In some embodiments, the system is divided into four layers: application layer, application framework layer, system library layer, and kernel layer, from top to bottom.

[0119] The application layer can include a series of application packages. Figure 2 As shown, the application package may include camera, gallery, calendar, call, map, navigation, WLAN, Bluetooth, music, video, short message and other applications (also referred to as applications).

[0120] The application framework layer provides an application programming interface (API) and programming framework for the applications in the application layer. The application framework layer includes some predefined functions.

[0121] like Figure 2 As shown, the application framework layer may include window management services, display management services, content providers, view systems, phone managers, resource managers, notification managers, local profile management assistants (LPA), and the like.

[0122] The window management service is responsible for starting, adding, and deleting windows. It can determine the application displayed on the window and the creation, destruction, and property changes of the application's layer, determine whether there is a status bar, lock the screen, take screenshots, etc.

[0123] The display management service can obtain the number and size of display areas, and is responsible for starting, adding, and deleting display areas.

[0124] Content providers are used to store and retrieve data and make it accessible to applications. The data may include videos, images, audio, calls made and received, browsing history and bookmarks, phone books, etc.

[0125] The phone manager is used to provide communication functions for electronic devices, such as call status management (including answering, hanging up, etc.).

[0126] The resource manager provides various resources for applications, such as localized strings, icons, images, layout files, video files, and so on.

[0127] The Notification Manager allows applications to display notifications in the status bar. These messages can be displayed briefly and then disappear automatically, without requiring user interaction. For example, the Notification Manager can be used to notify users of completed downloads, message reminders, and so on. The Notification Manager can also display notifications in the top status bar of the system as icons or scrolling text, such as notifications from background applications, or as dialog interfaces on the screen. Examples include text messages in the status bar, beeps, vibrations on electronic devices, and flashing indicator lights.

[0128] The view system includes visual controls, such as those for displaying text and images. The view system is used to build applications. A display interface can consist of one or more views. For example, a display interface containing a text notification icon might include a view for displaying text and a view for displaying images.

[0129] The application framework layer may also include an animation system.

[0130] like Figure 2 As shown, a method for displaying an animation effect executed by the animation system includes:

[0131] S2001: Configure animation effects through the animation interface.

[0132] The animation system provides an animation interface to application developers. Application developers can configure animation effects for any one or more controls by calling the animation interface.

[0133] S2002: Determine the start time of the animation effect, the end time of the animation effect, description information of the end frame interface of the animation effect, etc.

[0134] After the application starts running and receives an animation trigger event, the animation system can determine the start time of the animation effect, the end time of the animation effect, the description information of the end frame interface of the animation effect, etc.

[0135] S2003: Determine description information of each frame interface of the animation effect.

[0136] The animation system can then determine the description of the current frame interface to be rendered based on the start time of the animation effect, the time of the end frame interface of the animation effect, the description of the end frame interface of the animation effect, and the time of the current frame interface to be rendered. The description of the current frame interface to be rendered includes the values ​​of the properties of the controls on the frame interface.

[0137] S2004: Update the rendering tree based on the description information of each frame interface of the animation effect

[0138] Then, the animation system updates the rendering tree based on the description information of the frame interface currently to be rendered.

[0139] Finally, the updated render tree is passed to the underlying graphics processing library, which calls the GPU or CPU to perform specific drawing operations and generate a bitmap. The bitmap is then received by the display driver and sent to the display.

[0140] The runtime includes the core library and the virtual machine. The runtime is responsible for the scheduling and management of the operating system.

[0141] The core library consists of two parts: one is the function that needs to be called by the Java language, and the other is the core library.

[0142] The application layer and application framework layer run in a virtual machine. The virtual machine executes Java files in the application layer and application framework layer as binary files. The virtual machine manages object lifecycles, stack management, thread management, security and exception management, and garbage collection.

[0143] The system library may include multiple functional modules, such as a surface manager, media libraries, and a graphics processing library. The graphics processing library includes a 3D graphics processing library (such as OpenGL ES) and a 2D graphics engine (such as SGL).

[0144] The surface manager is used to manage the display subsystem and provide the fusion of two-dimensional (2D) and three-dimensional (3D) layers for multiple applications.

[0145] The media library supports playback and recording of a variety of common audio and video formats, as well as still image files. The media library supports a variety of audio and video encoding formats, such as MPEG4, Moving Picture Experts Group Audio Layer 3 (MP3), Joint Photographic Experts Group (JPG), Portable Network Graphics (PNG), hardware image, and adaptive scalable texture compression (ASTC).

[0146] The 3D graphics processing library is used to implement 3D graphics drawing, image rendering, layer synthesis and layer processing, etc. The 2D graphics engine is a drawing engine for 2D drawing.

[0147] The kernel layer is the layer between hardware and software. The kernel layer contains at least display driver, camera driver, audio driver, sensor driver, and virtual card driver.

[0148] The electronic devices applicable to the embodiments of the present application are introduced above. The following introduces the relevant technical solutions involved in the embodiments of the present application.

[0149] 1) User interface (UI)

[0150] A user interface is the medium for interaction and information exchange between an application or operating system and the user. It converts information between its internal form and a user-friendly form. A user interface is source code written in a specific computer language, such as Java or Extensible Markup Language (XML). This source code is parsed and rendered on an electronic device, ultimately presenting it as user-readable content. A common form of user interface is the graphical user interface (GUI), which refers to a user interface related to computer operations displayed graphically. It can be visual interface elements such as text, icons, buttons, menus, tabs, text boxes, dialog boxes, status bars, and navigation bars displayed on an electronic device's display.

[0151] The interface serves as a medium for interaction and information exchange between applications and users. Every time a vertical synchronization signal (vsync) arrives, the electronic device needs to generate the application interface for the foreground application. The frequency of the vsync signal is related to the refresh rate of the electronic device's screen; for example, the frequency of the vsync signal can be the same as the refresh rate of the electronic device's screen.

[0152] That is, each time before the electronic device refreshes the content displayed on the screen, it needs to generate the interface of the application for the foreground application, so as to display the newly generated interface of the application to the user when the screen is refreshed.

[0153] 2) Animation effects

[0154] The animation effect acts on the animation object, which can be the interface (or window) of the application, or the animation object can be one or more controls of the application, or the animation object can be one or more views of the application. From the user's perspective, the animation object includes one or more controls, and from the application's perspective, the animation object includes one or more views. Among them, the view is the basic element that constitutes the interface of the application, and a control on the interface of the application seen by the user can correspond to one or more views. In the embodiments of the present application, unless otherwise specified, the meanings expressed by the controls and views can be the same.

[0155] From the perspective of time dimension, the process of continuous and smooth changes of animation objects within a period of time (at least the duration of two vertical synchronization signals) is the animation effect.

[0156] 3) Interfaces configured with animation effects

[0157] Figure 3 A schematic diagram of an interface configured with animation effects provided in an embodiment of the present application.

[0158] like Figure 3 As shown in (1), the interface displayed on the screen of the electronic device is the interface of the desktop application, and the interface of the desktop application includes a control 301. Among them, the control 301 includes an icon of the reading application.

[0159] The desktop application may further include icons of other applications, such as an icon of a gallery application, an icon of a dialing application, an icon of a message application, and an icon of a contact application.

[0160] In response to the user long pressing the control 301 , the control 301 expands.

[0161] like Figure 3As shown in (2), when control 301 is enlarged, control 302 appears on the interface. The enlargement process of control 301 is an animation. In the case where control 302 is gradually displayed (e.g., the transparency changes), the process of control 302 gradually displaying is also an animation.

[0162] Figure 4 A schematic diagram of another interface configured with animation effects provided in an embodiment of the present application.

[0163] like Figure 4 As shown in (1), the interface displayed on the screen of the electronic device is the interface of the desktop application, and the interface of the desktop application includes a control 401. Among them, the control 401 is a folder 1, which includes a control 402, a control 403, and a control 404. The control 402 is an icon of the game application, the control 403 is an icon of the flashlight application, and the control 404 is an icon of the gallery application.

[0164] In response to the user clicking on control 402 , control 401 expands and moves, and control 402 , control 403 , and control 404 expand and move.

[0165] like Figure 4 As shown in (2), the expansion and movement process of control 401, control 402, control 403, and control 404 is also an animation.

[0166] 4) Display method of animation effects

[0167] accomplish Figure 3 The interface shown in the figure needs to configure animation events for control 301; Figure 4 In the interface shown, animation events need to be configured for controls 401 , 402 , 403 , and 404 .

[0168] Figure 5 A flowchart of a method for displaying animation effects provided in an embodiment of the present application.

[0169] like Figure 5The method for displaying an animation effect shown may include four steps: S501: creating an animation event; S502: after receiving a vertical synchronization signal, obtaining description information of the end frame interface of the animation effect (also referred to as the end frame description information) and description information of the duration of the animation effect from the animation event; S503: measuring, laying out, and drawing (also referred to as drawing in software rendering) the end frame interface of the animation effect to generate a rendering tree 1; step S504: receiving the rendering tree 1, the description information of the end frame interface of the animation effect, and the description information of the duration of the animation effect; S505: updating the rendering tree 1 based on the description information of the end frame interface of the animation effect and the description information of the duration of the animation effect, and generating a bitmap based on the updated rendering tree 1.

[0170] The application's UI thread needs to execute S501, S502, and S503; the rendering process needs to execute S504 and S505. At the start frame of the animation effect (or the first frame), the electronic device needs to execute steps S501, S502, S503, S504, and S505; and at each frame of the animation effect during its duration, the electronic device needs to execute step S505. The rendering process can be independent of the application.

[0171] The following is an introduction to S501, S502, S503, S504, and S505.

[0172] S501: Create an animation event.

[0173] An application's UI thread can create animation events using the animation API. The timing of animation event creation by the application's UI thread can be related to the application's logic. For example, the application's UI thread might create an animation event after receiving user input, a message event sent to the application by another thread or process, or a network data update request. For ease of description, these messages that trigger the application's UI thread to create animation events are referred to as animation trigger events.

[0174] Animation events include the internal logic for implementing animation effects, such as descriptions of the end frame of the animation effect, the step size of the animation effect, and the duration of the animation effect.

[0175] S502: After receiving the vertical synchronization signal, obtain description information of the end frame interface of the animation effect and description information of the duration of the animation effect from the animation event.

[0176] After receiving the vertical synchronization signal, Figure 5In the vertical synchronization signal 1, vertical synchronization signal 2, and vertical synchronization signal 3, the UI thread of the application can obtain the description information of the end frame interface of the animation effect and the description information of the duration of the animation effect from the animation event.

[0177] Optionally, the UI thread of the application can obtain description information of the step amount of the animation effect and description information of the duration of the animation effect from the animation event; or, the UI thread of the application can obtain description information of the end frame interface of the animation effect and description information of the step amount of the animation effect from the animation event, etc., which are not limited here.

[0178] It is worth noting that the UI thread of the application can directly obtain the description information of the end frame interface of the animation effect from the animation event; or, indirectly obtain the description information of the end frame interface of the animation effect from the animation event.

[0179] S503: Measure, lay out, draw and record the end frame interface of the animation effect to generate a rendering tree 1.

[0180] The application's UI thread can measure, lay out, and record drawing of the animation effect's end frame interface, thereby generating a render tree 1. Measurement is used to determine the size of each control in the animation effect's end frame interface, layout is used to determine the position of each control in the animation effect's end frame interface, and recording drawing is used to determine one or more drawing operations required to draw the bitmap corresponding to the animation effect's end frame interface, and store them in the drawing instruction list of render tree 1.

[0181] It can be understood that the UI thread of the application can determine the value of the attribute (such as size, position, transparency, etc.) of each control in the end frame interface of the animation effect, and then determine the rendering node corresponding to each control to generate the rendering tree 1.

[0182] Render tree 1 can be a data structure used to generate the end frame interface of an animation effect. That is, render tree 1 records all information used to generate the end frame interface of an animation effect. Render tree 1 includes one or more render nodes. The root render node corresponds to the end frame interface of the animation effect, and a child render node of the root render node corresponds to a control in the end frame interface of the animation effect. A render node includes rendering properties and a display list. A display list includes one or more drawing operations.

[0183] A drawing operation is a data structure used to draw graphics (e.g., lines, rectangles, text, etc.). This means that a drawing operation records all the information needed to draw a graphic. When executed by the rendering process, a drawing operation is converted into an API call to a graphics processing library, such as a 3D graphics processing library. For example, a drawline operation is a data structure that contains line drawing data (e.g., line length, width, etc.) and the corresponding API call to the underlying graphics processing library's drawline operation.

[0184] The drawing instruction list may be a buffer that records all drawing operations included in the end frame interface of the animation effect, or the buffer that records the identifiers (such as addresses, serial numbers) of all drawing operations included in the end frame interface of the animation effect.

[0185] The UI thread of the application may synchronize the rendering tree 1, the description information of the end frame interface of the animation effect, and the description information of the duration of the animation effect to the rendering process.

[0186] Optionally, the UI thread of the application may synchronize rendering tree 1, description information of the duration of the animation effect, and description information of the step amount of the animation effect with the rendering process; or, the UI thread of the application may synchronize rendering tree 1, description information of the end frame interface of the animation effect, and description information of the step amount of the animation effect with the rendering process; or, the UI thread of the application may synchronize at least two of the description information of the end frame interface of the animation effect, the description information of the duration of the animation effect, and the description information of the step amount of the animation effect with the rendering process, without synchronizing rendering tree 1. In this case, in S505, the rendering process updates rendering tree 0 based on the description information of the end frame interface of the animation effect and the description information of the duration of the animation effect, where rendering tree 0 corresponds to the interface before the animation effect starts; or, the UI thread of the application may determine the value of the property of the control in each frame interface within the duration of the animation effect based on at least two of the description information of the end frame interface of the animation effect, the description information of the duration of the animation effect, and the description information of the step amount of the animation effect, and then synchronize the value of the property of the control in each frame interface within the duration of the animation effect and rendering tree 1 with the rendering process.

[0187] S504: Receive rendering tree 1, description information of an end frame interface based on an animation effect, and description information of a duration of the animation effect.

[0188] The rendering process can receive data sent by the UI thread of the application through the message queue; alternatively, the rendering process can also receive data sent by the UI thread of the application through cross-process communication; alternatively, the rendering process can also request and obtain data from the UI thread of the application after receiving the vertical synchronization signal.

[0189] S505 : updating the rendering tree 1 based on the description information of the end frame interface of the animation effect and the description information of the duration of the animation effect, and generating a bitmap based on the updated rendering tree 1 .

[0190] The rendering process may determine the control whose property value changes based on the description information of the interface at the end frame of the animation effect and the interface before the animation effect starts. The rendering process may determine the step size of the property value of the control whose property value changes based on the duration of the animation effect, and further determine the property value of the control in each frame of the interface during the duration of the animation effect.

[0191] When generating a frame of an animation effect, the rendering process first determines the order of the frame within the animation effect, that is, the frame number of the animation effect. Furthermore, the values ​​of the properties of the controls on the frame can be determined, that is, the description of the frame.

[0192] The frame interface of the animation effect can be determined by the time of the frame interface, the frequency of the vertical synchronization signal, and the start time of the animation effect. The start time of the animation effect is the time of the vertical synchronization signal corresponding to the start frame interface of the animation effect, such as Figure 5 Alternatively, the start time of the animation effect may also be the moment of the animation triggering event, etc., which is not limited here.

[0193] After determining the value of the property of the control in each frame of the interface within the duration of the animation effect, the rendering process can receive the vertical synchronization signal, such as Figure 5 The vertical synchronization signal 2 and the vertical synchronization signal 3 in the rendering tree are used to update the values ​​of the parameters corresponding to the properties of the control in the rendering tree 1, and then a bitmap is generated based on the updated rendering tree 1.

[0194] During the duration of the animation, for each frame interface except the starting frame interface, the rendering process only needs to execute step S505 to draw each frame interface in the animation effect, thereby displaying the animation effect.

[0195] It is worth noting that the execution of the application's UI thread and rendering process can be triggered by different vertical synchronization signals. For example, the vertical synchronization signal received by the application's UI thread and the vertical synchronization signal received by the rendering process can have the same period but different phases (with a fixed time difference).

[0196] It can be seen that for Figure 5 The animation effect display method shown, in the process of generating each frame interface after the starting frame interface within the duration of the animation, is mainly updated by the rendering process to generate multiple frame interfaces within the duration of the animation. The UI thread of the application is not involved or the amount of calculation or task undertaken by the UI thread of the application is small. When the UI thread of the application is blocked by other tasks, it is not easy to drop frames, freezes, etc. However, there is a problem of redundant rendering when the rendering process renders the controls in each frame interface based on the value of the properties of the controls in the frame interface. For example, compared with control 1 in the second frame interface of the animation effect, only the value of the position property of control 1 in the starting frame interface of the animation effect has changed, and the values ​​of other properties have not changed. However, the rendering process still needs to redraw control 1 when generating the bitmap corresponding to the second frame interface, which increases the load of the rendering process and causes the animation interface to freeze.

[0197] In view of this, an embodiment of the present application provides a method for displaying animation effects, which is used to solve the problem of animation interface freeze.

[0198] In the embodiments of this application, "when," "if," and "if" all indicate that the device will perform a corresponding action under certain objective circumstances. They do not limit the time, do not require the device to perform a judgment action when implemented, and do not imply any other limitations. Unless otherwise specified, "if" and "if" are interchangeable, and "when" and "under the circumstances" are interchangeable. "When" and "if" are interchangeable.

[0199] In the embodiments of this application, words such as "exemplary" or "for example" are used to indicate examples, illustrations, or descriptions. Any embodiment or design described in this application as "exemplary" or "for example" should not be construed as being preferred or advantageous over other embodiments or designs. Rather, the use of words such as "exemplary" or "for example" is intended to present the relevant concepts in a concrete manner.

[0200] In the embodiments of the present application, the number of nouns, unless otherwise specified, means "singular noun or plural noun", that is, "one or more". "At least one" means one or more, and "plural" means two or more. "And / or" describes the association relationship of associated objects, indicating that there may be three relationships. For example, A and / or B can mean: A exists alone, A and B exist at the same time, and B exists alone, where A and B can be singular or plural. The character " / " can indicate that the previous and next associated objects are in an "or" relationship. For example, A / B means: A or B. "At least one of the following items" or similar expressions refers to any combination of these items, including any combination of single items or plural items. For example, at least one of a, b, or c means: a, b, c, a and b, a and c, b and c, or a and b and c, where a, b, c can be single or multiple.

[0201] The ordinal numbers such as "first" and "second" mentioned in the embodiments of the present application are used to distinguish between multiple objects, and are not used to limit the size, content, order, timing, priority or importance of multiple objects. For example, the first attribute and the second attribute refer to two different attributes, and do not indicate the difference in content, priority or importance of the two attributes. For a technical feature, "A", "B", "C" and "D" are used to distinguish the technical features in the technical feature, and there is no order of precedence or order of size between the technical features described by "A", "B", "C" and "D". For example, Case A and Case B in this article are only to distinguish different contents, and do not limit the order of precedence or order of size, priority or importance, etc. between Case A and Case B.

[0202] The following describes the solution provided by the embodiment of the present application in detail with reference to the accompanying drawings. In the following description, the display method of the animation effect provided by the embodiment of the present application is applied to Figure 1-Figure 2 The electronic device shown is taken as an example.

[0203] See Figure 6 , is a flow chart of another method for displaying animation effects provided in an embodiment of the present application. The specific process of the method for displaying animation effects is described as follows.

[0204] S601: After receiving an animation triggering event, the application process determines first information according to description information of a first animation effect, and sends the first information to a rendering process.

[0205] In an embodiment of the present application, an application on an electronic device can create an application process during runtime. The application process may include the application's UI thread, the application's rendering client thread (or also known as the rendering service client thread), etc. The embodiment of the present application does not limit the threads included in the application process.

[0206] For example, when application A is running, application process A is created. Application process A includes the UI thread of application A and the rendering client thread of application A. When application B is running, application process B is created. Application process B includes the UI thread of application B and the rendering client thread of application B.

[0207] The rendering process can be a separate process from the application process. The rendering process can perform specific drawing operations to generate display data corresponding to the application interface. It is worth noting that when the application process passes information to the rendering process, this information exchange can be achieved through inter-process communication (IPC). The application process and the rendering process can achieve IPC communication through methods such as binders (Binders) and shared memory, which are not limited here.

[0208] After receiving the animation triggering event, the application process may respond to the animation triggering event, determine the first information according to the description information of the first animation effect, and send the first information to the rendering process.

[0209] The following introduces the animation triggering event, the description information of the first animation effect, and the specific meaning of the first information in turn.

[0210] 1) Animation triggering events may be user interaction, network status change, messages sent to the application by other applications on the electronic device, etc., which are not limited here.

[0211] The animation triggering event can be used to trigger the display of the first animation effect. It can be understood that the animation triggering event can be used to trigger the creation of the first animation event, and the first animation event can be used to display the first animation effect.

[0212] Among them, the first animation effect includes M frames, which can be understood as the duration of the first animation effect is M frames, where M is a positive integer. The first animation effect can be an animation effect acting on the appearance, an animation effect acting on the position, an animation effect acting on the size, an animation effect based on transformation, an animation effect acting on the content, etc. Animation effects acting on the appearance include: transparency, rounded corners, border color, border line width, background color, shadow, etc.; animation effects acting on the position include x / y / z coordinates, x / y / z anchor points, etc.; animation effects acting on the size include width, height, etc.; animation effects based on transformation include: translation, rotation, scaling, 3D transformation, etc.; animation effects acting on the content include: filter effects such as blur, color enhancement, grayscale change, adding noise, etc. The embodiment of the present application does not limit the type of the first animation effect.

[0213] It can be understood that the first animation effect can be used as a configurable value of the property of the control in the interface of the application. Alternatively, it can be understood that the value of the property of the control in the interface of the application is used to determine the display mode of the control in the interface of the application, and the display mode is the first animation effect. Alternatively, it can be understood that the first animation effect acts on the first animation object, and the first animation object can be a control whose property value in the interface of the application has changed. For example, the first animation object can be a control whose property value in the end frame interface of the first animation effect has changed when comparing the interface before the start of the first animation effect and the end frame interface of the first animation effect. For another example, the first animation object can be a control whose property value in the interface between the end frame interface of the first animation effect and the interface before the start of the first animation effect has changed.

[0214] Among them, the properties of a control can be properties related to the content carried by the control, properties related to the appearance of the control, properties related to the position of the control, properties related to the size of the control, etc. Properties related to the content carried by the control include: images, text, etc.; properties related to the appearance of the control include transparency, rounded corners, border color, border line width, background color, shadow, etc.; properties related to the position of the control include: x / y / z coordinates, x / y / z anchor points, etc.; properties related to the size of the control include: width, height, etc. The embodiments of this application do not limit the properties of the controls in the application interface.

[0215] The type of a control can be determined based on the content carried by the control. For example, if the content carried by the control is text, then the control is a text view control; if the content carried by the control is an image, then the control is an image view control, etc. The embodiments of the present application do not limit the types of controls in the application interface.

[0216] Different controls can have a parent-child relationship. For example, if the interface that an application needs to display consists of control 1 and control 2 nested together, when control 2 is nested within control 1, control 1 is the root control and control 2 is the child control of control 1. Alternatively, different controls may not have a parent-child relationship. The embodiments of this application do not limit whether controls in the application interface have a parent-child relationship.

[0217] For example, Figure 7 A schematic diagram of a first animation effect provided in an embodiment of the present application is shown as follows: Figure 7 As shown, the interface before the start of the first animation effect includes control 1, control 2, and control 3, and the horizontal (the width direction of the control is horizontal) intervals of control 1, control 2, and control 3 are fixed. When control 2 is configured with a first animation effect that changes the width from B1 to B2, where B2 is greater than B1 and greater than 0. Obviously, by comparing the interface before the start of the first animation effect and the end frame interface of the first animation effect, the position of control 3 changes due to the change in the width of control 2. Therefore, since the value of the width attribute of control 2 and the value of the position attribute of control 3 change, it can be determined that the first animation objects involved in the first animation effect are control 2 and control 3.

[0218] 2) The description information of the first animation effect may be configured by the application process when creating the first animation event. The description information of the first animation effect may be used to determine the internal logic for implementing the first animation effect.

[0219] For example, the description information of the first animation effect may include: description information of the end frame of the first animation effect, description information of the step amount of the first animation effect, description information of the duration of the first animation effect, etc. The description information of the end frame of the first animation effect can be used to determine the value of the property of each control in the end frame of the first animation effect, or the description information of the end frame of the first animation effect can also be used to determine the variables of the end frame interface of the first animation effect relative to the interface before the start of the first animation effect, such as how much wider control 1 has become. The description information of the step amount of the first animation effect can be used to determine the change in the value of the property of the control in the frame interface currently to be rendered compared to the previous frame interface. The description information of the duration of the first animation effect can be used to determine the time corresponding to the start frame of the first animation effect and the time corresponding to the end frame of the first animation effect.

[0220] 3) The first information may include description information of the Nth frame of the first animation effect and an image corresponding to at least one control in the Nth frame of the first animation effect. N is a positive integer less than or equal to M.

[0221] Among them, the description information of the Nth frame of the first animation effect can be used to determine the value of the attribute of each control in the Nth frame of the first animation effect, or the description information of the Nth frame of the first animation effect can also be used to determine the variable of the Nth frame of the first animation effect relative to the N-1th frame of the first animation effect, such as how much wider control 1 has become.

[0222] The image corresponding to at least one control in the Nth frame of the first animation effect can be understood as a correspondence between the control and the image, and the correspondence can be a one-to-one correspondence, for example, control 1 corresponds to image 1, and control 2 corresponds to image 2; or, the correspondence can also be a non-one-to-one correspondence, for example, control 1 and control 2 correspond to image 1, or control 1 corresponds to image 1 and image 2, and this is not limited to this. At least one control in the Nth frame of the first animation effect can be pre-configured, or it can be determined by the application process based on the variables of the Nth frame interface of the first animation effect relative to the N-1th frame interface of the first animation effect, and this embodiment of the application does not limit this.

[0223] The format of the image corresponding to the at least one control in the Nth frame of the first animation effect can be a format supported by the GPU of the electronic device, such as a hardware image, ASTC, etc. It can be understood that the GPU of the electronic device can directly read the image included in the image corresponding to the at least one control in the Nth frame of the first animation effect, without having to perform operations such as decoding the image included in the image corresponding to the at least one control in the Nth frame of the first animation effect.

[0224] In one possible implementation, Figure 8 As shown, the S601 may include the following steps A1 to A4:

[0225] Step A1: After receiving the animation trigger event, the UI thread of the application creates the first animation event.

[0226] After receiving the animation trigger event, the UI thread of the application can respond to the animation trigger event by creating a first animation event through the animation interface. The first animation event includes internal logic for implementing the first animation effect, that is, the first animation event includes description information of the first animation effect.

[0227] The animation interface can be one or more functions or methods provided by the system. Application developers can configure a first animation effect for the application by calling the animation interface, and configure the description information of the first animation effect. After receiving an animation trigger event, the application can respond to the animation trigger event and provide the description information of the first animation effect to the system through the animation interface. The system can then generate each frame interface of the first animation effect based on this information.

[0228] The format of the animation interface can be: the name of the animation interface (description information of the duration, description information of the end frame), the name of the animation interface (description information of the duration, description information of the change curve, description information of the end frame), the name of the animation interface (description information of the step amount, description information of the end frame), the name of the animation interface (description information of the duration, description information of the step amount), etc., which is not limited to the embodiments of the present application.

[0229] For example, in the case where the format of the animation interface is: the name of the animation interface (description information of the duration, description information of the change curve, description information of the end frame), the animation interface can be:

[0230] animateTo({duration: 3000, cure: Curve.Linear},()=>{

[0231] view1.Height=800

[0232] view1.Width = 400

[0233] })

[0234] Here, animateTo is the name of the animation interface. duration: 3000 indicates a duration of 3000ms, which is the description of the duration. cure: Curve.Linear indicates a linear curve, which is the description of the change curve. "view1.Height = 800view1.Width = 400" indicates that view1's height is 800 and its width is 400 at the end frame of the animation, which is the description of the end frame.

[0235] After the first animation event is created, a callback is registered on the choreographer of the application's UI thread. This callback is used to trigger the application's UI thread to process the first animation event in response to the first vertical sync signal after the first animation event is created.

[0236] Step A2: The UI thread of the application determines the time corresponding to the start frame of the first animation effect, the time corresponding to the end frame of the first animation effect, and the description information of the end frame of the first animation effect according to the description information of the first animation effect.

[0237] After the UI thread of the application creates the first animation event, the UI thread of the application can determine the description information of the first animation effect from the first animation event, and determine the time corresponding to the start frame of the first animation effect, the time corresponding to the end frame of the first animation effect, and the description information of the end frame of the first animation effect from the description information of the first animation effect.

[0238] Optionally, after determining the time corresponding to the start frame of the first animation effect, the time corresponding to the end frame of the first animation effect, and the description information of the end frame of the first animation effect, the UI thread of the application can perform measurement, layout, and drawing recording on the end frame interface of the first animation effect or the interface before the start of the first animation effect, generate a first rendering tree, and send the first rendering tree to the rendering process.

[0239] The parent-child relationship between the rendering nodes in the first rendering tree is the same as the parent-child relationship between the controls in the end-frame interface of the first animation effect or the interface before the first animation effect begins. That is, the nesting relationship between the different controls in the end-frame interface of the first animation effect or the interface before the first animation effect begins determines the nesting relationship between the different rendering nodes in the first rendering tree. Consequently, the rendering process can correctly render the application interface when generating a bitmap based on the first rendering tree.

[0240] For example, Figure 9 A schematic diagram of a first rendering tree provided in an embodiment of the present application. The end frame interface of the first animation effect or the interface before the start of the first animation effect carries control 0, control 1, control 2, and control 3. Control 0 is the root control, the child controls of control 0 are control 1 and control 2, and the child control of control 2 is control 3. The structure of the first rendering tree generated by the UI thread of the application is: the rendering node corresponding to the end frame interface of the first animation effect or the interface before the start of the first animation effect is the root rendering node of the first rendering tree, the rendering node 0 corresponding to control 0 is the child rendering node of the root rendering node, the rendering node 1 corresponding to control 1 and the rendering node 2 corresponding to control 2 are the child rendering nodes of rendering node 0, and the rendering node 3 corresponding to control 3 is the child node of rendering node 2. Among them, the corresponding relationship between the control and the rendering node means that the rendering node includes all the drawing operations in the corresponding control. Among them, one control can correspond to one or more rendering nodes.

[0241] Step A3: When receiving the vertical synchronization signal corresponding to the Nth frame of the first animation effect, the UI thread of the application or the rendering client thread of the application determines the description information of the Nth frame of the first animation effect based on the time corresponding to the start frame of the first animation effect, the time corresponding to the end frame of the first animation effect, the description information of the end frame of the first animation effect, and the time corresponding to the Nth frame of the first animation effect.

[0242] After determining the time corresponding to the start frame of the first animation effect, the time corresponding to the end frame of the first animation effect, and the description information of the end frame of the first animation effect, the UI thread of the application can send the time corresponding to the start frame of the first animation effect, the time corresponding to the end frame of the first animation effect, and the description information of the end frame of the first animation effect to the rendering client thread of the application.

[0243] When the UI thread of the application or the rendering client thread of the application receives the vertical synchronization signal corresponding to the Nth frame of the first animation effect, it can determine the description information of the Nth frame of the first animation effect based on the time corresponding to the start frame of the first animation effect, the time corresponding to the end frame of the first animation effect, the description information of the end frame of the first animation effect, and the time corresponding to the Nth frame of the first animation effect.

[0244] Among them, the UI thread of the application or the rendering client thread of the application can determine the frame number of the first animation effect corresponding to the currently received vertical synchronization signal through various methods such as the number of vertical synchronization signals that have been received and the time in the vertical synchronization signal, and the embodiments of the present application are not limited here. For example, the first vertical synchronization signal received corresponds to the first frame (i.e., the starting frame) of the first animation effect, the second vertical synchronization signal received corresponds to the second frame of the first animation effect, and so on. Determining the frame number of the first animation effect corresponding to the currently received vertical synchronization signal can be understood as determining that the current frame is the frame number of the first animation effect, or it can also be understood as determining the order of the current frame in the first animation effect.

[0245] For example, Figure 10 Schematic diagram of determining the description information of the Nth frame of the first animation effect provided by an embodiment of the present application. Figure 10 As shown, the UI thread of the application or the rendering client thread of the application can compare the interface before the first animation effect starts and the interface of the barrier frame of the first animation effect, and determine that the control whose property value has changed is the first animation object involved in the first animation effect. For example, if the position of control 401 changes from (x0, y0) to (x1, y1), and the height and width of control 401 increase by P times, control 401 can be determined to be the first animation object involved in the first animation effect. The duration of the first animation effect is 30 frames. Furthermore, the position of control 401 in the Nth frame interface of the first animation effect can be determined to be (x0+N*δX, y0+N*δY), where δX=(x1-x0) / 30 and δY=(y1-y0) / 30, and the height and width of control 401 in the Nth frame interface of the first animation effect can be determined to be N*δP times the original values, where δP=P / 30.

[0246] It is worth noting that, since the end frame interface of the first animation effect and the interface before the start of the first animation effect are known, the value of the attribute of each control in each frame interface during the duration of the first animation effect can be determined through an interpolator, thereby making the value of the attribute of each control in each frame interface continuous, first-order differentiable, and second-order differentiable as time changes.

[0247] Step A4: The rendering client thread determines the value of the first attribute of at least one control in the Nth frame of the first animation effect based on the description information of the Nth frame of the first animation effect, and generates an image corresponding to the at least one control in the Nth frame of the first animation effect based on the value of the first attribute of the at least one control in the Nth frame of the first animation effect.

[0248] The rendering client thread of the application can determine at least one control in the Nth frame of the first animation effect based on a variable of the Nth frame interface of the first animation effect relative to the N-1th frame interface of the first animation effect.

[0249] When N is equal to 1, the rendering client thread of the application can determine that the at least one control in the Nth frame of the first animation effect is a control among all controls in the Nth frame of the first animation effect. For example, if the first frame of the first animation effect includes control 1, control 2, and control 3, then the at least one control in the first frame of the first animation effect includes control 1, control 2, and control 3.

[0250] When N is greater than or equal to 2, the rendering client thread of the application can determine that at least one control in the Nth frame of the first animation effect is a control whose value of the first attribute changes in the Nth frame of the first animation effect compared to the N-1 frame of the first animation effect, and / or a control that is newly added in the Nth frame of the first animation effect compared to the N-1 frame of the first animation effect.

[0251] For example, the first frame of a first animation effect includes controls 1, 2, and 3, and the second frame of the first animation effect includes controls 1, 2, and 3. The value of the first property of control 1 in the first frame of the first animation effect is different from the value of the first property of control 1 in the second frame of the first animation effect, the value of the first property of control 2 in the first frame of the first animation effect is the same as the value of the first property of control 2 in the second frame of the first animation effect, and the value of the first property of control 3 in the first frame of the first animation effect is different from the value of the first property of control 3 in the second frame of the first animation effect. Then, at least one control in the second frame of the first animation effect includes controls 1 and 3.

[0252] The first attribute may include attributes related to the content carried on the control, such as images, text, etc.; and / or, the first attribute may also include attributes related to the appearance of the control, such as transparency, rounded corners, border color, border line width, background color, shadow, etc. The embodiments of the present application are not limited to this. Optionally, when the first attribute includes attributes related to the content carried on the control and attributes related to the appearance of the control, one of the at least one controls in the Nth frame of the first animation effect may correspond to two images, wherein one image may be generated based on the value of an attribute related to the content carried on the control, and the other image may be generated based on the value of an attribute related to the appearance of the control.

[0253] For example, taking the example where the first attribute includes an attribute related to the content carried on the control, Figure 11 A schematic diagram of an image corresponding to at least one control in the Nth frame of a first animation effect provided by an embodiment of the present application. Figure 11 As shown, the first frame of the first animation effect includes control 1 and control 2.

[0254] Among them, the control 1 carries the text 1 "Please enter your account number", and the control 1 may include a text view Figure 1 and rectangular view Figure 1 , text view Figure 1 The text 1 "Please enter your account number" is carried on it, and the rectangular view Figure 1 Same size as control 1. Figure 1 The corresponding drawing operation in the drawing instruction list is drawText("Please enter your account number", dst1), where dst1 indicates that the text 1 "Please enter your account number" is drawn in the rectangular view. Figure 1 For example, dst1 = Rect(10, 20, 150, 200), where (10, 20) is the rectangular view. Figure 1 The coordinates of the upper left corner, (150, 100) are the coordinates of the rectangular view Figure 1 The coordinates of the lower right corner of the rectangular view. Figure 1 The corresponding drawing operation in the drawing instruction list is drawRectangle. The rendering client thread can execute the drawing operation drawRectangle and the drawing operation drawText("Please enter your account number", dst1) to generate the image corresponding to control 1.

[0255] If image 1 is carried on control 2, the control may include image view Figure 1 and rectangular view Figure 2 , image viewing Figure 1 Image 1 is carried on it, and the rectangular view Figure 2 Same size as control 2. Image view Figure 1The drawing operation in the corresponding drawing instruction list is drawBitmap("image 1", src, dst1), where image 1 is the source image, scr indicates the area where the source image needs to be displayed, and dst2 indicates that the scr in image 1 is drawn in the rectangular view. Figure 2 What area on the rectangle. Figure 2 The drawing operation in the corresponding drawing instruction list is drawRectangle. The rendering client thread can execute the drawing operation drawRectangle and the drawing operation drawBitmap("image 1", src, dst1) to generate the image corresponding to control 2.

[0256] S602: After receiving the first information from the application process, the rendering process generates display data of the Nth frame of the first animation effect according to the first information.

[0257] In an embodiment of the present application, after receiving the first information from the application process, the rendering process may generate display data of the Nth frame of the first animation effect according to the first information.

[0258] In one possible implementation, the rendering process may determine whether the first information is received from the application process within a first duration, and after receiving the first information from the application process within the first duration, generate display data of the Nth frame of the first animation effect based on the first information.

[0259] Among them, the starting time point of the first duration can be the time point when the rendering process receives the vertical synchronization signal corresponding to the Nth frame of the first animation effect. The rendering process can determine the frame number of the first animation effect corresponding to the currently received vertical synchronization signal through various methods such as the number of vertical synchronization signals that have been received and the time in the vertical synchronization signal, and the embodiments of the present application are not limited here. For example, the first vertical synchronization signal received corresponds to the first frame of the first animation effect, the second vertical synchronization signal received corresponds to the second frame of the first animation effect, and so on. Determining the frame number of the first animation effect corresponding to the currently received vertical synchronization signal can be understood as determining that the current frame is the frame number of the first animation effect.

[0260] The duration of the first duration may be pre-configured, or may be defined by a standard, or may be agreed upon in advance by the application process and the rendering process, which is not limited in this embodiment of the present application.

[0261] In one possible implementation, Figure 12 As shown, the S602 may include the following steps B1 to B3:

[0262] Step B1: After receiving the first information from the application process, the rendering process determines the value of the second property of each control in the Nth frame of the first animation effect according to the description information of the Nth frame of the first animation effect.

[0263] The second attribute may include attributes related to the content carried by the control, attributes related to the appearance of the control, attributes related to the position of the control, and attributes related to the size of the control, etc., which are not limited in this embodiment of the present application. That is, the second attribute includes the first attribute.

[0264] Optionally, the rendering process can determine whether the first information is received from the application process within the first time length. After receiving the first information from the application process within the first time length, the rendering process can determine the value of the second property of each control in the Nth frame of the first animation effect based on the description information of the Nth frame of the first animation effect.

[0265] Step B2: The rendering process updates the first rendering tree according to the value of the second attribute of each control in the Nth frame of the first animation effect.

[0266] The updated first rendering tree includes a first rendering node and a second rendering node.

[0267] The first rendering node corresponds to a first type of image. The first type of image is an image corresponding to a control whose first attribute value has changed in frame N of the first animation effect compared to frame N-1 of the first animation effect, and / or an image corresponding to a control that has been newly added in frame N of the first animation effect compared to frame N-1 of the first animation effect. In other words, the first type of image is an image corresponding to at least one control (e.g., a first control group) in frame N of the first animation effect included in the first information.

[0268] The second rendering node corresponds to the second type of image. The second type of image is the image corresponding to the control whose value of the first attribute has not changed in the Nth frame of the first animation effect compared to the N-1th frame of the first animation effect. That is to say, the second type of image is not the image corresponding to at least one control in the Nth frame of the first animation effect included in the above-mentioned first information, but is the image corresponding to at least one control (for example, called the second control group) in the N-1th frame of the first animation effect used by the rendering process when generating the display data of the N-1th frame of the first animation effect. The second control group in the N-1th frame of the first animation effect is the same as all the controls in the Nth frame of the first animation effect except the first control group. The format of the image corresponding to at least one control in the N-1th frame of the first animation effect can be a format supported by the GPU of the electronic device. For example, hardware image, ASTC, etc.

[0269] It can be understood that, by comparing the controls in the N-1th frame of the first animation effect with the controls in the N-1th frame of the first animation effect, it is determined that the value of the first attribute of the controls in the Nth frame of the first animation effect has changed compared to the N-1th frame of the first animation effect and / or a new control has been added, the one or more rendering nodes corresponding to the control are the first rendering nodes, and the one or more images corresponding to the control are the images corresponding to the first rendering nodes. Furthermore, by comparing the controls in the N-1th frame of the first animation effect with the controls in the N-1th frame of the first animation effect, it is determined that the value of the first attribute of the controls in the Nth frame of the first animation effect has not changed compared to the N-1th frame of the first animation effect, the one or more rendering nodes corresponding to the control are the second rendering nodes, and the one or more images corresponding to the control are the images corresponding to the second rendering nodes.

[0270] For example, the first frame of the first animation effect includes controls 1, 2, and 3, and the second frame of the first animation effect includes controls 1, 2, and 3. The values ​​of the first properties of controls 1 and 3 in the first frame of the first animation effect are different from the values ​​of the first properties of controls 1 and 3 in the second frame of the first animation effect, and the value of the first property of control 2 in the first frame of the first animation effect is the same as the value of the first property of control 2 in the second frame of the first animation effect.

[0271] When generating display data corresponding to the first frame of the first animation effect, the rendering client thread of the application can generate image A1 corresponding to control 1 in the first frame of the first animation effect, image A2 corresponding to control 2 in the first frame of the first animation effect, and image A3 corresponding to control 3 in the first frame of the first animation effect, and send image A1, image A2, image A3, and description information of the first frame of the first animation effect to the rendering process. The rendering process can generate display data corresponding to the first frame of the first animation effect based on image A1, image A2, image A3, and the description information of the first frame of the first animation effect.

[0272] When generating display data corresponding to the second frame of the first animation effect, the application's rendering client thread may generate image B1 corresponding to control 1 in the second frame of the first animation effect and image B3 corresponding to control 3 in the second frame of the first animation effect, and send image B1, image B3, and description information of the second frame of the first animation effect to the rendering process. The rendering process may generate display data corresponding to the second frame of the first animation effect based on image B1, image A2, image B3, and the description information of the second frame of the first animation effect.

[0273] That is, control 1 in the second frame of the first animation effect corresponds to render node 1, control 2 in the second frame of the first animation effect corresponds to render node 2, and control 3 in the second frame of the first animation effect corresponds to render node 3. Render nodes 1 and 3 are first render nodes, and images B1 and B3 are first-type images. The image corresponding to render node 1 is updated from image A1 to image B1, and the image corresponding to render node 3 is updated from image A3 to image B3. Render node 2 is the second render node, and image A2 is a second-type image. The image corresponding to render node 2 still reuses image A2.

[0274] Optionally, when the second attribute includes an attribute related to the position of a control, the rendering process updates the position of the rendering node in the first rendering tree according to the value of the attribute related to the position of each control in the Nth frame of the first animation effect.

[0275] Step B3: The rendering process pastes the first type of image at the position of the first rendering node and pastes the second type of image at the position of the second rendering node to generate display data of the Nth frame of the first animation effect.

[0276] For example, in the first animation effect, the position of control 1 changes from (x0, y0) to (x1, y1). If the duration of the first animation effect is 30 frames, the position of control 1 in the Nth frame interface of the first animation effect is (x0+N*δX, y0+N*δY), where δX=(x1-x0) / 30 and δY=(y1-y0) / 30. The rendering process can paste the image corresponding to control 1 in the Nth frame interface of the first animation effect at (x0+N*δX, y0+N*δY) on the Nth frame interface of the first animation effect.

[0277] See Figure 13 , is a flow chart of another method for displaying animation effects provided in an embodiment of the present application. The specific process of the method for displaying animation effects is described as follows.

[0278] S1301: After receiving an animation triggering event, the application process determines first information according to description information of a first animation effect, and sends the first information to a rendering process.

[0279] In the embodiment of the present application, the S1301 may refer to the above-mentioned S601 and will not be described in detail here.

[0280] S1302: After not receiving the first information from the application process, the rendering process generates display data of the Nth frame of the first animation effect according to the description information of the N-1th frame of the first animation effect and the image corresponding to at least one control in the N-1th frame.

[0281] In an embodiment of the present application, the rendering process can generate display data of the Nth frame of the first animation effect based on the description information of the N-1th frame of the first animation effect and the image corresponding to at least one control in the N-1th frame after not receiving the first information from the application process.

[0282] In one possible implementation, the rendering process may determine whether the first information is received from the application process within a first duration. If the first information is not received from the application process within the first duration, the rendering process may generate display data for the Nth frame of the first animation effect based on the description information of the N-1th frame of the first animation effect and the image corresponding to at least one control in the N-1th frame of the first animation effect.

[0283] Among them, the starting time point of the first duration can be the time point when the rendering process receives the vertical synchronization signal corresponding to the Nth frame of the first animation effect. The rendering process can determine the frame number of the first animation effect corresponding to the currently received vertical synchronization signal through various methods such as the number of vertical synchronization signals that have been received and the time in the vertical synchronization signal, and the embodiments of the present application are not limited here. For example, the first vertical synchronization signal received corresponds to the first frame of the first animation effect, the second vertical synchronization signal received corresponds to the second frame of the first animation effect, and so on. Determining the frame number of the first animation effect corresponding to the currently received vertical synchronization signal can be understood as determining that the current frame is the frame number of the first animation effect.

[0284] The duration of the first duration may be pre-configured, or may be defined by a standard, or may be agreed upon in advance by the application process and the rendering process, which is not limited in this embodiment of the present application.

[0285] The format of the image corresponding to the at least one control in the N-1th frame of the first animation effect may be a format supported by the GPU of the electronic device, for example, hardware image, ASTC, etc.

[0286] It can be understood that if the rendering process does not receive the description information of the Nth frame of the first animation effect and the image corresponding to at least one control in the Nth frame of the first animation effect from the application process within the first time period after receiving the vertical synchronization signal corresponding to the Nth frame of the first animation effect, the rendering process can reuse the description information of the N-1th frame of the first animation effect and the image corresponding to at least one control in the N-1th frame of the first animation effect to generate the display data of the Nth frame of the first animation effect, and the display data of the Nth frame of the first animation effect finally generated is the same as the display data of the N-1th frame of the first animation effect generated previously.

[0287] In one possible implementation, Figure 14 As shown, the S1302 may include the following steps C1 to C3:

[0288] Step C1: after not receiving the first information from the application process, the rendering process determines the value of the second property of each control in the Nth frame of the first animation effect according to the description information of the N-1th frame of the first animation effect.

[0289] The step C1 may refer to the above-mentioned step B1 and will not be described in detail here.

[0290] Step C2: The rendering process updates the first rendering tree according to the value of the second attribute of each control in the Nth frame of the first animation effect.

[0291] The step C2 may refer to the above step B2 and will not be described in detail here.

[0292] The updated first rendering tree includes a third rendering node. The third rendering node corresponds to a third type of image, which is an image corresponding to at least one control in the N-1th frame of the first animation effect. In other words, the third type of image is an image corresponding to at least one control in the N-1th frame of the first animation effect used by the rendering process when generating display data for the N-1th frame of the first animation effect.

[0293] Step C3: The rendering process pastes the third type of image at the position of the third rendering node to generate display data of the Nth frame of the first animation effect.

[0294] The step C3 may refer to the above step B3 and will not be described in detail here.

[0295] See Figure 15 , is a flow chart of another method for displaying animation effects provided in an embodiment of the present application. The specific process of the method for displaying animation effects is described as follows.

[0296] S1501: After receiving an animation trigger event, the application process determines first information according to description information of a first animation effect, and sends the first information to a rendering process.

[0297] In the embodiment of the present application, the S1501 may refer to the above-mentioned S601 and will not be described in detail here.

[0298] S1502. After receiving the description information of the Nth frame of the first animation effect from the application process and not receiving the image corresponding to at least one control in the Nth frame of the first animation effect from the application process, the rendering process generates display data of the Nth frame of the first animation effect based on the description information of the Nth frame of the first animation effect and the image corresponding to at least one control in the N-1th frame of the first animation effect.

[0299] In an embodiment of the present application, the rendering process can generate display data of the Nth frame of the first animation effect based on the description information of the Nth frame of the first animation effect and the image corresponding to at least one control in the N-1th frame of the first animation effect after receiving the description information of the Nth frame of the first animation effect from the application process and not receiving the image corresponding to at least one control in the Nth frame of the first animation effect from the application process.

[0300] In one possible implementation, the rendering process may determine whether the first information is received from the application process within a first duration. If the first information is not received from the application process within the first duration, the rendering process may generate display data for the Nth frame of the first animation effect based on the description information of the Nth frame of the first animation effect and the image corresponding to at least one control in the N-1th frame of the first animation effect.

[0301] Among them, the starting time point of the first duration can be the time point when the rendering process receives the vertical synchronization signal corresponding to the Nth frame of the first animation effect. The rendering process can determine the frame number of the first animation effect corresponding to the currently received vertical synchronization signal through various methods such as the number of vertical synchronization signals that have been received and the time in the vertical synchronization signal, and the embodiments of the present application are not limited here. For example, the first vertical synchronization signal received corresponds to the first frame of the first animation effect, the second vertical synchronization signal received corresponds to the second frame of the first animation effect, and so on. Determining the frame number of the first animation effect corresponding to the currently received vertical synchronization signal can be understood as determining that the current frame is the frame number of the first animation effect.

[0302] The duration of the first duration may be pre-configured, or may be defined by a standard, or may be agreed upon in advance by the application process and the rendering process, which is not limited in this embodiment of the present application.

[0303] The format of the image corresponding to the at least one control in the N-1th frame of the first animation effect may be a format supported by the GPU of the electronic device, for example, hardware image, ASTC, etc.

[0304] It can be understood that if the rendering process only receives the description information of the Nth frame of the first animation effect from the application process within the first time period after receiving the vertical synchronization signal corresponding to the Nth frame of the first animation effect, and does not receive the image corresponding to at least one control in the Nth frame of the first animation effect from the application process, the rendering process can reuse the image corresponding to at least one control in the N-1th frame of the first animation effect to generate display data of the Nth frame of the first animation effect.

[0305] In one possible implementation, Figure 16 As shown, the S1502 may include the following steps D1 to D3:

[0306] Step D1: After receiving the description information of the Nth frame of the first animation effect from the application process and not receiving the image corresponding to at least one control in the Nth frame of the first animation effect from the application process, the rendering process determines the value of the second attribute of each control in the Nth frame of the first animation effect based on the description information of the Nth frame of the first animation effect.

[0307] The step D1 may refer to the above-mentioned step B1 and will not be described in detail here.

[0308] Step D2: The rendering process updates the first rendering tree according to the value of the second attribute of each control in the Nth frame of the first animation effect.

[0309] The step D2 may refer to the above step B2 and will not be described in detail here.

[0310] The updated first rendering tree includes a third rendering node. The third rendering node corresponds to a third type of image, which is an image corresponding to at least one control in the N-1th frame of the first animation effect. In other words, the third type of image is an image corresponding to at least one control in the N-1th frame of the first animation effect used by the rendering process when generating display data for the N-1th frame of the first animation effect.

[0311] Step D3: The rendering process pastes the third type of image at the location of the third rendering node to generate display data of the Nth frame of the first animation effect.

[0312] The step D3 may refer to the above step B3 and will not be described in detail here.

[0313] See Figure 17 , is a flow chart of another method for displaying animation effects provided in an embodiment of the present application. The specific process of the method for displaying animation effects is described as follows.

[0314] S1701: After receiving an animation trigger event, the application process determines first information according to description information of a first animation effect, and sends the first information to a rendering process.

[0315] In the embodiment of the present application, the S1701 may refer to the above-mentioned S601 and will not be repeated here.

[0316] S1702. After receiving an image corresponding to at least one control in the Nth frame of the first animation effect from the application process and not receiving description information of the Nth frame of the first animation effect from the application process, the rendering process generates display data of the Nth frame of the first animation effect based on the description information of the N-1th frame of the first animation effect and the image corresponding to at least one control in the Nth frame of the first animation effect.

[0317] In an embodiment of the present application, the rendering process can generate display data of the Nth frame of the first animation effect based on the description information of the N-1th frame of the first animation effect and the image corresponding to at least one control in the Nth frame of the first animation effect after receiving an image corresponding to at least one control in the Nth frame of the first animation effect from the application process and not receiving the description information of the Nth frame of the first animation effect from the application process.

[0318] In one possible implementation, the rendering process may determine whether the first information is received from the application process within a first time period, and after receiving an image corresponding to at least one control in the Nth frame of the first animation effect from the application process and not receiving description information of the Nth frame of the first animation effect from the application process, generate display data of the Nth frame of the first animation effect based on the description information of the N-1th frame of the first animation effect and the image corresponding to at least one control in the Nth frame of the first animation effect.

[0319] Among them, the starting time point of the first duration can be the time point when the rendering process receives the vertical synchronization signal corresponding to the Nth frame of the first animation effect. The rendering process can determine the frame number of the first animation effect corresponding to the currently received vertical synchronization signal through various methods such as the number of vertical synchronization signals that have been received and the time in the vertical synchronization signal, and the embodiments of the present application are not limited here. For example, the first vertical synchronization signal received corresponds to the first frame of the first animation effect, the second vertical synchronization signal received corresponds to the second frame of the first animation effect, and so on. Determining the frame number of the first animation effect corresponding to the currently received vertical synchronization signal can be understood as determining that the current frame is the frame number of the first animation effect.

[0320] The duration of the first duration may be pre-configured, or may be defined by a standard, or may be agreed upon in advance by the application process and the rendering process, which is not limited in this embodiment of the present application.

[0321] The format of the image corresponding to the at least one control in the Nth frame of the first animation effect may be a format supported by the GPU of the electronic device, for example, hardware image, ASTC, etc.

[0322] It can be understood that if the rendering process only receives the image corresponding to at least one control in the Nth frame of the first animation effect from the application process within the first time period after receiving the vertical synchronization signal corresponding to the Nth frame of the first animation effect, and does not receive the description information of the Nth frame of the first animation effect from the application process, then the rendering process can reuse the description information of the N-1th frame of the first animation effect to generate display data of the Nth frame of the first animation effect.

[0323] In one possible implementation, Figure 18As shown, the S1702 may include the following steps E1 to E3:

[0324] Step E1: After receiving an image corresponding to at least one control in the Nth frame of the first animation effect from the application process within the first time period and not receiving description information of the Nth frame of the first animation effect from the application process, the rendering process determines the value of the second attribute of each control in the Nth frame of the first animation effect based on the description information of the N-1th frame of the first animation effect.

[0325] The step E1 may refer to the above-mentioned step B1 and will not be described in detail here.

[0326] Step E2: The rendering process updates the first rendering tree according to the value of the second attribute of each control in the Nth frame of the first animation effect.

[0327] The step E2 may refer to the above-mentioned step B2 and will not be described in detail here.

[0328] Step E3: The rendering process pastes the first type of image at the position of the first rendering node and pastes the second type of image at the position of the second rendering node to generate display data of the Nth frame of the first animation effect.

[0329] The step E3 may refer to the above-mentioned step B3 and will not be described in detail here.

[0330] Based on the above embodiments and the same concept, an embodiment of the present application further provides an electronic device, which is used to implement the display method of the animation effect provided by the embodiment of the present application.

[0331] like Figure 19 As shown, electronic device 1900 may include: memory 1901, one or more processors 1902, and one or more computer programs (not shown). The above-mentioned components may be coupled via one or more communication buses 1903. Optionally, when electronic device 1900 is used to implement the display method of the animation effect provided in the embodiment of the present application, electronic device 1900 may also include a display screen 1904.

[0332] Memory 1901 stores one or more computer programs (codes), each of which includes computer instructions. One or more processors 1902 invoke the computer instructions stored in memory 1901, causing electronic device 1900 to execute the animation effect display method provided in the embodiments of the present application. Display screen 1904 is used to display images, videos, application interfaces, and other related user interfaces.

[0333] In a specific implementation, the memory 1901 may include a high-speed random access memory, and may also include a non-volatile memory, such as one or more disk storage devices, flash memory devices or other non-volatile solid-state storage devices. The memory 1901 can store an operating system (hereinafter referred to as system), such as ANDROID, IOS, WINDOWS, or embedded operating systems such as LINUX. The memory 1901 can be used to store the implementation program of the embodiment of the present application. The memory 1901 can also store a network communication program, which can be used to communicate with one or more additional devices, one or more user devices, or one or more electronic devices. The one or more processors 1902 can be a general-purpose central processing unit (CPU), a microprocessor, an application-specific integrated circuit (ASIC), or one or more integrated circuits for controlling the execution of the program of the present application.

[0334] It should be noted that Figure 19 This is only one implementation of the electronic device 1900 provided in the embodiment of the present application. In actual applications, the electronic device 1900 may also include more or fewer components, which is not limited here.

[0335] Based on the above embodiments and the same concept, an embodiment of the present application also provides a computer-readable storage medium, which stores a computer program. When the computer program runs on a computer, the computer executes the animation effect display method provided in the above embodiments.

[0336] Based on the above embodiments and the same concept, an embodiment of the present application also provides a computer program product, which includes a computer program or instructions. When the computer program or instructions are run on a computer, the computer executes the animation effect display method provided in the above embodiments.

[0337] Those skilled in the art will appreciate that the embodiments of the present application can be provided as methods, systems, or computer program products. Therefore, the present application can adopt the form of a complete hardware embodiment, a complete software embodiment, or an embodiment in combination with software and hardware. Moreover, the present application can adopt the form of a computer program product implemented on one or more computer-usable storage media (including but not limited to magnetic disk storage, CD-ROM, optical storage, etc.) that contain computer-usable program code.

[0338] The present application is described with reference to the flowcharts and / or block diagrams of the methods, devices (systems), and computer program products according to the present application. It should be understood that each process and / or block in the flowchart and / or block diagram, as well as the combination of processes and / or blocks in the flowchart and / or block diagram, can be implemented by computer program instructions. These computer program instructions can be provided to a processor of a general-purpose computer, a special-purpose computer, an embedded processor, or other programmable data processing device to produce a machine, so that the instructions executed by the processor of the computer or other programmable data processing device generate instructions for implementing the processes in the flowchart and / or block diagram. Figure 1 a process or multiple processes and / or boxes Figure 1 A device that provides the functions specified in a block or multiple blocks.

[0339] These computer program instructions may also be stored in a computer readable memory that can direct a computer or other programmable data processing device to work in a specific manner, so that the instructions stored in the computer readable memory produce an article of manufacture comprising an instruction device, which implements the process Figure 1 a process or multiple processes and / or boxes Figure 1 The function specified in one or more boxes.

[0340] These computer program instructions can also be loaded onto a computer or other programmable data processing device so that a series of operational steps are executed on the computer or other programmable device to produce a computer-implemented process, thereby providing the instructions executed on the computer or other programmable device for implementing the process. Figure 1 a process or multiple processes and / or boxes Figure 1 The steps for the function specified in one or more boxes.

[0341] Obviously, those skilled in the art may make various changes and modifications to this application without departing from the spirit and scope of this application. Thus, if these modifications and variations of this application fall within the scope of the claims of this application and their equivalents, this application is intended to include these modifications and variations.

Claims

1. A method for displaying animation effects, characterized in that: Applied to electronic equipment, the method includes: After receiving the animation trigger event, the application process of the application determines first information based on the description information of the first animation effect and sends the first information to the rendering process; wherein the animation trigger event is used to trigger display of the first animation effect, the first animation effect includes M frames, and the first information includes description information of the Nth frame of the first animation effect and an image corresponding to at least one control in the Nth frame, where M is a positive integer and N is a positive integer less than or equal to M; After receiving the first information from the application process, the rendering process generates display data of the Nth frame of the first animation effect according to the first information.

2. The method according to claim 1, wherein The application process includes a UI thread of the application and a rendering client thread of the application. The application process determines the first information according to the description information of the first animation effect, including: The UI thread determines, according to the description information of the first animation effect, a time corresponding to a start frame of the first animation effect, a time corresponding to an end frame of the first animation effect, and description information of the end frame; Upon receiving the vertical synchronization signal corresponding to the Nth frame, the UI thread or the rendering client thread determines the description information of the Nth frame according to the time corresponding to the start frame, the time corresponding to the end frame, the description information of the end frame, and the time corresponding to the Nth frame; The rendering client thread determines a value of a first property of the at least one control according to the description information of the Nth frame, and determines an image corresponding to the at least one control according to the value of the first property of the at least one control.

3. The method according to claim 2, wherein When N is equal to 1, the at least one control is a control among all controls in the Nth frame; or, When N is greater than or equal to 2, the at least one control is a control whose value of the first attribute changes in the Nth frame compared to the N-1th frame of the first animation effect, and / or a control newly added in the Nth frame compared to the N-1th frame.

4. The method according to claim 2 or 3, wherein: The first attribute includes an attribute related to the content carried by the control; and / or, The first properties include properties related to the appearance of the control.

5. The method according to any one of claims 1 to 4, characterized in that: The rendering process generates display data of the Nth frame of the first animation effect according to the first information, including: The rendering process determines, according to the description information of the Nth frame, a value of a second attribute of each control in the Nth frame; The rendering process updates a first rendering tree according to the value of the second attribute of each control; wherein the updated first rendering tree includes a first rendering node and a second rendering node, the first rendering node corresponds to a first type of image, and the second rendering node corresponds to a second type of image, the second type of image being an image corresponding to a control whose value of the first attribute has not changed compared to the N-1 frame of the first animation effect in the N-th frame, the first type of image being an image corresponding to a control whose value of the first attribute has changed compared to the N-1 frame in the N-th frame, and / or an image corresponding to a newly added control in the N-th frame compared to the N-1 frame; The rendering process pastes the first type of image at the position of the first rendering node and pastes the second type of image at the position of the second rendering node to generate display data of the Nth frame of the first animation effect.

6. The method according to claim 5, wherein The second attribute includes an attribute related to a position of the control, and the rendering process updates the first rendering tree according to a value of the second attribute of each control, including: The rendering process updates the position of the rendering node in the first rendering tree according to the value of the property related to the position of each control.

7. The method according to claim 6, wherein The method further comprises: After not receiving the first information from the application process, the rendering process generates display data of the Nth frame of the first animation effect according to the description information of the N-1th frame of the first animation effect and the image corresponding to at least one control in the N-1th frame; or After receiving the description information of the Nth frame from the application process and not receiving the image corresponding to at least one control in the Nth frame from the application process, the rendering process generates display data of the Nth frame of the first animation effect according to the description information of the Nth frame and the image corresponding to at least one control in the N-1th frame of the first animation effect; or, After receiving an image corresponding to at least one control in the Nth frame from the application process and not receiving description information of the Nth frame from the application process, the rendering process generates display data of the Nth frame of the first animation effect based on the description information of the N-1th frame of the first animation effect and the image corresponding to at least one control in the Nth frame.

8. The method according to any one of claims 1 to 7, wherein: Before the rendering process generates display data of the Nth frame of the first animation effect, the method further includes: The rendering process determines whether the first information is received from the application process within a first duration; wherein the starting time point of the first duration is the time point when the rendering process receives the vertical synchronization signal corresponding to the Nth frame.

9. The method according to any one of claims 1 to 8, wherein: The format of the image is a format supported by a graphics processor (GPU) of the electronic device.

10. An electronic device, characterized in that: The electronic device includes: one or more processors and memory; The memory is coupled to the one or more processors, and is configured to store computer program codes, where the computer program codes include computer instructions. The one or more processors call the computer instructions to enable the electronic device to execute the method according to any one of claims 1 to 9.

11. A chip system, characterized in that: The chip system is applied to an electronic device, and the chip system includes one or more processors, and the processor is used to call computer instructions to enable the electronic device to execute the method as described in any one of claims 1-9.

12. A computer-readable storage medium comprising instructions, characterized in that: When the instructions are executed on an electronic device, the electronic device is caused to execute the method according to any one of claims 1 to 9.

13. A computer program product, characterized in that The method comprises computer-readable instructions which, when executed by one or more processors, implement the method of any one of claims 1 to 9.

Images