Interface display method and electronic equipment

By identifying and stopping animation playback of non-sensitive animation elements, electronic devices can reduce power consumption when displaying user interfaces, solving the problem of high power consumption when displaying multi-animation elements.

CN119937757APending Publication Date: 2025-05-06HONOR DEVICE CO LTD

Patent Information

Application Number
CN202311422184.6
Authority / Receiving Office
CN · China
Patent Type
Applications(China)
Current Assignee / Owner
Filing Date
2023-10-27
Publication Date
2025-05-06

AI Technical Summary

Technical Problem

When an electronic device displays a user interface containing multiple animation elements, it consumes a high power, especially when there are many animation elements, resulting in rapid power consumption.

Method used

Reduce the number of animation elements drawn and rendered by identifying non-sensitive animation elements in the user interface and stopping their animation playback when displayed, so that they continue to display the same frame of images.

Benefits of technology

It reduces the power consumption when displaying a user interface containing animation elements, extends the usage time of electronic devices, and does not affect the normal use of the user interface and visual experience.

✦ Generated by Eureka AI based on patent content.

Smart Images

  • Figure CN119937757A_ABST
    Figure CN119937757A_ABST
Patent Text Reader

Abstract

The embodiment of the invention provides an interface display method and device. The method comprises the steps that an access request of a target interface is received; in response to the access request, determining a first type of animation elements from the elements of the target interface; and displaying the target interface, wherein the first type of animation elements in the target interface are displayed in a manner of continuously displaying the same frame of image. The embodiment of the invention can reduce the power consumption when the electronic equipment displays the user interface containing the first type of animation elements.
Need to check novelty before this filing date? Find Prior Art

Description

Technical Field

[0001] The present application relates to the technical field of intelligent terminals, and in particular to an interface display method and an electronic device. Background Art

[0002] A user interface (UI) displayed in an electronic device may include a variety of elements, thereby providing intuitive information to the user through various elements. The elements in the user interface can be divided into animated elements and non-animated elements.

[0003] When an electronic device displays a user interface, for the animation elements in the user interface, the electronic device needs to draw, render, and display each image frame of the animation elements at a certain frame rate (such as the device's default frame rate) to achieve the display effect of the electronic device playing the animation elements.

[0004] However, if the user interface includes animation elements, especially multiple animation elements, the electronic device needs to draw, render, and display each image frame of the animation element in the target interface according to a certain frame rate, which makes the electronic device consume higher power when displaying the user interface including animation elements. Summary of the invention

[0005] The embodiments of the present application provide a method for displaying an interface and an electronic device, which can reduce the power consumption of the electronic device when displaying a user interface containing animation elements.

[0006] In a first aspect, an embodiment of the present application provides an interface display method, which is applied to an electronic device, and the method includes: receiving an access request for a target interface; in response to the access request, determining a first type of animation element from the elements of the target interface; displaying the target interface, and the first type of animation element in the target interface is displayed in a manner of continuously displaying the same frame of image. The above-mentioned first type of animation element may be a non-sensitive animation element in a subsequent embodiment. In this method, the electronic device only needs to draw and render one frame of image of the first type of animation element, which reduces the number of drawing and rendering times of the first type of animation element, thereby reducing the power consumption of displaying the first type of animation element and reducing the power consumption of displaying the target interface.

[0007] Optionally, the target interface is displayed, and the first type of animation elements in the target interface are displayed in a manner of continuously displaying the same frame image, including: for each frame interface image of the target interface, obtaining the attribute value of the first type of animation element in the frame interface image; when the attribute value of the first type of animation element in the frame interface image is different from the target attribute value of the first type of animation element, updating the attribute value of the first type of animation element in the frame interface image to the target attribute value; and displaying the frame interface image of the target interface according to the updated attribute value of the first type of animation element.

[0008] Optionally, it also includes: when the attribute value of the first type of animation element in the frame interface image is the same as the target attribute value of the first type of animation element, the frame interface image of the target interface is displayed according to the attribute value of the first type of animation element in the frame interface image.

[0009] Optionally, the first type of animation elements are displayed in a manner of continuously displaying a same frame image, including: the first type of animation elements are displayed in a manner of continuously displaying a first frame image of the first type of animation elements.

[0010] Optionally, the target interface is displayed, and the first type of animation elements in the target interface are displayed in a manner of continuously displaying the same frame image, including: for the first frame interface image of the target interface, displaying the first frame interface image of the target interface according to the attribute values ​​of the first type of animation elements in the first frame interface image; for non-first frame interface images of the target interface, obtaining the attribute values ​​of the first type of animation elements in the frame interface image, and updating the attribute values ​​of the first type of animation elements in the frame interface image to the attribute values ​​of the first type of animation elements in the first frame interface image; and displaying the frame interface image of the target interface according to the updated attribute values ​​of the first type of animation elements.

[0011] Optionally, determining the first type of animation elements from the elements of the target interface includes: obtaining the type of each element in the target interface; and determining the elements of the target interface that are of a preset type as the first type of animation elements.

[0012] Optionally, determining the first category of animation elements from the elements of the target interface includes: obtaining the type and display area size of each element in the target interface; and determining the elements of the target interface whose type is a preset type and whose display area size is less than a preset size threshold as the first category of animation elements.

[0013] Optionally, before displaying the target interface, the method further includes:

[0014] Determining that a power saving mode of the electronic device is activated; or,

[0015] Determine that the power saving mode displayed on the interface is activated; or,

[0016] Determining that the power level of the electronic device is not higher than a preset power threshold; or,

[0017] Determining that the real time is within a preset time threshold; or,

[0018] Determine whether the user's usage habits meet the preset trigger conditions.

[0019] Optionally, the first type of animation element includes at least one of the following types of animation elements: rotation animation element, translation animation element, zoom animation element, gradient animation element

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

[0021] In a second aspect, an embodiment of the present application provides a computer-readable storage medium, in which a computer program is stored. When the computer-readable storage medium is run on a computer, the computer executes any one of the methods of the first aspect. BRIEF DESCRIPTION OF THE DRAWINGS

[0022] In order to more clearly illustrate the technical solutions of the embodiments of the present application, the drawings required for use in the embodiments will be briefly introduced below. Obviously, the drawings described below are only some embodiments of the present application. For ordinary technicians in this field, other drawings can be obtained based on these drawings without paying creative work.

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

[0024] Figure 1B A schematic diagram of a software structure of an electronic device provided in an embodiment of the present application;

[0025] Figure 2 A schematic diagram of an interface implementation for displaying a power saving mode in a settings interface provided in an embodiment of the present application;

[0026] Figure 3A A schematic diagram of the interface implementation of the mobile phone desktop in the related technology provided in the embodiment of the present application;

[0027] Figure 3B This is a schematic diagram of the interface display of the mobile phone desktop in the interface display method of the embodiment of the present application;

[0028] Figure 4A A schematic diagram of an interface implementation of a short video APP user interface in the related art provided in an embodiment of the present application;

[0029] Figure 4B This is a schematic diagram of the interface implementation of the user interface of the short video APP in the interface display method of the embodiment of the present application;

[0030] Figure 5A A schematic diagram of the interface implementation of the home page of the search engine APP in the related technology provided in the embodiment of the present application;

[0031] Figure 5B This is a schematic diagram of the interface implementation of the home page of the search engine APP in the interface display method of the embodiment of the present application;

[0032] Fig. 6A A schematic diagram of an interface implementation of a video playback interface of a video APP in the related art provided in an embodiment of the present application;

[0033] Figure 6B This is a schematic diagram of the interface implementation of the video playback interface of the video APP in the interface display method of the embodiment of the present application;

[0034] Fig. 7A A schematic diagram of the interface implementation of the main interface of the video APP in the related technology provided in the embodiment of the present application;

[0035] Figure 7B This is a schematic diagram of the interface implementation of the main interface of the video APP in the interface display method of the embodiment of the present application;

[0036] Fig. 8A A schematic diagram of an interface implementation of an application setting interface in the related technology provided in an embodiment of the present application;

[0037] Figure 8B This is a schematic diagram of an interface implementation of an application setting interface in the interface display method of an embodiment of the present application;

[0038] Fig. 9A A schematic diagram of an interface implementation of a mobile phone search interface of an electronic shopping mall application in the related technology provided in an embodiment of the present application;

[0039] Fig. 9B This is a schematic diagram of the interface implementation of the mobile phone search interface of the electronic shopping mall application in the interface display method of the embodiment of the present application;

[0040] Fig. 10A A schematic diagram of an interface implementation of a scanning interface when scanning a QR code in the related art provided in an embodiment of the present application;

[0041] Fig. 10B This is a schematic diagram of the interface implementation of the scanning interface when scanning a QR code in the interface display method of the embodiment of the present application;

[0042] Fig.11A A schematic diagram of the implementation of the red envelope interface provided in the embodiment of the present application;

[0043] Fig. 11B This is another interface implementation schematic diagram of the user interface of the short video APP in the interface display method of the embodiment of the present application;

[0044] Fig.12 A schematic diagram of the structure of another electronic device provided in an embodiment of the present application;

[0045] Fig.13 A schematic diagram of the principle of determining a drawing rendering area based on a drawing tree provided in an embodiment of the present application;

[0046] Fig.14 A schematic diagram of an implementation structure of a drawing tree of a target interface provided in an embodiment of the present application;

[0047] Fig.15 A flowchart of an interface display method provided in an embodiment of the present application. DETAILED DESCRIPTION

[0048] The terms used in the implementation section of this application are only used to explain the specific embodiments of this application and are not intended to limit this application.

[0049] The user interface (UI) displayed in an electronic device may include a variety of elements, which can be specifically divided into animated elements and non-animated elements. Animated elements refer to elements with dynamic effects. In other words, the displayed content of animated elements changes over time during the display process. Non-animated elements refer to elements other than animated elements and do not have dynamic effects. In other words, the displayed content of non-animated elements remains unchanged during the display process.

[0050] For example, the user interface may be the desktop of an electronic device or an interface displayed by an application in the electronic device, etc. In some related technologies, the desktop of an electronic device may also be considered as an interface displayed by a system application of the electronic device.

[0051] For example, the desktop of an electronic device may include animated elements and non-animated elements. The animated elements may include dynamic icons, animated components, animated backgrounds, etc., and the non-animated elements may include static icons, static components, static backgrounds, etc.

[0052] Among them, the dynamic icon in the electronic device desktop can be, for example, a clock icon displayed on the electronic device desktop. When the desktop includes a clock icon, the electronic device draws and plays the clock icon at the device's default frame rate, and in the user's visible dimension, the second hand, minute hand, and hour hand in the clock icon are continuously updated and played. Alternatively, the dynamic icon in the electronic device desktop can be, for example, an application (APP) icon with animation effects displayed on the electronic device desktop. When the desktop includes an APP icon with animation effects, the electronic device draws and plays the APP icon at the device's default frame rate, and in the user's visible dimension, the animation effect of the APP icon is continuously updated and played.

[0053] The animation component in the electronic device desktop can be, for example, a small animation component displayed on the electronic device desktop. Exemplarily, the small animation component can be a weather forecast component, and the electronic device draws and plays the weather forecast component at the device default frame rate. In the user-visible dimension, the weather forecast component updates the temperature value over time. Exemplarily, the small animation component can also be a music player component, and the electronic device draws and plays the music player component at the device default frame rate. In the user-visible dimension, the music player component rotates the record picture displayed in the component at a certain speed to indicate that music is playing.

[0054] The animated background in the electronic device desktop can be, for example, a dynamic wallpaper on the electronic device desktop. Exemplarily, the electronic device draws and plays the dynamic wallpaper at the device default frame rate, and in the user's visible dimension, the dynamic wallpaper on the desktop continuously updates and plays its dynamic display effect.

[0055] For example, the interfaces displayed by some APPs may include animated elements and non-animated elements. The animated elements may include videos, animated components, animated backgrounds, etc., and the non-animated elements may include pictures, texts, static backgrounds, etc.

[0056] The video may be a video played on the display interface of a video APP or a short video APP, and the electronic device draws the played video at the device's default frame rate. In the user's visible dimension, the played video is continuously updated on the display interface of the electronic device.

[0057] The animation component can be an animation component specified in the display interface of the APP, such as the background music source that scrolls in a video APP or a short video APP, the record icon that rotates, and so on. The animation component can also be an animation component specified in the display interface of the map APP, such as the speeding reminder component, construction road condition reminder component, speed limit reminder component, lane change reminder component, road exit reminder, and other reminder animation components in the navigation interface. The electronic device draws and plays various reminder animation components at the device's default frame rate. In the user's visible dimension, when the user is about to drive to a specified position that includes a reminder animation component, the electronic device displays the corresponding reminder animation component at an adaptive position on the navigation interface. After passing the specified position, the electronic device no longer displays the reminder animation component on the navigation interface.

[0058] The animated background can be a dynamic wallpaper of the display interface of the APP. The electronic device draws and plays the dynamic wallpaper at the device's default frame rate. In the user's visible dimension, the dynamic wallpaper of the display interface of the APP continuously updates and plays its dynamic display effect.

[0059] When an electronic device displays a user interface, it needs to perform drawing operations on the animation elements and non-animation elements included in the user interface. For animation elements, since the display content is constantly changing, the electronic device needs to continuously draw, render, and display each image frame of the animation element according to the device's default frame rate to achieve the display effect of refreshing and playing the animation elements; while for non-animation elements, they only need to be drawn once, and there is no need to repeatedly draw them according to the default frame rate. It can be seen that electronic devices consume more power when displaying animation elements than non-animation elements.

[0060] Therefore, if the user interface includes animation elements, the power consumption of the electronic device when displaying the user interface is relatively high. In particular, when the user interface includes a large number of animation elements, the power consumption of the electronic device for displaying the animation elements in the user interface will be higher.

[0061] In fact, among the animation elements included in the user interface, there are some animation elements that users pay little attention to or even do not pay attention to when using the user interface, and they have no effect on the user's operations in the user interface. In other words, there are some animation elements that belong to accompanying animations. From the perspective of the functions carried by the user, the purpose of setting them in the user interface is mainly to enhance the user's viewing experience. They do not carry specific functions and have no effect on the functional operations performed by the user in the user interface. In other words, even if the animation of the above animation elements stops, it will not affect the user's use of the user interface. From the perspective of pursuing reduced power consumption, or for users who do not pursue such a viewing experience, electronic devices displaying such animation elements on the user interface will cause unnecessary power consumption waste.

[0062] Taking the animated icon of the APP on the device desktop as an example, when the user browses the device desktop, the user rarely pays attention to the dynamic changes of the animated icon on the desktop, and whether the icon is an animated icon does not affect the user's launching of the corresponding APP on the device desktop.

[0063] Another example is the record icon that rotates on the display interface of a short video APP. For users, when browsing the interface of the short video APP, they seldom pay attention to the rotation of the record icon, and whether the record icon is animated does not affect the user's triggering of the icon function of the record icon.

[0064] In the embodiment of the present application, the animation elements that are not of high concern to the user, or that the user will not pay attention to, or that will not affect the user's functional operation in the user interface are called non-sensitive animation elements. The animation elements that are of high concern to the user or that affect the user's functional operation in the user interface are called sensitive animation elements.

[0065] In order to reduce the power consumption of an electronic device when displaying a user interface including animation elements, an embodiment of the present application provides an interface display method and device. When displaying the user interface, sensitive animation elements and non-animation elements in the user interface are displayed normally, while for non-sensitive animation elements in the user interface, the animation playback is stopped, so that the non-sensitive animation elements are displayed in a manner of continuously displaying the same frame image. In the user's visible dimension, when the user opens the user interface, the animation elements that the user is concerned about are played normally, and other elements including non-sensitive animation elements are displayed as non-animation elements, and the displayed image does not change.

[0066] The interface display method provided in the embodiments of the present application can be applied to portable computers (e.g., mobile phones), tablet computers, laptop computers, personal computers (PCs), wearable electronic devices (e.g., smart watches), augmented reality (AR) and virtual reality (VR) devices, in-vehicle computers, and other electronic devices with display screens, and the embodiments of the present application do not impose any restrictions on this.

[0067] Figure 1A A schematic diagram of the structure of an electronic device 100 provided in an embodiment of the present application. The electronic device 100 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.

[0068] It is to be understood that the structure illustrated in the embodiment of the present invention does not constitute a specific limitation on the electronic device 100. In other embodiments of the present application, the electronic device 100 may include more or fewer components than shown in the figure, or combine some components, or separate some components, or arrange the components differently. The components shown in the figure may be implemented in hardware, software, or a combination of software and hardware.

[0069] 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 processor (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), etc. Different processing units may be independent devices or integrated into one or more processors.

[0070] 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.

[0071] The processor 110 may also be provided with a memory for storing instructions and data. In some embodiments, the memory in the processor 110 is a cache memory. The memory may store instructions or data that the processor 110 has just used or cyclically used. If the processor 110 needs to use the instruction or data again, it may be directly called from the memory. This avoids repeated access, reduces the waiting time of the processor 110, and thus improves the efficiency of the system.

[0072] In some embodiments, the processor 110 may include one or more interfaces. The interface 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, etc.

[0073] The I2C interface is a bidirectional synchronous serial bus, including a serial data line (SDA) and a serial clock line (SCL). In some embodiments, the processor 110 may include multiple groups of I2C buses. The processor 110 may be coupled to the touch sensor 180K, the charger, the flash, the camera 193, etc. through different I2C bus interfaces. For example: the processor 110 may be coupled to the touch sensor 180K through the I2C interface, so that the processor 110 communicates with the touch sensor 180K through the I2C bus interface, thereby realizing the touch function of the electronic device 100.

[0074] 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 achieve communication between the processor 110 and the audio module 170. In some embodiments, the audio module 170 can transmit an audio signal to the wireless communication module 160 via the I2S interface to achieve the function of answering a call through a Bluetooth headset.

[0075] 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 to realize the function of answering calls via a Bluetooth headset. Both the I2S interface and the PCM interface can be used for audio communication.

[0076] The UART interface is a universal serial data bus for asynchronous communication. The 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 generally 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 through the UART interface to implement the Bluetooth function. In some embodiments, the audio module 170 can transmit an audio signal to the wireless communication module 160 through the UART interface to implement the function of playing music through a Bluetooth headset.

[0077] The MIPI interface can be used to connect the processor 110 with peripheral devices such as the display screen 194 and the camera 193. The MIPI interface includes a camera serial interface (CSI), a display serial interface (DSI), etc. In some embodiments, the processor 110 and the camera 193 communicate via the CSI interface to implement the shooting function of the electronic device 100. The processor 110 and the display screen 194 communicate via the DSI interface to implement the display function of the electronic device 100.

[0078] The GPIO interface can be configured by software. The GPIO interface can be configured as a control signal or as a data signal. In some embodiments, the GPIO interface can be used to connect the processor 110 with the camera 193, the display 194, the wireless communication module 160, the audio module 170, the 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.

[0079] The USB interface 130 is an interface that complies with the USB standard specification, and specifically can be a Mini USB interface, a Micro USB interface, a USB Type C interface, etc. The USB interface 130 can be used to connect a charger to charge the electronic device 100, and can also be used to transfer data between the electronic device 100 and a peripheral device. It can also be used to connect headphones to play audio through the headphones. The interface can also be used to connect other electronic devices, such as AR devices, etc.

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

[0081] The charging management module 140 is used to receive charging input from a charger. The charger may be a wireless charger or a wired charger. In some wired charging embodiments, the charging management module 140 may receive charging input from a wired charger through the USB interface 130. In some wireless charging embodiments, the charging management module 140 may receive wireless charging input through a wireless charging coil of the electronic device 100. While the charging management module 140 is charging the battery 142, it may also power the electronic device through the power management module 141.

[0082] 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 supplies power to the processor 110, the internal memory 121, the display screen 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 number, battery health status (leakage, impedance), etc. 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.

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

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

[0085] The mobile communication module 150 can provide solutions for wireless communications including 2G / 3G / 4G / 5G, etc., applied to the electronic device 100. 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.

[0086] The modem processor may include a modulator and a demodulator. Among them, the modulator is used to modulate the low-frequency baseband signal to be sent 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 the low-frequency baseband signal is processed by the baseband processor, it is passed to the application processor. The application processor outputs a sound signal through an audio device (not limited to a speaker 170A, a receiver 170B, etc.), or displays an image or video through a 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.

[0087] The wireless communication module 160 can provide wireless communication solutions 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., which are applied to the electronic device 100. The wireless communication module 160 can be one or more devices integrating at least one communication processing module. The wireless communication module 160 receives electromagnetic waves via the antenna 2, modulates the frequency of the electromagnetic wave signal and performs filtering, and sends the processed signal to the processor 110. The wireless communication module 160 can also receive the signal to be sent from the processor 110, modulate the frequency of it, amplify it, and convert it into electromagnetic waves for radiation through the antenna 2.

[0088] In some embodiments, the antenna 1 of the electronic device 100 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 100 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 a global positioning system (GPS), a global navigation satellite system (GLONASS), a Beidou navigation satellite system (BDS), a quasi-zenith satellite system (QZSS) and / or a satellite based augmentation system (SBAS).

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

[0090] The display screen 194 is used to display images, videos, etc. The display screen 194 includes a display panel. The display panel can be a liquid crystal display (LCD), 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), Miniled, MicroLed, Micro-oLed, a quantum dot light-emitting diode (QLED), etc. In some embodiments, the electronic device 100 may include 1 or N display screens 194, where N is a positive integer greater than 1.

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

[0092] ISP is used to process the data fed back by camera 193. For example, when taking a photo, the shutter is opened, and the light is transmitted to the camera photosensitive element through the lens. The light signal is converted into an electrical signal, and the camera photosensitive element transmits the electrical signal to ISP for processing and converts it into an image visible to the naked eye. ISP can also perform algorithm optimization on the noise, brightness, and skin color of the image. ISP can also optimize the exposure, color temperature and other parameters of the shooting scene. In some embodiments, ISP can be set in camera 193.

[0093] 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 optical signal into an electrical signal, and then passes the electrical signal to the ISP to be converted 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 100 may include 1 or N cameras 193, where N is a positive integer greater than 1.

[0094] The digital signal processor is used to process digital signals, and can process not only digital image signals but also other digital signals. For example, when the electronic device 100 is selecting a frequency point, the digital signal processor is used to perform Fourier transform on the frequency point energy.

[0095] Video codecs are used to compress or decompress digital videos. The electronic device 100 may support one or more video codecs. Thus, the electronic device 100 may play or record videos in a variety of coding formats, such as Moving Picture Experts Group (MPEG) 1, MPEG2, MPEG3, MPEG4, etc.

[0096] NPU is a neural network (NN) computing processor. By drawing on the structure of biological neural networks, such as the transmission mode between neurons in the human brain, it can quickly process input information and can also continuously self-learn. Through NPU, applications such as intelligent cognition of electronic device 100 can be realized, such as image recognition, face recognition, voice recognition, text understanding, etc.

[0097] The external memory interface 120 can be used to connect an external memory card, such as a Micro SD card, to expand the storage capacity of the electronic device 100. The external memory card communicates with the processor 110 through the external memory interface 120 to implement a data storage function, such as storing music, video and other files in the external memory card.

[0098] The internal memory 121 can be used to store computer executable program codes, which include instructions. The internal memory 121 may include a program storage area and a data storage area. Among them, the program storage area may store an operating system, an application required for at least one function (such as a sound playback function, an image playback function, etc.), etc. The data storage area may store data created during the use of the electronic device 100 (such as audio data, a phone book, etc.), etc. In addition, the internal memory 121 may include a high-speed random access memory, and may also include a non-volatile memory, such as at least one disk storage device, a flash memory device, a universal flash storage (UFS), etc. The processor 110 executes various functional applications and data processing of the electronic device 100 by running instructions stored in the internal memory 121, and / or instructions stored in a memory provided in the processor.

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

[0100] 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 arranged in the processor 110, or some functional modules of the audio module 170 can be arranged in the processor 110.

[0101] The speaker 170A, also called a "speaker", is used to convert an audio electrical signal into a sound signal. The electronic device 100 can listen to music or listen to a hands-free call through the speaker 170A.

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

[0103] Microphone 170C, also called "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 microphone 170C to input the sound signal into microphone 170C. The electronic device 100 can be provided with at least one microphone 170C. In other embodiments, the electronic device 100 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 100 can also be provided with three, four or more microphones 170C to collect sound signals, reduce noise, identify the sound source, realize directional recording function, etc.

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

[0105] The sensor module 180 may include a pressure sensor, a gyro sensor, an air pressure sensor, a magnetic sensor, an acceleration sensor, a distance sensor, a proximity light sensor, a fingerprint sensor, a temperature sensor, a touch sensor, an ambient light sensor, a bone conduction sensor, and the like.

[0106] The key 190 includes a power key, a volume key, etc. The key 190 may be a mechanical key or a touch key. The electronic device 100 may receive key input and generate key signal input related to user settings and function control of the electronic device 100.

[0107] 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.

[0108] Indicator 192 may be an indicator light, which may be used to indicate charging status, power changes, messages, missed calls, notifications, etc.

[0109] 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 100 by inserting it into the SIM card interface 195 or pulling it out from the SIM card interface 195. The electronic device 100 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. The electronic device 100 interacts with the network through the SIM card to implement functions such as calls and data communications. In some embodiments, the electronic device 100 uses an eSIM, i.e., an embedded SIM card. The eSIM card can be embedded in the electronic device 100 and cannot be separated from the electronic device 100.

[0110] The software system of the electronic device 100 may adopt a layered architecture, an event-driven architecture, a micro-kernel architecture, a micro-service architecture, or a cloud architecture. Taking the (Android) system as an example, the software structure of the electronic device 100 is exemplified.

[0111] Figure 1B 1 is a software structure block diagram of the electronic device 100 according to an embodiment of the present invention.

[0112] The layered architecture divides the software into several layers, each with clear roles and division of labor. The layers communicate with each other through software interfaces. In some embodiments, the Android system is divided into five layers, from top to bottom: application layer, application framework layer (also called system framework layer), system library and Android runtime layer, hardware abstraction layer (HAL) and kernel layer.

[0113] The application layer may include several applications (hereinafter referred to as applications). In the embodiment of the present application, the application layer may include: camera, gallery, calendar, call, map, navigation, WLAN, Bluetooth, music, video, short message and other applications.

[0114] The application framework layer provides an application programming interface (API) and programming framework for applications in the application layer, including various components and services to support developers' Android development.

[0115] The system library and Android runtime layer include the system library and Android Runtime. The system library can include multiple functional modules, such as surface manager, libc, etc. The Android runtime is responsible for the scheduling and management of the Android system, specifically including the core library and virtual machine. Among them, the core library contains two parts: one part is the function functions that need to be called by the Java language, and the other part is the Android core library; the virtual machine is used to run Android applications developed using the Java language.

[0116] The HAL layer is an interface layer between the operating system kernel and the hardware circuit. The HAL layer includes but is not limited to: the audio hardware abstraction layer (Audio HAL) and the camera hardware abstraction layer (Camera HAL). Among them, the Audio HAL is used to process the audio stream, for example, to perform noise reduction, directional enhancement, etc. on the audio stream, and the Camera HAL is used to process the image stream.

[0117] The kernel layer is the layer between hardware and software. The kernel layer may include: display driver, camera driver, audio driver, sensor driver, etc. The display driver is used to drive the display.

[0118] Below, combined with the above Figure 1A and Figure 1B The structure of the electronic device shown illustrates the interface display method of the embodiment of the present application.

[0119] In the interface display method of the embodiment of the present application, for the user interface to be displayed, the non-sensitive animation elements included in the user interface are first identified and screened out, and the animation playback of the non-sensitive animation elements is stopped when the user interface is displayed. In other words, when the user interface is displayed, the non-sensitive animation elements in the user interface continue to display the same frame image, so that the non-sensitive animation elements are non-animation elements in the user's visible dimension, that is, the image of the non-sensitive animation elements viewed by the user in the user interface does not change. At the same time, elements other than non-sensitive animation elements in the user interface are displayed normally. For example, for sensitive animation elements, the display is still refreshed at the default frame rate of the device to ensure the normal use of the user interface and the user experience.

[0120] In some embodiments, the interface display method of the embodiment of the present application can be implemented as a function or middleware provided by the operating system of the electronic device. In other words, the interface display method of the embodiment of the present application can be judged by the operating system of the electronic device to identify the non-sensitive animation elements in the user interface, and stop the animation playback of the non-sensitive animation elements when displaying the user interface. At this time, for the application, it is still drawing the image of the non-sensitive animation element. In other words, the application still calls the relevant services of the electronic device to display the user interface according to the relevant technology, and does not stop the animation playback of the non-sensitive animation elements in the user interface.

[0121] The following is an exemplary description.

[0122] For example, an electronic device may provide a power saving mode. When the power level of the electronic device reaches or falls below a certain power threshold, the electronic device enters the power saving mode and executes a power saving strategy to extend the usage time of the electronic device. The interface display method of the embodiment of the present application may serve as one of the power saving strategies of the electronic device and be triggered to execute when the electronic device enters the power saving mode.

[0123] For example, a power saving mode for interface display may be provided in a setting application of an electronic device, such as Figure 2 As shown, the user can independently set whether to turn on the power saving mode for the interface display. If the user turns on the power saving mode, when the power of the electronic device reaches or falls below a certain power threshold, the electronic device can execute the interface display method of the embodiment of the present application, thereby reducing the power consumption of the electronic device displaying the user interface.

[0124] For example, the electronic device may be preset to execute the interface display method of the embodiment of the present application in a certain preset time period. The specific preset time period may be set autonomously by the electronic device or manually by the user.

[0125] For example, an electronic device can learn the user's usage habits. When the user's usage habits meet the trigger conditions preset in the electronic device, the electronic device executes the interface display method of the embodiment of the present application to reduce the power consumption of the electronic device displaying the user interface. For example, the electronic device learns the user's usage habits and determines that the average duration of the user's continuous use of the electronic device for a period of time (for example, 10 days) is 1 hour per day. If the preset trigger condition is met: the average duration of continuous use of the electronic device is not less than 30 minutes per day, the electronic device triggers the execution of the interface display method of the embodiment of the present application to reduce the power consumption of the electronic device displaying the user interface.

[0126] The non-sensitive animation elements in the embodiments of the present application are animation elements in the user interface that the user pays little or no attention to, and that have no effect on the user's functional operations in the user interface, or in other words, the stopping of the non-sensitive animation elements will not affect the user's use of the user interface and functional operations. Accordingly, animation elements other than the non-sensitive animation elements are sensitive animation elements. Sensitive animation elements are often animation elements that the user pays attention to in the user interface, or animation elements that affect the user's functional operations in the user interface, or animation elements that affect the refreshing, playing, or pausing of the animation based on the user's functional operations in the user interface.

[0127] Optionally, the non-sensitive animation element occupies a smaller area on the user interface. In some related technologies, the non-sensitive animation element can also be called a small animation. The position of the non-sensitive animation element in the user interface is not fixed, for example, it can be located at the edge or center of the user interface.

[0128] Optionally, from a technical implementation point of view, the non-sensitive animation elements may include the following types of animation elements: rotation animation, translation animation, zoom animation, gradient animation, or a combination of the above animation forms.

[0129] In the user-visible dimension, the rotation animation generally simulates the rotation effect of a record player. This rotation effect can enhance the visual effect, but the rotation animation itself does not have any special functions. For specific examples, see Figure 4A .

[0130] The translation animation is generally a simulated animation in the horizontal or vertical position offset change in the user's visible dimension. For example, when the screen is touched, the animation is translated and popped up, and when the screen is not touched, the animation is translated and hidden. For specific examples, see Fig. 7A , Fig. 8A , Fig. 10A wait.

[0131] Scaling animations are usually simulated animations with uniform size changes in the user's visible dimension, for example Figure 5A , Fig. 6A , Fig. 9AIn examples such as , in the playback special effects, a dynamic effect is achieved by scaling the three vertical bars to different degrees.

[0132] Gradient animation is generally a simulated animation transparency change in the user's visual dimension. It is usually used to change the background color, text color, button color, etc. to enhance the visual effect and highlight the change of the current state. For specific examples, see Fig.11A .

[0133] In order to better illustrate the implementation of the interface display method of the embodiment of the present application, the following embodiment takes the electronic device as a mobile phone as an example. The following first illustrates, by way of comparison, the implementation of the user interface including non-sensitive animation elements in the related art, and the implementation of the user interface including non-sensitive animation elements in the interface display method of the embodiment of the present application.

[0134] See also Figure 3A and Figure 3B , take the clock icon on the mobile phone desktop as an example. Figure 3A and Figure 3B Except for the clock icon, all the elements on the mobile phone desktop shown are non-animated.

[0135] See also Figure 3A In the related art, when the mobile phone displays the mobile phone desktop, the mobile phone draws and plays the animation of the clock icon 301 at the device default frame rate. In the user's visible dimension, the second hand, minute hand, and hour hand of the clock icon 301 continue to change. Figure 3A The right side of the magnified display area shows a schematic diagram of the image changes of the clock icon 301 over time.

[0136] See also Figure 3B In the interface display method provided in the embodiment of the present application, when the mobile phone displays the mobile phone desktop, the mobile phone stops the animation playback of the clock icon 301 and continues to display the same frame image. In the user's visual dimension, the image displayed by the clock icon 301 has not changed since the mobile phone interface is opened. See Figure 3B The right side shows an area which gives a schematic diagram of the image in icon 302 not changing over time.

[0137] By comparison, it can be seen that in the related technology, the mobile phone needs to continuously draw and play the image of the clock icon 301 at the device's default frame rate, while the interface display method of the embodiment of the present application only needs to draw one frame image of the clock icon 301 and display the frame image all the time. The power consumption of displaying the clock icon 301 is relatively smaller, and the power consumption of displaying the mobile phone desktop is relatively smaller.

[0138] refer to Figure 4A and Figure 4B, taking the user interface of a short video APP as an example. Assume that the user interface of the short video APP includes non-sensitive animation elements "rotating record" component 401 and "background music 1" component 402, sensitive animation element "video 1" 403, and other elements are non-animation elements.

[0139] See also Figure 4A In the related art, when a mobile phone displays the user interface of a short video APP, it draws the non-sensitive animation elements "rotating record" component 401 and "background music 1" component 402, and the sensitive animation element "video 1" 403 in the user interface at the device default frame rate. In the user visible dimension, after opening the user interface, the mobile phone plays "video 1" 403, while continuously rotating and playing the "rotating record" component 401 and continuously scrolling and playing the "background music 1" component 402. For example, you can refer to Figure 4A The right display area shows a schematic diagram of the changes in the playback image of the "spinning record" component 401 over time.

[0140] See also Figure 4B In the interface display method provided in the embodiment of the present application, when the mobile phone displays the same user interface, it draws and plays "Video 1" 403 at the device default frame rate, and stops the animation playback of the "Spinning Record" component 401 and the animation playback of the "Background Music 1" component 402. The "Spinning Record" component 401 and the "Background Music 1" component 402 are displayed in a manner of continuously displaying the same frame image. Figure 4B The right side enlarges the display area. In the user visible dimension, from the time the user opens the user interface 420, "Video 1" 403 plays normally, and the images of the "Spinning Record" component 401 and the "Background Music 1" component 402 do not change over time.

[0141] By comparison, it can be seen that in the related art, the mobile phone needs to continuously draw and play each frame image of the "rotating record" component 401 and the "background music 1" component 402 at the device's default frame rate, while in the interface display method of the embodiment of the present application, the mobile phone only needs to draw one frame image of the "rotating record" component 401 and the "background music 1" component 402, and the power consumption of displaying the "rotating record" component 401 and the "background music 1" component 402 is relatively smaller, and thus the power consumption of displaying the user interface of the short video APP is relatively smaller.

[0142] refer to Figure 5A and Figure 5B , taking the home page of a search engine APP as an example. Assume that the home page of the search engine APP includes a non-sensitive animation element "live broadcast" component 501 and other non-animation elements. Non-animation elements include news content and news pictures, etc.

[0143] See also Figure 5AIn the related art, when the mobile phone displays the home page of the search engine APP, it draws and plays the "live broadcast" component 501 at the default frame rate of the mobile phone. In the user's visual dimension, when the home page of the search engine APP is displayed, the mobile phone plays the animation of the "live broadcast" component 501. Figure 5A The enlarged display area on the right shows the change of the playback of the "live broadcast" component 501. When the user pulls down or slides left and right on the home page of the search engine APP to browse news, the playback of the "live broadcast" component 501 will not be affected.

[0144] See also Figure 5B In the interface display method provided in the embodiment of the present application, when the mobile phone displays the home page of the search engine APP, the animation playback of the "Live" component 501 is stopped and the same frame image is continuously displayed. In the user's visual dimension, when the home page of the search engine APP is displayed, the image of the "Live" component 501 does not change. Figure 5B The enlarged display area on the right shows a schematic diagram of the "live broadcast" component 501 with no image change over time. When the user pulls down or slides left and right on the home page of the search engine APP to browse news, the playback of the "live broadcast" component 501 will not be affected.

[0145] By comparison, it can be seen that in the related technology, the mobile phone needs to continuously draw and play each frame image of the "live broadcast" component at the device's default frame rate, while the mobile phone of the interface display method of the embodiment of the present application only needs to draw one frame image of the "live broadcast" component, and the power consumption of displaying the "live broadcast" component is relatively smaller, and thus the power consumption of displaying the home page of the search engine APP is relatively smaller.

[0146] refer to Fig. 6A and Figure 6B , take the video playback interface of a video APP as an example. Assume that the video playback interface includes non-sensitive animation elements "Selection" component 601, "Video 1" 602 and other non-animation elements. The "Selection" component 601 is used to provide users with prompts for the currently playing episodes. Non-animation elements include video description content, recommendation information, bottom function bar, etc.

[0147] See also Fig. 6A In the related art, when the mobile phone displays the video playback interface of the video APP, the "Selection" component 601 and "Video 1" 602 are drawn and played at the device default frame rate. In the user's visual dimension, when the video playback interface is displayed, the mobile phone plays "Video 1" 602 and the "Selection" component 601 at the same time. Fig. 6A The enlarged display area on the left shows a schematic diagram of the playback changes of the “Selection” component 601 .

[0148] See also Figure 6BIn the interface display method provided in the embodiment of the present application, when the mobile phone displays the video playback interface of the video APP, "Video 1" 602 is drawn and played at the device default frame rate, and the mobile phone stops the animation playback of the "Selection" component 601 and continues to display the same frame image. Figure 6B The left side enlarges the display area. In the user's visible dimension, when the video playback interface is displayed, the mobile phone plays "Video 1" 602, and the image of the "Selection" component 601 does not change over time.

[0149] By comparison, it can be seen that in the related art, the mobile phone needs to continuously draw and play the image frames of the "selection" component 601 at the device default frame rate, while in the interface display method of the embodiment of the present application, the mobile phone only needs to draw one frame of the "selection" component 601 image, and the power consumption of displaying the "selection" component 601 is relatively smaller, and thus the power consumption of displaying the video playback interface of the video APP is relatively smaller.

[0150] refer to Fig. 7A and Figure 7B , taking the main interface of a video APP as an example. Assume that the main interface of a video APP includes a non-sensitive animation element "search" component 701, recommended videos, and other non-animation elements. Among them, the "search" component 701 is used to provide users with search recommendations for currently popular dramas, and does not affect users' browsing of recommended videos. Non-animation elements include video description content, recommendation information, bottom function bar, etc.

[0151] See also Fig. 7A In the related art, when the mobile phone displays the main interface of the video APP, the mobile phone draws and plays the recommended video 1 and the "search" component 701 at the device's default frame rate. In the user's visual dimension, when the main interface of the video APP is displayed, the electronic device plays the recommended video 1 and the "search" component 701 at the same time; when the user clicks on the recommended video 2 / 3 / 4 / 5 / 6 / 7, the corresponding recommended video is played. Among them, the playback changes of the "search" component 701 can be referred to Fig. 7A In the enlarged display area on the right, the display content in the "Search" component 701 is updated over time from "Popular Drama 1" to "Popular Drama 2" and then to "Popular Drama 3", etc.

[0152] See also Figure 7B In the interface display method provided in the embodiment of the present application, when the mobile phone displays the main interface of the video APP, it draws and plays the recommended video 1 at the device default frame rate, stops the animation playback of the "search" component 701, and continues to display the same frame image. Figure 7BThe enlarged display area on the right side shows that, in the user's visible dimension, when the main interface of the video APP is displayed, the electronic device plays recommended video 1, and the content displayed by the "Search" component 701 does not change over time and is always "Popular Drama 1"; when the user clicks on recommended videos 2 / 3 / 4 / 5 / 6 / 7, the corresponding recommended video is played.

[0153] By comparison, it can be seen that in the related art, the mobile phone needs to continuously draw and play each frame image of the "search" component 701 at the device's default frame rate, while in the interface display method of the embodiment of the present application, the mobile phone only needs to draw one frame image of the "search" component 701, and the power consumption of displaying the "search" component 701 is relatively smaller, and thus the power consumption of displaying the main interface of the video APP is relatively smaller.

[0154] refer to Fig. 8A and Figure 8B , taking the application setting interface as an example. Assume that the application setting interface includes a non-sensitive animation element "pig" component 801. The "pig" component 801 is used to remind the user to enter certain activity interfaces of the current application, and has no other impact on the user's use of other functions of the application setting interface.

[0155] See also Fig. 8A In the related art, when the mobile phone displays the application setting interface, the mobile phone draws the "play piglet" component 801 at the device default frame rate. Fig. 8A The right side of the enlarged display area shows a schematic diagram of the playback changes of the "pig" component 801. It can be seen that the text displayed in the "pig" component 801 will change.

[0156] See also Figure 8B In the interface display method provided in the embodiment of the present application, when the mobile phone displays the application setting interface, the mobile phone stops playing the animation of the "pig" component 801 and continues to display the same frame image. Figure 8B The display area on the right is enlarged. In the user-visible dimension, when the mobile phone displays the application setting interface, the text displayed in the "pig" component 801 is always "Come on", and it has not changed over time.

[0157] By comparison, it can be seen that in the related technology, the mobile phone needs to continuously draw and play each frame image of the "pig" component 801 at the device's default frame rate, while the mobile phone in the interface display method of the embodiment of the present application only draws one frame image of the "pig" component 801, and the power consumption of displaying the "pig" component 801 is relatively smaller, and thus the power consumption of displaying the application setting interface is relatively smaller.

[0158] refer to Fig. 9A and Fig. 9B, taking the mobile phone search interface of the e-commerce mall application as an example. The mobile phone search interface includes search results, and the search results include non-animation elements (mobile phone pictures, mobile phone product descriptions, detailed descriptions, prices, etc.). When the store is live streaming, the search results also include a "live streaming" component 901.

[0159] See also Fig. 9A As shown, in the related art, when the search interface includes a live broadcast of a business, a "live broadcast" component 901 is drawn and played at the device default frame rate. Fig. 9A The enlarged display area on the right shows the playback changes of the "live broadcast" component 112.

[0160] See also Fig. 9B As shown, in the interface display method provided in the embodiment of the present application, when the search interface includes a merchant that is being live broadcast, the animation playback of the "live broadcast" component 901 is stopped and one frame of image is continuously displayed. Fig. 9B The enlarged display area on the right shows a schematic diagram of the "live broadcast" component 901 always displaying the same frame of image. It can be seen that the image displayed by the "live broadcast" component 901 does not change over time.

[0161] Optionally, when the user is browsing the search interface, that is, when the user performs a pull-down sliding operation on the search interface, the position of the "Live" component 901 will slide and change with the user's sliding operation, but the animation of the "Live" component 901 will not be affected by the user's operation.

[0162] By comparison, it can be seen that in the related technology, the mobile phone needs to continuously draw and play each frame image of the "live broadcast" component 901 at the device's default frame rate, while the mobile phone of the interface display method of the embodiment of the present application only needs to draw one frame image of the "live broadcast" component 901, and the power consumption of displaying the "live broadcast" component 901 is relatively smaller, and thus the power consumption of displaying the search interface is relatively smaller.

[0163] In addition, non-sensitive animation elements may also be other components.

[0164] For example, reference Fig. 10A and Fig. 10B As shown, Fig. 10A and Fig. 10B Provides a scanning interface for scanning QR codes. Fig. 10A In the related art, during the scanning process, the animation of the scanning bar 1001 sweeping up and down is a non-sensitive animation element. Fig. 10B In the interface display method provided in the embodiment of the present application, the animation of the scanning bar 1001 sweeping up and down stops, and one frame of image is always displayed. Fig. 10A and Fig. 10BThe middle shaded part is the dynamic shadow effect of the scanning bar. The scanning bar 1001 stops scanning up and down, and continues to display one frame of image without affecting the actual scanning operation, and reduces the number of image frame drawing times of the animation, thereby reducing power consumption.

[0165] For example, reference Fig.11A As shown, Fig.11A A schematic diagram of a red envelope interface is given. In the related art, the "Open" component 1101 in the red envelope interface gradually flashes from the inside to the outside of the concentric circle at a preset frequency, which is a non-sensitive animation element. In the interface display method provided in the embodiment of the present application, the gradual flashing animation of the animation element in the displayed user interface stops, and one frame of image is continuously displayed. The stopping of the animation of the "Open" component 1101 does not affect the user's operation of opening the red envelope, and reduces the number of image frame drawing times of the animation, thereby reducing power consumption.

[0166] The interface display method provided by the present application, when displaying a user interface, continuously displays the same frame of image for non-sensitive animation elements in the user interface, so that the electronic device only needs to draw an image of one frame of non-sensitive animation elements, and reduces the number of times the image frames of non-sensitive animation elements are drawn to achieve the purpose of reducing the power consumption of displaying a user interface including non-sensitive animation elements. The interface display method provided by the embodiment of the present application may include the following steps S1 to S3.

[0167] Step S1: receiving an access request to a target interface.

[0168] The target interface may be any user interface displayed by an electronic device, and the target interface includes at least one non-sensitive animation element.

[0169] For example:

[0170] If the target interface is the desktop of the mobile phone, the user can perform operations such as turning on the mobile phone or unlocking the screen of the mobile phone. Accordingly, the mobile phone can detect the above operations of the user, that is, the mobile phone receives the access request to the target interface.

[0171] If the target interface is the first interface after opening the application, the user can click the application icon on the mobile phone desktop. Accordingly, the mobile phone can detect the user's click operation on the application icon, that is, the mobile phone receives the access request to the target interface.

[0172] If the target interface is a non-primary interface such as a secondary interface or a tertiary interface of the application, the user can click on the control used to trigger the display of the target interface in the interface displayed by the application. Accordingly, the mobile phone detects the user's click operation on the control, that is, the mobile phone receives an access request to the target interface.

[0173] If the target interface is the video playback interface of the application, the user can perform a video playback operation in the video application. Accordingly, the mobile phone detects the user's above-mentioned video playback operation, that is, receives the access request of the target interface.

[0174] If the target interface is a code scanning interface, the user can click the code scanning control in the communication or payment application. Accordingly, the mobile phone detects the user's code scanning operation, that is, receives the access request to the target interface.

[0175] If the target interface is a search interface in an application, the user may click on a search control in the interface displayed by the application. Accordingly, the mobile phone detects the user's search request operation, ie, receives an access request to the target interface.

[0176] Step S2: In response to the access request, determine non-sensitive animation elements from the elements of the target interface.

[0177] With reference to the foregoing description, non-sensitive animation elements may include animation elements of types such as rotation animation, translation animation, zoom animation, and gradient animation. In some embodiments, whether the element is a non-sensitive animation element may be determined based on the type of the element. For example, the type of non-sensitive animation elements may be preset in the electronic device, such as the above-mentioned rotation animation, translation animation, zoom animation, or gradient animation. For an element in the target interface, the electronic device may determine whether the type of the element is a preset type. If it is a preset type, the element is determined to be a non-sensitive animation element. If it is not a preset type, the element is determined not to be a non-sensitive animation element.

[0178] For example, in some embodiments, if the type of an animation element in an electronic device is a rotation animation, the parameter value of the type parameter of the animation element is: ROTATION, ROTATION_X, ROTATION_Y; if the type of the animation element is a translation animation, the parameter value of the type parameter of the animation element is: TRANSLATION_X, TRANSLATION_Y, TRANSLATION_Z; if the type of the animation element is a scaling animation, the parameter value of the type parameter of the animation element is: SCALE_X, SCALE_Y; if the type of the animation element is a gradient animation, the parameter value of the type parameter of the animation element is: ALPHA; accordingly, the parameter values ​​of the type parameters corresponding to the above four types can be preset in the electronic device; if the parameter value of the type parameter of an element in the target interface is one of the parameter values ​​corresponding to the preset four types, the element is determined as a non-sensitive animation element.

[0179] Since the display area of ​​non-sensitive animation elements in the user interface is relatively small, in some embodiments, it is also possible to determine whether an element is a non-sensitive animation element based on the type of the element and the size of the display area (e.g., the width and height of the display area). For example, for an element in the target interface, it is possible to determine whether the type of the element is a preset type and whether the size of the display area of ​​the element is less than a preset size threshold. If the type of the element is a preset type and the size of the display area is less than the preset size threshold, the element is determined to be a non-sensitive animation element. Otherwise, it is determined that the element is not a non-sensitive animation element. The size of the above-mentioned display area can be, for example, the width and / or height of the display area, and the preset size threshold can be, for example, a width threshold and a height threshold. When the width of the display area is less than the width threshold and / or the height of the display area is less than the height threshold, it can be determined that the size of the display area is less than the preset size threshold.

[0180] Step S3: Display the target interface, and display the non-sensitive animation elements in the target interface in a manner of continuously displaying the same frame image.

[0181] In the embodiment of the present application, non-sensitive animation elements in the target interface are displayed in a manner of continuously displaying the same frame of image, for example Figure 3B The clock icon 301 in Figure 4B The "rotating record" component 401 and the "background music 1" component 402 in the Figure 5B The "Live" component 501 in Figure 6B The "Selection" component 601 in Figure 7B The "search" component 701 in Figure 8B The "pig" component 801 in Fig. 9B The "Live" component 901 in Fig. 10B Scan bar 1001 in , and Fig.11A The "open" component 1101 in the image always displays one frame, and the image of the non-sensitive animation element does not change.

[0182] In the embodiment of the present application, the elements other than the non-sensitive animation elements in the target interface are displayed normally, for example Figure 3B Icons other than the clock icon 301 in the middle, Figure 4B "Video 1" 403, Figure 5B News content and non-animated elements such as news pictures, Figure 6B "Video 1" 602 and other non-animated elements in Figure 7B Recommended videos and other non-animated elements in Figure 8B , Fig. 9B and Fig. 10B The display effect of the non-animation elements in the user's visual dimension is the same as that in the related art.

[0183] Optionally, for each non-sensitive animation element in the target interface, the image of the non-sensitive animation element continuously displayed in the target interface may be drawn and displayed according to the attribute value of the non-sensitive animation element in the first frame image of the target interface, or may be drawn and displayed according to the preset expected attribute value corresponding to the type of the non-sensitive animation element. Among them, the attribute value of the non-sensitive animation element in the first frame image of the target interface may be determined by the application to which the user interface belongs. The preset expected attribute value corresponding to the type of the non-sensitive animation element may be preset in the electronic device, such as the local framework layer of the electronic device.

[0184] Specifically, in one embodiment, this step may include:

[0185] For the first frame image of the target interface, the first frame image of the target interface is displayed according to the attribute value of the non-sensitive animation element in the first frame image;

[0186] For non-first frame images of the target interface, obtain the attribute values ​​of non-sensitive animation elements in the frame interface image, and update the attribute values ​​of non-sensitive animation elements in the frame image to the attribute values ​​of non-sensitive animation elements in the first frame image; display the frame image of the target interface according to the updated attribute values ​​of non-sensitive animation elements.

[0187] In another embodiment, this step may include:

[0188] For each frame image of the target interface, obtain the attribute value of the non-sensitive animation element in the frame image;

[0189] When the attribute value of the non-sensitive animation element in the frame image is different from the expected attribute value of the non-sensitive animation element, updating the attribute value of the non-sensitive animation element in the frame image to the expected attribute value;

[0190] The frame image of the target interface is displayed according to the updated property value of the non-sensitive animation element.

[0191] Optionally, the expected attribute value corresponding to each type can be preset according to the type of non-sensitive animation elements. Accordingly, when updating the attribute value of the non-sensitive animation element in each frame image, the expected attribute value corresponding to the type of the non-sensitive animation element can be used for updating.

[0192] For example, the property values ​​of a rotation animation may include: a rotation angle, with a value range of 0° to 360° (float), and in an embodiment of the present application, a corresponding expected value of the rotation angle may be set for this type of rotation animation, such as 0 degrees, so as to ensure that the image displayed by the rotation animation in the target interface is in the correct position. Similarly, the property values ​​of a translation animation may include: a translation distance, with an unlimited value (float), and in an embodiment of the present application, a corresponding expected value of the translation distance may be set for this type of translation animation, such as 0; the property values ​​of a scaling animation may include a scaling ratio, with a value range greater than or equal to 0 (float), and in an embodiment of the present application, a corresponding expected value of the scaling ratio may be set for this type of scaling animation, such as 1; the property values ​​of a gradient animation may include transparency, with a value range of 0 to 1 (float), and in an embodiment of the present application, a corresponding expected value of transparency may be set for this type of gradient animation, such as 0.

[0193] The target interface is Figure 4A and Figure 4B The user interface of the short and medium video APP, non-sensitive animation elements are Figure 4A and Figure 4B For example, the "rotating record" component 401 in the short video APP is a rotating animation. The type of the "rotating record" component 401 is a rotating animation. The attribute value of the "rotating record" component 401 includes the rotation angle of the image. The value of the rotation angle can be 0 to 360 degrees. As the rotation angle gradually changes from 0 to 360 degrees, the image of the "rotating record" component 401 rotates one circle, and the value of the rotation angle gradually changes from 0 to 360 degrees again. The image of the "rotating record" component 401 rotates one circle again, and the cycle continues. Therefore, in the user's visible dimension, the "rotating record" component 401 rotates all the time. The short video APP can set the initial value of the rotation angle of the image of the "rotating record" component 401 to any value from 0 to 360 degrees, such as 90 degrees. Then, when the electronic device starts to display the user interface, the animation effect of the "rotating record" component 401 is to rotate the image from the position where the image is rotated 90 degrees. For example, Figure 4A As shown in the enlarged display area on the right, the first picture in the area is the display effect of the bunny picture rotated 90 degrees. In the embodiment of the present application, the electronic device can draw a frame of image according to the initial value of 90 degrees of the picture rotation angle set for the "rotating record" component 401 by the short video application, and the electronic device displays the frame image of the "rotating record" component 401 in each frame of the user interface displayed at a preset frame rate (such as the preset frame rate of the device), so that the frame image can be continuously displayed in the user interface in this step, and the animation of the "rotating record" component 401 stops, for example Fig. 11B shown.

[0194] The initial value of 90 degrees for the image rotation angle set by the "rotating record" component 401 is also the attribute value of the "rotating record" component 401 in the first frame image of the target interface set by the short video APP. Since the initial value is 90 degrees, the electronic device in the embodiment of the present application draws the image according to the initial value of 90 degrees and continuously displays it in the user interface. For example Fig. 11B As shown in the enlarged display area on the right side of the figure, the rabbit picture is always rotated 90 degrees. In order to further improve the user experience, for example, the picture displayed continuously in the user interface of the "rotating record" component 401 is in the correct position. Figure 4B In the picture of the little rabbit that is continuously displayed, the little rabbit is in an upright state. In the embodiment of the present application, the expected rotation angle corresponding to the rotating animation can be preset to 0 degrees. The electronic device can draw a frame image of the "rotating record" component 401 according to the expected rotation angle of 0 degrees, and continuously display the frame image in the user interface, thereby achieving, for example, Figure 4B The display effect of the "rotating record" component 401.

[0195] In an embodiment of the present application, for non-sensitive animation elements in the target interface, each image frame of the non-sensitive animation elements is not drawn and played at the default frame rate of the device, and only one frame of the image is displayed continuously. Therefore, the mobile phone only needs to draw one frame of the image for the non-sensitive animation elements, thereby reducing the number of image drawing times of the non-sensitive animation elements in the target interface and reducing the power consumption of the mobile phone in displaying the target interface.

[0196] Fig.12 is a schematic diagram of the structure of an electronic device provided in an embodiment of the present application. Fig.12 The structure of the electronic device shown further illustrates the implementation of the interface display method of the embodiment of the present application.

[0197] exist Fig.12 In the example, it is assumed that the software architecture of the electronic device is System architecture, the target interface is the user interface displayed by the application, and the drawing, rendering and display process of the target interface includes:

[0198] After receiving the access request of the target interface, the application at the application layer sends an interface drawing command to the interface drawing service at the application framework layer.

[0199] The interface drawing service of the application framework layer parses the interface drawing command and obtains the elements in the target interface (such as Fig.12 The display parameters of animation element 1, animation element 2, and other elements in the target interface are sent to the processing module of the local framework layer.

[0200] Optionally, the interface drawing service of the application framework layer can determine the display parameters of each element in each frame image of the target interface, and send the display parameters of each element in each frame image of the target interface to the processing module of the local framework layer. Alternatively, when the application sends down the interface drawing instruction, it can also send down the display parameters of each element in each frame image of the target interface, and the interface drawing service of the application framework layer can directly parse and obtain the display parameters of each element in each frame image of the target interface and send them to the processing module of the local framework layer.

[0201] The drawing management module of the local framework layer can determine the display information of each frame image of the target interface according to the display parameters of each element in the target interface, and send the display information to the GPU.

[0202] The GPU can draw, render, synthesize and display each frame of the target interface according to the display information of each frame of the target interface.

[0203] Optionally, for the first frame image of the target interface, the GPU draws and renders the image of each element in the first frame image of the target interface, and then synthesizes the images of each element to obtain the first frame image of the target interface. For non-first frame images such as the second frame image and the third frame image of the target interface, in order to reduce over-drawing of the GPU, the GPU can only redraw and render the elements of the current frame image of the target interface that have changed relative to the previous frame image of the target interface. The elements that have not changed do not need to be drawn and rendered repeatedly, and the image obtained by the previous drawing and rendering is directly used. Then, the images of each element are synthesized to obtain the current frame image of the target interface. Therefore, for the animated elements in the target interface, the GPU needs to draw and render each frame image of the animated element at the frame rate so that the GPU can accurately synthesize each frame image of the target interface. For each non-animated element in the target interface, the GPU only needs to perform drawing and rendering once to obtain a frame image of the non-animated element. The GPU can use this frame image of the non-animated element for synthesis when synthesizing each frame image of the target interface.

[0204] by Figure 4ATaking the user interface of the short video APP shown in the figure as an example, the GPU draws and renders the "rotating record" component 401, the "background music 1" component 402, the sensitive animation element "video 1" 403, and the image of the non-animation element in the first frame image of the target interface, and synthesizes the images of the drawn elements to obtain the first frame image of the user interface; after that, the GPU re-draws and renders the "rotating record" component 401, the "background music 1" component 402, and the "video 1" 403 in the second frame image of the target interface, and uses the "rotating record" component 401, the "background music 1" component 402, and the "video 1" 403 in the target interface The second frame image of the user interface is synthesized by the image in the second frame image and the image of the non-animation element drawn and rendered previously; thereafter, the GPU re-draws and renders the image of the "rotating record" component 401, the "background music 1" component 402, and the "video 1" 403 in the third frame image of the target interface, and uses the image of the "rotating record" component 401, the "background music 1" component 402, and the "video 1" 403 in the third frame image of the target interface and the image of the non-animation element drawn and rendered previously to obtain the third frame image of the user interface; and so on, each frame image of the user interface can be synthesized according to the preset frame rate.

[0205] In order to enable the GPU to know which elements need to be redrawn and rendered when synthesizing each frame of the target interface, the receipt management module of the local framework layer needs to determine the elements that have changed relative to the previous frame for each frame of the target interface, generate display information corresponding to each frame of the target interface based on the changed elements, and send it to the GPU. The GPU can then use the above method to redraw and render the changed elements, and then synthesize each frame of the target interface.

[0206] For details, see Fig.13 As shown, the drawing management module of the local framework layer can generate a drawing tree (draw tree) corresponding to each frame image of the target interface according to the display parameters of each element in each frame image of the target interface. The drawing tree includes multiple rendering nodes (RenderNode), and each rendering node represents an element in the user interface. Each rendering node includes at least one display list (DisplayList). The display list is a basic drawing element, which contains information such as the type and attribute value of the element. The attribute value of the element may include, for example, position, size, angle, transparency, etc. The drawing management module can determine the display information of each frame image of the target interface according to the drawing tree corresponding to each frame image of the target interface, and then send the display information to the GPU. See. Fig.13The first-level rendering node in the drawing tree is called the root node. If the non-first-level rendering node has a rendering node at the next level, it is called a non-leaf node. If it does not have a rendering node at the next level, it is called a leaf node.

[0207] The processing module determines the elements that need to be redrawn for a frame of the target interface. Fig.13 As shown, including:

[0208] The drawing management module can traverse all rendering nodes in the drawing tree by using methods such as a deep recursive algorithm and a breadth recursive algorithm. For each rendering node, determine whether the rendering node exists in the drawing tree of the previous frame image of the target interface. If not, determine whether the rendering node has a damaged area. If so, compare the attribute value of the rendering node with the attribute value of the rendering node in the drawing tree of the previous frame image of the target interface (that is, the attribute value of the corresponding element in the previous frame image of the target interface) to determine whether the rendering node has a damaged area. If a damaged area exists, record the rendering node and accumulate the damaged area of ​​the rendering node to the parent node of the rendering node. Therefore, for the rendering node as the parent node, its final damaged area is the combined area of ​​the damaged area of ​​the rendering node itself and the damaged area of ​​the child nodes of the rendering node.

[0209] The damaged area of ​​each rendering node may be an area where the current frame image of the target interface changes relative to the previous frame image of the target node due to the dynamic change of the rendering node. If the attribute value of the rendering node in the current frame image of the target interface is the same as the attribute value in the previous frame image of the target interface, then there is no damaged area for the rendering node, otherwise, there is a damaged area.

[0210] Among them, the damaged area of ​​the rendering node can be calculated based on the change of the attribute value of the rendering node. The specific calculation method is exemplarily described as follows: when obtaining the damaged area of ​​a rendering node, if the rendering node does not have a transformation matrix, the display area of ​​the rendering node can be directly determined as the damaged area of ​​the rendering node. For example, the display area of ​​the rendering node 1 is a circular area, and there is no transformation matrix when the circular area is rotated, then the damaged area of ​​the rendering node 1 is the circular area. If the rendering node has a transformation matrix, the damaged area of ​​the rendering node is calculated and obtained according to the bounds of the minimum circumscribed circle of the display area. For example, if the rendering node has a transformation matrix, the area where the minimum circumscribed circle of the display area is located is obtained as the damaged area; or, if the rendering node has a transformation matrix, the area where the minimum circumscribed matrix of the display area is located is obtained as the damaged area. Exemplarily, the display area of ​​the rendering node 2 is a rectangular area, and there is a transformation matrix when the rectangular area is rotated, then the damaged area of ​​the rendering node 2 is the area where the minimum circumscribed circle of the rectangular area is located.

[0211] The electronic device traverses all rendering nodes in the entire rendering tree of the target interface, obtains the damaged area of ​​the root node of the rendering tree of the target interface, and sends it to the GPU as the rendering area together with the recorded elements that need to be rendered, so that the GPU re-renders the rendering area according to the elements that need to be rendered.

[0212] In combination with the above-mentioned method for determining the drawing rendering area of ​​the GPU, in order to implement the interface display method of the embodiment of the present application, the embodiment of the present application can set a processing module at the local framework layer (native). In addition to the above-mentioned drawing management module, the processing module also includes an element control module. The element control module manages the timing of being triggered, and after being triggered, identifies non-sensitive animation elements in the target interface and stops the animation playback of the non-sensitive animation elements in the target interface.

[0213] The following first and second embodiments can realize updating the attribute values ​​of the non-sensitive animation elements in each frame image of the target interface to the preset expected attribute values ​​corresponding to the type of the non-sensitive animation elements, so that in each frame image of the target interface finally displayed, the image of the non-sensitive animation element is drawn, rendered and displayed according to the expected attribute values.

[0214] In the first embodiment, after the drawing management module generates a drawing tree corresponding to each frame image of the target interface, before traversing all rendering nodes in the drawing tree to determine the display information corresponding to the frame image of the target interface, the element control module can first traverse all rendering nodes in the drawing tree (that is, traverse each element in the target interface) to determine whether each rendering node is a non-sensitive animation element. When the rendering node is a non-sensitive animation element, the attribute value of the rendering node is modified to the expected attribute value corresponding to the type of the rendering node.

[0215] Taking the example of judging whether it is a non-sensitive animation element according to the type of the rendering node, the processing steps of the element node for each rendering node are as follows: Fig.15 As shown, it includes: the element control module obtains the type of each rendering node, and when it is determined to be a non-sensitive animation element according to the type, obtains the attribute value of the rendering node, and modifies the attribute value of the rendering node to the expected attribute value corresponding to the type of the rendering node.

[0216] by Figure 4B The user interface of the short video APP shown is the target interface as an example. Assume that the drawing tree corresponding to each frame image of the target interface is as follows Fig.14 As shown, the drawing tree includes nodes corresponding to "Video 1", nodes corresponding to "Background Music 1" components, and nodes corresponding to "Spinning Record" components. The root node and nodes 1 to 4 represent nodes corresponding to other elements in the target interface. It can be understood that Fig.14 The drawing tree is only used to illustrate the principle and is not used to limit Figure 4B As shown in the actual rendering tree implementation of the user interface of the short video APP, it can be understood that the rendering tree structures corresponding to different frame images of the target interface can be the same, and the display lists of the same rendering node in different rendering trees can be different. When the element control module traverses all rendering nodes in the drawing tree, for "Video 1", it is determined whether "Video 1" is a non-sensitive animation element. Since Video 1 is not a non-sensitive animation element, the element control module does not process the attribute value of "Video 1" in the drawing tree; for the "Spinning Record" component, it is determined whether the "Spinning Record" component is a non-sensitive animation element. It is determined that the "Spinning Record" component is a non-sensitive animation element, so according to the type of the "Spinning Record" component - rotation animation, the preset expected attribute value corresponding to the rotation animation (for example, the rotation angle of the image is 0 degrees) is obtained, and the attribute value of the "Spinning Record" component in the drawing tree (for example, assuming that the rotation angle of the image is 10 degrees) is updated to the preset expected attribute value corresponding to the rotation animation (for example, the rotation angle of the image is 0 degrees); for the "Background Music 1" component, based on a processing flow similar to that of the "Spinning Record" component, the attribute value of the "Background Music 1" component in the drawing tree can be updated to the preset expected attribute value corresponding to the translation animation.

[0217] Through this processing, the attribute values ​​of the rendering nodes corresponding to the same non-sensitive animation element in the drawing tree corresponding to each frame image of the target interface can be the same (all are expected attribute values ​​corresponding to the type of the rendering node), so that when the drawing management module traverses all rendering nodes in the drawing tree to determine the display information corresponding to the frame image corresponding to the target interface, since the attribute value of the rendering node corresponding to the same non-sensitive animation element in the drawing tree of the frame image is the same as the attribute value in the drawing tree of the previous frame image, there is no damaged area of ​​the rendering node, so the display information of the corresponding frame image finally determined does not include the information of the rendering node, and when the display information is input to the GPU, the GPU will not redraw the image of the rendering node. For the GPU, it is only necessary to draw and render the rendering node when synthesizing the first frame image of the target interface.

[0218] For example, suppose the drawing tree of each frame of the target interface starting from the first frame is Fig.14The drawing tree structure shown, for the first frame image of the target interface, after the element control module traverses the drawing tree of the first frame image and modifies the attribute values ​​of the non-sensitive animation elements ("background music 1" component and "rotating record" component) to the expected attribute values, the drawing management node traverses the drawing tree of the first frame image of the target interface. Since there is no drawing tree of the previous frame image for comparison, the drawing management node can record all rendering nodes in the drawing tree of the first frame image, and merge the damaged areas of all rendering nodes to obtain the drawing rendering area, and input the above information as display information into the GPU. The GPU will render the images of all elements in the first frame image of the target interface based on the display information, and synthesize them into the first frame image of the target interface; and for the second frame image of the target interface, after the element control module traverses the drawing tree of the second frame image and modifies the attribute values ​​of the non-sensitive animation elements ("background music 1" component and "rotating record" component) to the expected attribute values, when the drawing management node traverses the drawing tree of the second frame image of the target interface, for "Video 1", since in the drawing tree of the second frame image The attribute value of the "video 1" animation element in the second frame image of the target interface (that is, the attribute value of the "video 1" animation element in the first frame image of the target interface) is inconsistent with the attribute value in the drawing tree of the first frame image (that is, the attribute value of the "video 1" animation element in the first frame image of the target interface), so the drawing management node can record "video 1" and accumulate the damaged area of ​​"video 1" to its parent node "node 3". For the "rotating record" component, since the element control module modifies the attribute value of the "rotating record" component in the drawing tree of the second frame image and the attribute value in the drawing tree of the first frame image to the expected attribute value of the rotating animation, the attribute values ​​of the two are consistent, and the drawing management node does not record the "rotating record" component in the display information of the drawing tree of the second frame image; for the "background music 1" component, based on a processing flow similar to that of the "rotating record" component, the attribute value of the "background music 1" component in the drawing tree of the second frame image and the attribute value in the drawing tree of the first frame image are also consistent, and the drawing management node does not record the "background music 1" component in the display information of the drawing tree of the second frame image. It can be seen that in the method in the embodiment of the present application, the display information of the second frame image of the target interface ultimately includes the information of "Video 1", but does not include the "background music 1" component and the "rotating record" component, so that the GPU will redraw the rendered image of "Video 1" and will not redraw the rendered "background music 1" component and the "rotating record" component, so that when synthesizing the second frame image of the target interface, the image obtained by redrawing the rendering of "Video 1" and the image obtained by drawing and rendering the "background music 1" component and the "rotating record" component before (that is, the image obtained by drawing and rendering when synthesizing the first frame image of the target interface) are used to synthesize the second frame image of the target interface, so that in the second frame image of the target interface displayed by the electronic device, the image of "Video 1" changes, while the images of the "background music 1" component and the "rotating record" component do not change.By analogy, each frame image of the target interface can be synthesized and displayed according to the frame rate, to achieve, for example. Figure 4B In the target interface shown in the figure, "Video 1" plays normally, and the images of the "Scene Music 1" component and the "Spinning Record" component do not change.

[0219] In the second embodiment, after the drawing management module generates a drawing tree corresponding to each frame image of the target interface, all rendering nodes in the drawing tree are traversed to generate display information corresponding to each frame image. For each rendering node traversed by the drawing management module, the element control module can first determine whether the rendering node is a non-sensitive animation element. If it is a non-sensitive animation element, the attribute value of the rendering node is modified to the expected attribute value corresponding to the type of the rendering node. Then the drawing management module determines whether there is a damaged area in the rendering node.

[0220] Because the element control module first modifies the attribute value of the rendering node to the expected attribute value before the electronic device compares the attribute values ​​of the rendering node corresponding to a non-sensitive animation element, after the attribute value comparison, based on the principle similar to the first embodiment, only when the rendering tree of the first frame image of the target interface is traversed, the rendering node corresponding to the non-sensitive animation element has a damaged area, and when the rendering tree of each subsequent frame image (for example, the second frame image, the third frame image, etc.) is traversed, the rendering node corresponding to the non-sensitive animation element must not have a damaged area, so that the display information of the first frame image of the target interface includes The information of the rendering nodes corresponding to the non-sensitive animation elements, and the display information of the non-first frame image of the target interface (for example, the second frame image, the third frame image, etc.) does not include the information of the rendering nodes corresponding to the non-sensitive animation elements. After the above display information is input into the GPU, the GPU only draws and renders the image of the non-sensitive animation elements before synthesizing the first frame image of the target interface. When synthesizing the non-first frame image of the target interface, the image of the non-sensitive animation elements will not be redrawn. Therefore, for the GPU, the non-sensitive animation elements in the target interface are only drawn and rendered once, reducing the number of times the non-sensitive animation elements are drawn and rendered. For specific examples, please refer to the example of the previous embodiment. The only difference is that the timing of the element control module modifying the attribute value of the non-sensitive animation element in the drawing tree is different, which will not be repeated here.

[0221] In the above embodiments, the attribute values ​​of the non-sensitive animation elements in each frame image of the target interface are modified to preset expected attribute values ​​of the corresponding type. In other embodiments, for the first frame image of the target interface, the attribute values ​​of the non-sensitive animation elements in the first frame image may not be modified, but the first frame image of the target interface is displayed according to the attribute values ​​of the non-sensitive animation elements in the first frame image indicated by the application; for the non-first frame image of the target interface, the attribute values ​​of the non-sensitive animation elements in the frame image are updated to the attribute values ​​of the non-sensitive animation elements in the first frame image, and the frame image of the target interface is displayed according to the updated attribute values ​​of the non-sensitive animation elements.

[0222] Based on this, in the third embodiment, after the drawing management module generates the drawing tree corresponding to the first frame image of the target interface, before traversing all the rendering nodes in the drawing tree to determine the display information corresponding to the frame image of the target interface, the element control module can first traverse all the rendering nodes in the drawing tree (that is, traverse each element in the target interface) to determine whether each rendering node is a non-sensitive animation element. When the rendering node is a non-sensitive animation element, the attribute value of the rendering node is not modified, and the element control module records the attribute value of the rendering node as the target attribute value of the rendering node. After the drawing management module generates the drawing tree corresponding to the non-first frame image of the target interface, before traversing all the rendering nodes in the drawing tree to determine the display information corresponding to the frame image of the target interface, the element control module can first traverse all the rendering nodes in the drawing tree (that is, traverse each element in the target interface) to determine whether each rendering node is a non-sensitive animation element. When the rendering node is a non-sensitive animation element, the attribute value of the rendering node is modified to the above-mentioned target attribute value of the rendering node.

[0223] Afterwards, when the drawing management module traverses all rendering nodes in the drawing tree of the first frame image and determines the display information corresponding to the frame image of the target interface, the attribute value corresponding to the non-sensitive animation element recorded in the display information is the attribute value (for example, initial value) indicated by the application via the interface drawing service of the framework layer for the non-sensitive animation element in the first frame image of the target interface, and the attribute value corresponding to the non-sensitive animation element in the drawing tree of each subsequent frame image is also modified by the element control module to the above attribute value indicated by the application. Based on similar implementation elements in the aforementioned embodiments, this embodiment can realize that each non-sensitive animation element in the target interface continuously displays the first frame image of the non-sensitive animation element indicated by the application. For example Fig. 11B As shown, assuming that the initial value of the rotation angle indicated by the short video application for the "rotating record" component is 90, the "rotating record" component in the target interface is displayed in the form of an image that continuously displays a rabbit picture rotated 90 degrees.

[0224] In the fourth embodiment, the timing for the element control module to modify the attribute value of the non-sensitive animation element in the drawing tree can also be when the drawing management module traverses each rendering node in the drawing tree of each frame image. Specifically, when the drawing management module traverses each rendering node in the drawing tree of the first frame image of the target interface, before comparing the attribute value of the rendering node, it is first determined whether the rendering node is a non-sensitive animation element. If it is a non-sensitive animation element, the attribute value of the rendering node is not modified, and the element control module records the attribute value of the rendering node as the target attribute value of the rendering node; when the drawing management module traverses each rendering node in the drawing tree of the non-first frame image of the target interface, before comparing the attribute value of the rendering node, it is first determined whether the rendering node is a non-sensitive animation element. If it is a non-sensitive animation element, the attribute value of the rendering node is modified to the above-mentioned target attribute value.

[0225] The processing flow and principle of this embodiment can refer to the corresponding description of the second embodiment above. This embodiment can also realize that each non-sensitive animation element in the target interface continuously displays the first frame image of the non-sensitive animation element indicated by the application. Fig. 11B As shown, assuming that the initial value of the rotation angle indicated by the short video application for the "rotating record" component is 90, the "rotating record" component in the target interface is displayed in the form of an image that continuously displays a rabbit picture rotated 90 degrees.

[0226] The above embodiments can all achieve that in each frame image of the target interface, non-sensitive animation elements are displayed in a manner of continuously displaying the same frame image, so that the GPU only draws and renders one frame image of the non-sensitive animation elements, thereby reducing the number of times the GPU draws and renders the non-sensitive animation elements, reducing the power consumption of the electronic device displaying the non-sensitive animation elements, and thereby reducing the display power consumption of the target interface containing the non-sensitive animation elements.

[0227] An embodiment of the present application also provides an electronic device, including a processor and a memory, wherein the processor is used to implement the method provided in the embodiment of the present application.

[0228] The embodiment of the present application also provides a computer-readable storage medium, in which a computer program is stored. When the computer-readable storage medium is run on a computer, the computer executes the method provided by the embodiment of the present application.

[0229] The embodiment of the present application also provides a computer program product, which includes a computer program. When the computer program is run on a computer, it enables the computer to execute the method provided by the embodiment of the present application.

[0230] In the embodiments of the present application, "at least one" refers to one or more, and "more than one" refers to two or more. "And / or" describes the association relationship of associated objects, indicating that three relationships may exist. For example, A and / or B can represent the existence of A alone, the existence of A and B at the same time, and the existence of B alone. Among them, A and B can be singular or plural. The character " / " generally indicates that the previous and next associated objects are in an "or" relationship. "At least one of the following" and similar expressions refer to any combination of these items, including any combination of single or plural items. For example, at least one of a, b and c can be represented by: 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.

[0231] Those of ordinary skill in the art will appreciate that the various units and algorithm steps described in the embodiments disclosed herein can be implemented in a combination of electronic hardware, computer software, and electronic hardware. Whether these functions are performed in hardware or software depends on the specific application and design constraints of the technical solution. Professional and technical personnel can use different methods to implement the described functions for each specific application, but such implementation should not be considered to be beyond the scope of this application.

[0232] Those skilled in the art can clearly understand that, for the convenience and brevity of description, the specific working processes of the systems, devices and units described above can refer to the corresponding processes in the aforementioned method embodiments and will not be repeated here.

[0233] In several embodiments provided in the present application, if any function is implemented in the form of a software functional unit and sold or used as an independent product, it can be stored in a computer-readable storage medium. Based on this understanding, the technical solution of the present application, or the part that contributes to the prior art or the part of the technical solution, can be embodied in the form of a software product, which is stored in a storage medium and includes several instructions for a computer device (which can be a personal computer, a server, or a network device, etc.) to perform all or part of the steps of the method described in each embodiment of the present application. The aforementioned storage medium includes: U disk, mobile hard disk, read-only memory (Read-Only Memory; hereinafter referred to as: ROM), random access memory (Random Access Memory; hereinafter referred to as: RAM), disk or optical disk, and other media that can store program codes.

[0234] The above is only a specific implementation of the present application. Any changes or substitutions that can be easily thought of by a person skilled in the art within the technical scope disclosed in the present application should be included in the protection scope of the present application. The protection scope of the present application should be based on the protection scope of the claims.

Claims

1. An interface display method, characterized in that: Applied to electronic equipment, the method comprises: Receive access request of target interface; In response to the access request, determining a first type of animation element from elements of the target interface; The target interface is displayed, and the first type of animation elements in the target interface are displayed in a manner of continuously displaying the same frame image.

2. The method according to claim 1, characterized in that The displaying of the target interface, wherein the first type of animation elements in the target interface are displayed in a manner of continuously displaying the same frame of image, includes: For each frame of the target interface image, obtaining the attribute value of the first type of animation element in the frame of the interface image; When the attribute value of the first type of animation element in the frame interface image is different from the target attribute value of the first type of animation element, updating the attribute value of the first type of animation element in the frame interface image to the target attribute value; The frame interface image of the target interface is displayed according to the updated attribute value of the first type animation element.

3. The method according to claim 2, characterized in that Also includes: When the attribute value of the first type of animation element in the frame interface image is the same as the target attribute value of the first type of animation element, the frame interface image of the target interface is displayed according to the attribute value of the first type of animation element in the frame interface image.

4. The method according to claim 1, characterized in that The first type of animation elements are displayed in a manner of continuously displaying a same frame of image, including: the first type of animation elements are displayed in a manner of continuously displaying a first frame of image of the first type of animation elements.

5. The method according to claim 4, characterized in that The displaying of the target interface, wherein the first type of animation elements in the target interface are displayed in a manner of continuously displaying the same frame of image, includes: For the first frame interface image of the target interface, display the first frame interface image of the target interface according to the attribute value of the first type of animation element in the first frame interface image; For the non-first frame interface image of the target interface, obtain the attribute value of the first category animation element in the frame interface image, and update the attribute value of the first category animation element in the frame interface image to the attribute value of the first category animation element in the first frame interface image; display the frame interface image of the target interface according to the updated attribute value of the first category animation element.

6. The method according to any one of claims 1 to 5, characterized in that: The determining of the first type of animation elements from the elements of the target interface includes: Get the type of each element in the target interface; The elements of the target interface that are of a preset type are determined as the first type of animation elements.

7. The method according to any one of claims 1 to 5, characterized in that: The determining of the first type of animation elements from the elements of the target interface includes: Obtain the type and display area size of each element in the target interface; Among the elements of the target interface, the elements whose type is a preset type and whose display area size is smaller than a preset size threshold are determined as the first type of animation elements.

8. The method according to any one of claims 1 to 5, characterized in that: Before displaying the target interface, the method further includes: Determining that a power saving mode of the electronic device is activated; or, Determine that the power saving mode displayed on the interface is activated; or, Determining that the power level of the electronic device is not higher than a preset power threshold; or, Determining that the real time is within a preset time threshold; or, Determine whether the user's usage habits meet the preset trigger conditions.

9. The method according to any one of claims 1 to 5, characterized in that: The first category of animation elements includes at least one of the following types of animation elements: a rotation animation element, a translation animation element, a zoom animation element, and a gradient animation element.

10. An electronic device, characterized in that: include: Processor, memory; One or more computer programs are stored in the memory, and the one or more computer programs include instructions, which, when executed by the processor, enable the electronic device to perform the method according to any one of claims 1 to 9.

11. A computer-readable storage medium, characterized in that: The computer-readable storage medium stores a computer program, which, when executed on a computer, enables the computer to execute the method according to any one of claims 1 to 9.

Citation Information

Patent Citations

  • Power conservation for mobile device displays

    CN101969511A

  • Automatically adjusting display areas to reduce power consumption

    CN105103106A

  • Method and device for controlling mobile terminal and mobile terminal

    CN106919402A

  • Method for displaying multiple windows and electronic device

    WO2022017205A1

Cited By

  • User interface display method and device for embedded equipment

    CN120872459A

  • Display method for loading animation and related equipment

    CN121616732A

  • Interface display method and electronic device

    EP4756573A1

  • Interface display method and electronic device

    WO2025086905A1