CN114463474A

CN114463474A - Page display method and device, electronic equipment, storage medium and product

Info

Publication number: CN114463474A
Application number: CN202111574041.8A
Authority: CN
Inventors: 张雷
Original assignee: Beijing Dajia Internet Information Technology Co Ltd
Current assignee: Beijing Dajia Internet Information Technology Co Ltd
Priority date: 2021-12-21
Filing date: 2021-12-21
Publication date: 2022-05-10

Abstract

The disclosure relates to a page display method, a page display device, an electronic apparatus, a storage medium and a product, wherein the method comprises the steps of obtaining animation configuration information of an animation to be displayed in an animation page; determining a target number of target animation layers corresponding to the animation page based on the animation configuration information; acquiring configuration objects corresponding to the target animation layers respectively; and displaying the target display element on the animation page based on the configuration object. By utilizing the embodiment of the disclosure, the calculation amount required by animation rendering can be reduced, and the animation rendering efficiency is improved.

Description

Page display method and device, electronic equipment, storage medium and product

Technical Field

The present disclosure relates to the field of page display technologies, and in particular, to a page display method and apparatus, an electronic device, a storage medium, and a product.

Background

To implement animation of animation effects in a terminal Application (APP), animation generation technology, for example, lottiee animation generation technology is applied to lottiee animation in APP.

In the related art, a terminal creates a view for the entire animation based on an animation file of the animation, and is used for playing the animation in a page. When the terminal needs to render the animation, the terminal needs to pre-load all animation resources and configuration information of the whole animation corresponding to the view to render the animation, and then the animation is played in the page. The animation rendering method in the related art has the problems of large calculation amount and low animation rendering efficiency.

Disclosure of Invention

The present disclosure provides a page display method, device, electronic device, storage medium, and product, to at least solve the problems of a large amount of calculation and low animation rendering efficiency in an animation rendering manner in the related art. The technical scheme of the disclosure is as follows:

according to a first aspect of the embodiments of the present disclosure, there is provided a page display method, including:

acquiring animation configuration information of an animation to be displayed in an animation page;

determining a target number of target animation layers corresponding to the animation page based on the animation configuration information, wherein target display elements corresponding to the target number of target animation layers are elements currently displayed in the animation page;

acquiring configuration objects corresponding to the target animation layers respectively, wherein the configuration objects are used for loading display elements in the rendered animation layers;

and displaying the target display element on the animation page based on the configuration object.

In one possible design, the animation configuration information includes carousel animation identification information, and the method further includes:

determining a carousel animation layer corresponding to the carousel animation under the condition that the carousel animation identification information indicates that the animation to be displayed comprises the carousel animation;

and creating a first number of carousel animation configuration objects corresponding to the carousel animation layers, wherein the number of layers of the carousel animation layers is greater than or equal to the first number, and the carousel animation configuration objects are used for loading and rendering carousel display elements in the carousel animation layers.

In one possible design, the target number of target animation layers includes a second number of carousel animation layers corresponding to carousel display elements currently displayed in the animation page, where the target display elements include carousel display elements corresponding to the second number of carousel animation layers, and the obtaining of configuration objects corresponding to the target animation layers includes:

determining carousel animation configuration objects corresponding to the second number of carousel animation layers from the first number of carousel animation configuration objects, wherein the first number is greater than or equal to the second number;

the displaying the target presentation element on the animation page based on the configuration object comprises:

and displaying carousel display elements corresponding to the second number of carousel animation layers on the animation page based on carousel animation configuration objects corresponding to the second number of carousel animation layers.

In one possible design, the second number of carousel animation layers includes a first carousel animation layer, and the method further includes:

and under the condition that the display of a first carousel display element corresponding to the first carousel animation layer is finished, taking a first carousel animation configuration object corresponding to the first carousel animation layer as a carousel animation configuration object corresponding to a second carousel animation layer, wherein the second carousel animation layer is a carousel animation layer corresponding to a second carousel display element displayed after the first carousel display element.

In one possible design, the displaying the target presentation element on the animation page based on the configuration object further includes:

and displaying the second carousel display element on the animation page based on the first carousel animation configuration object.

In one possible design, the method further includes:

and creating configuration objects corresponding to the non-carousel animation layers in the animation to be displayed.

In one possible design, the animation configuration information includes display configuration information, and the determining, based on the animation configuration information, a target number of target animation layers corresponding to the animation page includes:

determining current display position information of display elements in the animation to be displayed based on the display configuration information;

determining a target display element of the animation page based on the current display position information;

and obtaining the target animation layers with the target number based on the animation layers corresponding to the target display elements.

In one possible design, the determining the target display element of the animation page based on the current display position information includes:

determining the display element as the target display element if the current display position information indicates that the display element is located within a screen.

In one possible design, the displaying the target presentation element on the animation page based on the configuration object includes:

acquiring a first media resource corresponding to the animation layer in the animation playing state based on a configuration object corresponding to the animation layer in the animation playing state in the target number of target animation layers;

and displaying the display elements corresponding to the animation layers in the animation playing state on the animation page based on the first media resource.

acquiring a second media resource corresponding to the animation layer in the static state from a cache based on the configuration object corresponding to the animation layer in the static state in the target number of target animation layers;

and displaying the display elements corresponding to the animation layers in the static state on the animation page based on the second media resources.

determining first layer configuration information corresponding to the target animation layers in the target number in the current animation frame and second layer configuration information corresponding to the target animation layers in the previous animation frame based on the configuration object;

matching the first layer configuration information and the second layer configuration information to obtain a matching result;

taking the target animation layers with the difference as the first animation layers in the target number of target animation layers;

acquiring a third media resource corresponding to the first animation layer;

and displaying a display element corresponding to the first animation layer on the animation page based on the third media resource.

taking the target animation layers with no difference as second animation layers in the target number of target animation layers according to the matching result;

and displaying display elements corresponding to the second animation layer on the animation page based on second layer configuration information corresponding to the second animation layer.

According to a second aspect of the embodiments of the present disclosure, there is provided a page display apparatus including:

the configuration information acquisition module is configured to execute the step of acquiring animation configuration information of the animation to be displayed in the animation page;

a target layer determining module configured to determine, based on the animation configuration information, a target number of target animation layers corresponding to the animation page, where target display elements corresponding to the target number of target animation layers are currently displayed elements in the animation page;

the configuration object acquisition module is configured to execute acquisition of configuration objects corresponding to the target animation layers, and the configuration objects are used for loading and rendering display elements in the animation layers;

and the page display module is configured to display the target display element on the animation page based on the configuration object.

In one possible design, the animation configuration information includes carousel animation identification information, and the apparatus further includes:

the carousel animation determining module is configured to determine a carousel animation layer corresponding to the carousel animation under the condition that the carousel animation identification information indicates that the animation to be displayed comprises the carousel animation;

the configuration object creating module is configured to execute creating of a first number of carousel animation configuration objects corresponding to the carousel animation layers, the number of layers of the carousel animation layers is greater than or equal to the first number, and the carousel animation configuration objects are used for loading and rendering carousel display elements in the carousel animation layers.

In one possible design, the target number of target animation layers includes a second number of carousel animation layers corresponding to carousel display elements currently displayed in the animation page, the target display elements include carousel display elements corresponding to the second number of carousel animation layers, and the configuration object obtaining module includes:

the configuration object distribution unit is configured to determine carousel animation configuration objects corresponding to the second number of carousel animation layers from the first number of carousel animation configuration objects, wherein the first number is greater than or equal to the second number;

the page display module includes:

and the carousel element display unit is configured to execute carousel animation configuration objects corresponding to the second number of carousel animation layers, and display carousel display elements corresponding to the second number of carousel animation layers on the animation page.

In one possible design, the second number of carousel animation layers includes a first carousel animation layer, and the configuration object allocation unit is further configured to perform:

In one possible design, the carousel element presentation unit is further configured to perform:

In one possible design, the configuration object creation module is further configured to perform:

In one possible design, the animation configuration information includes display configuration information, and the target layer determining module includes:

the element position determining unit is configured to determine current display position information of the display elements in the animation to be displayed based on the display configuration information;

a display element determination unit configured to perform determination of a target display element of the animation page based on the current display position information;

and the target layer determining unit is configured to execute animation layers corresponding to the target display elements to obtain the target animation layers with the target number.

In one possible design, the presentation element determination unit is specifically configured to perform:

In one possible design, the page display module includes:

the media resource obtaining unit is configured to execute a configuration object corresponding to an animation layer in an animation playing state in the target number of target animation layers, and obtain a first media resource corresponding to the animation layer in the animation playing state;

and the display element display unit is configured to display the display element corresponding to the animation layer in the animation playing state on the animation page based on the first media resource.

In one possible design, the media resource obtaining unit is configured to execute a configuration object corresponding to an animation layer in a static state in the target number of target animation layers, and obtain a second media resource corresponding to the animation layer in the static state from a cache;

the display element display unit is further configured to display, on the animation page, the display element corresponding to the animation layer in the static state based on the second media resource.

In one possible design, the page display module includes:

the layer information determining unit is configured to determine, based on the configuration object, first layer configuration information corresponding to the target number of target animation layers in a current animation frame, and second layer configuration information corresponding to the target number of target animation layers in a previous animation frame;

the layer information matching unit is configured to perform matching processing on the first layer configuration information and the second layer configuration information to obtain a matching result;

the first layer determining unit is configured to execute the target animation layers with the difference as the matching result in the target animation layers with the target number as the first animation layers;

the media resource acquisition unit is configured to execute acquisition of a third media resource corresponding to the first animation layer;

and the display element display unit is configured to display the display element corresponding to the first animation layer on the animation page based on the third media resource.

In one possible design, the page display module further includes:

the second layer determining unit is configured to execute the target animation layers with no difference in matching result in the target animation layers with the target number as second animation layers;

the display element display unit is further configured to execute displaying of a display element corresponding to the second animation layer on the animation page based on second layer configuration information corresponding to the second animation layer.

According to a third aspect of the embodiments of the present disclosure, there is provided an electronic apparatus including: a processor; a memory for storing the processor-executable instructions; wherein the processor is configured to execute the instructions to implement the method of any of the first aspects above.

According to a fourth aspect of embodiments of the present disclosure, there is provided a computer-readable storage medium, wherein instructions, when executed by a processor of an electronic device, enable the electronic device to perform the method of any one of the first aspects of the embodiments of the present disclosure.

According to a fifth aspect of the embodiments of the present disclosure, there is provided a computer program product containing instructions which, when run on a computer, cause the computer to perform the method of any one of the first aspects of the embodiments of the present disclosure.

The technical scheme provided by the embodiment of the disclosure at least brings the following beneficial effects:

in the animation rendering process, a target animation layer corresponding to a current display element in an animation page is determined according to animation configuration information of an animation to be displayed, a configuration object corresponding to each target animation layer is obtained, the target display element corresponding to each target animation layer is rendered in the animation page based on the configuration object corresponding to each target animation layer, independent rendering of the target display element corresponding to each target animation layer is achieved, and therefore it can be guaranteed that only the current display element needs to be rendered in the animation rendering process, rendering of non-current display elements is not needed, the amount of calculation needed by animation rendering is effectively reduced, and animation rendering efficiency is effectively improved.

It is to be understood that both the foregoing general description and the following detailed description are exemplary and explanatory only and are not restrictive of the disclosure.

Drawings

The accompanying drawings, which are incorporated in and constitute a part of this specification, illustrate embodiments consistent with the present disclosure and, together with the description, serve to explain the principles of the disclosure and are not to be construed as limiting the disclosure.

FIG. 1 is a schematic diagram illustrating an application environment in accordance with an illustrative embodiment;

FIG. 2 is a flowchart one of a page display method according to an exemplary embodiment;

FIG. 3 is a flowchart II illustrating a page display method in accordance with an exemplary embodiment;

FIG. 4 is a flowchart three illustrating a page display method in accordance with an exemplary embodiment;

FIG. 5 is a fourth flowchart illustrating a page display method in accordance with an exemplary embodiment;

FIG. 6 illustrates a flowchart of an application loading animation;

FIG. 7 is a block diagram illustrating a page display apparatus according to an exemplary embodiment;

FIG. 8 is a block diagram illustrating an electronic device for page display in accordance with an exemplary embodiment.

Detailed Description

In order to make the technical solutions of the present disclosure better understood by those of ordinary skill in the art, the technical solutions in the embodiments of the present disclosure will be clearly and completely described below with reference to the accompanying drawings.

It should be noted that the terms "first," "second," and the like in the description and claims of the present disclosure and in the above-described drawings are used for distinguishing between similar elements and not necessarily for describing a particular sequential or chronological order. It is to be understood that the data so used is interchangeable under appropriate circumstances such that the embodiments of the disclosure described herein are capable of operation in sequences other than those illustrated or otherwise described herein. The implementations described in the exemplary embodiments below are not intended to represent all implementations consistent with the present disclosure. Rather, they are merely examples of apparatus and methods consistent with certain aspects of the present disclosure, as detailed in the appended claims.

It should be noted that the user information (including but not limited to user device information, user personal information, etc.) and data (including but not limited to data for presentation, analyzed data, etc.) referred to in the present disclosure are information and data authorized by the user or sufficiently authorized by each party.

Referring to fig. 1, fig. 1 is a schematic diagram illustrating an application environment according to an exemplary embodiment, and as shown in fig. 1, the application environment may include a terminal 100 and a server 200.

The terminal 100 may have an application installed therein and display a corresponding application page to any user. Optionally, animations are included in the application page. Specifically, the terminal 100 may include, but is not limited to, a smart phone, a desktop computer, a tablet computer, a laptop computer, a smart speaker, a digital assistant, an Augmented Reality (AR)/Virtual Reality (VR) device, a smart wearable device, and other types of electronic devices, and may also be software running on the electronic devices, such as an application program. Optionally, the operating system running on the electronic device may include, but is not limited to, an android system, an IOS system, Linux, Windows, and the like.

In an alternative embodiment, the server 200 may provide a background service for the terminal 100. Specifically, the server 200 may be an independent physical server, a server cluster or a distributed system formed by a plurality of physical servers, or a cloud server providing basic cloud computing services such as a cloud service, a cloud database, cloud computing, a cloud function, cloud storage, a Network service, cloud communication, a middleware service, a domain name service, a security service, a CDN (Content Delivery Network), a big data and artificial intelligence platform, and the like.

In addition, it should be noted that fig. 1 shows only one application environment provided by the present disclosure, and in practical applications, other application environments may also be included, for example, more terminals may be included.

In the embodiment of the present specification, the terminal 100 and the server 200 may be directly or indirectly connected through wired or wireless communication, and the disclosure is not limited herein.

Fig. 2 is a flowchart illustrating a page display method according to an exemplary embodiment, where the page display method is used in a terminal electronic device, as shown in fig. 2, and includes the following steps (S210 to S240).

Step S210, obtaining the animation configuration information of the animation to be displayed in the animation page.

The animation page refers to a page on which animation can be displayed. For example, the animation page is an application page of an application program.

The animation to be displayed refers to animation displayed in an animation page. The animation to be displayed can be a Lottie animation. Lottie is a library which supports Android, iOS and ReactNative and realizes animation effects by adopting a JSON (JavaScript Object Notation) file.

The animation to be presented comprises a plurality of animation frames. For each animation frame in an animation, a plurality of animation layers (namely animation layers) can be superposed. The layers in the animation are similar to a stack of transparent paper, each paper has a different picture, and the paper is stacked together to form a more complex picture.

Optionally, the animation to be presented has a corresponding time axis. The timeline is used to organize and control animation changes and actions. The number of animation frames and the location of each frame can be identified by the timeline. For example, each scale in the time axis represents a frame, and the numbers thereon represent the sequence numbers of the frames.

The animation to be displayed has a corresponding animation file. The animation file can be generated and exported through graphic software or video software. Optionally, the animation file is formed by exporting animation designed by an animation designer through a plug-in of graphic software or video software. Optionally, the animation file includes a data file and an image file, wherein the image file includes a plurality of pictures. The data file comprises structure data, layer data and element data. The structure data includes the width and height of the animation canvas, the background color, the time, the starting frame, the ending frame, the frame number and the like. The layer data includes each layer (such as a shape layer, a text layer, a light layer, etc.) of the animation and a frame included in each layer, each frame can be regarded as a sub-layer of the corresponding layer, the layers can be obtained by synthesizing the frames (sub-layers) in the same layer, and the corresponding animation can be obtained by superposing the layers. The element data includes information of elements in each layer, each element corresponding to one layer. For example, for an element of text, attribute data such as size, color, font, etc. of characters in the text may be included in the data file; for this element of the picture, attribute data such as the name, storage path, width, and height of the picture may be included in the data file.

The form of the animation file may include a JSON file. JSON is a lightweight data exchange format. The animation file can be put to a server and sent to the client when the client calls. The animation file can also be directly placed on the client.

The client can analyze the animation file and obtain the animation configuration information of the animation to be displayed. For example, the client asynchronously loads the animation file into the memory, so that the main thread is not occupied, and the calculation pressure is reduced. The client can also cache the animation file, and the animation file does not need to be analyzed next time when being multiplexed.

The animation configuration information may be invoked when an animation is played. Animation configuration information may include, but is not limited to, resource information, layer information, font information, and other information. Other information may be understood as information that does not affect animation synthesis, such as name information, among others.

The resource information (assets) may provide media resources for the image layer. The resource information may include a media resource associated with a presentation element corresponding to each animation layer, where the media resource may correspond to a resource path identifier. The application program can call the corresponding media resource according to the resource path identifier. The media resources include, but are not limited to, picture, video, audio, and other media types.

The layer information (layers) may include information for one or more layers. The layer information may include information layer information of a plurality of layers, which may include resource reference identifiers, time parameter information, size information, layer transformation attribute information, and the like. The time parameter information may include an animation start frame, an animation end frame, a start time, and the like. The size information may include width information and height information. The layer transformation attribute information may include anchor point attribute information, position attribute information, transparency attribute information, transformation rotation attribute information, scaling attribute information, anchor point attribute information, and the like.

Step S220, based on the animation configuration information, determining a target number of target animation layers corresponding to the animation page.

And the target display elements corresponding to the target animation layers with the target number are elements currently displayed in the animation page.

The animation layers are similar to a stack of transparent paper, different display elements correspond to the animation layers, and the display elements corresponding to the animation layers are stacked together to form a relatively complex picture. If a display element is placed at a certain position in the previous animation layer, the display element at the same position in the next animation layer may be blocked and cannot be displayed on the screen. If no display element is placed at a certain position of the previous animation layer, the display element at the same position in the next animation layer cannot be blocked, and the display element at the same position in the next animation layer can be seen at the position of the previous animation layer. Each layer in the animation is independent of the other.

The current presentation element refers to a presentation element that can be displayed in an animation page. For example, a picture corresponding to the current animation frame is displayed in the animation page, the current display element is a display element displayed in the animation page at the time corresponding to the current animation frame, and the occluded display element does not belong to the current display element.

And obtaining the target display element by judging whether the display element in each animation layer is the current display element currently displayed in the animation page. And the animation layer corresponding to the target display element is a target animation layer. The target animation layer is an animation layer in which display elements in the layer are displayed in an animation page at the current moment, and the target number is a variable numerical value and is a positive integer greater than or equal to 0. Optionally, the target number is the number of animation layers corresponding to the current display element displayed in the animation page at the current time.

In an exemplary embodiment, the animation configuration information includes presentation configuration information. The display configuration information is used for indicating display information of display elements corresponding to the animation layers. The display configuration information comprises display position information corresponding to the display elements at each moment in the animation process.

Accordingly, as shown in fig. 3, the implementation process of the step S220 may include the following steps (S221 to S223), and fig. 3 is a flowchart two illustrating a page display method according to an exemplary embodiment.

Step S221, determining the current display position information of the display elements in the animation to be displayed based on the display configuration information.

And obtaining the display position of the display element at the current moment corresponding to the current animation frame from the display position information corresponding to the display element at each moment in the animation process in the display position information. And the current display position information is the display position of the display element at the current moment corresponding to the current animation frame. The display position may be a coordinate value corresponding to a screen coordinate system.

Step S222, based on the current display position information, determining a target display element of the animation page.

The target display element is a display element of the display position at the current moment in the animation page. Whether the display element is the target display element or not can be determined by judging whether the display position of the display element at the current moment corresponding to the current animation frame is in the animation page or not. If the display element is in the page, the display element can be determined to be a target display element; if not, the presentation element may be determined to be a non-target presentation element.

In an exemplary embodiment, the implementation process of step S222 includes: and in the case that the current display position information indicates that the display element is positioned in the screen, determining the display element as a target display element.

Step S223, obtaining a target number of target animation layers based on the animation layers corresponding to the target display elements.

And the animation layer corresponding to the target display element is the target animation layer.

The target display element displayed currently in the animation page is determined through the current display position information of the display element, the target display layer corresponding to the target display element is determined, the target animation layer displayed currently in the animation page in each animation layer in the animation to be displayed can be accurately and timely determined, and guarantee is provided for subsequent on-demand rendering of layers.

Step S230, obtaining configuration objects corresponding to the target animation layers.

The configuration object is used for loading display elements in the rendering animation layer, and the configuration object comprises display element configuration information of the corresponding display elements. The display element configuration information is configuration information of the display element in the animation process. For example, the configuration information of the presentation element includes, but is not limited to, configuration information such as position information, size information, scaling information, transparency information, graphic transformation information, and anchor point information corresponding to the presentation element at each time in the animation process.

In some application scenarios, the configuration object is a View (View) in an application. Optionally, animation layers in the animation to be displayed each have a corresponding View. The animation layers and the views may or may not be in one-to-one correspondence, and may specifically be determined according to an application scene, for example, display elements between two animation layers are displayed in a bound manner, appear simultaneously, and disappear simultaneously, the display elements corresponding to the two animation layers may be loaded and rendered through one View, the amount of computation and the complexity of a program are reduced, and configuration objects corresponding to the animation layers where other display elements are located are independent, so that the animation rendering efficiency can be further improved.

In the related technology, one View corresponds to the whole animation, so that display elements corresponding to all animation layers and media resources corresponding to all the display elements need to be loaded during animation rendering, the display elements in each animation layer cannot be loaded and rendered independently, the media resources are loaded in a main thread, the memory is large, and the animation effect is blocked. In the technical scheme provided by the embodiment of the disclosure, the configuration objects corresponding to each animation layer in the animation to be displayed are independent and do not affect each other, and the animation layers can be drawn separately and drawn as required. For some non-current display elements which are not displayed in the animation page currently, a configuration object corresponding to the animation layer where the non-current display elements are located does not need to be obtained, and the rendering process of the non-current display elements does not need to be executed, so that the animation rendering calculation amount can be reduced, the animation rendering efficiency is improved, and the animation is prevented from being stuck.

Optionally, the target animation layers each correspond to a separate configuration object.

Before the step S230, a configuration object corresponding to the animation layer of the animation to be displayed needs to be created, and the following embodiments may be referred to in the creation process of the configuration object.

In an exemplary embodiment, the animation configuration information includes carousel animation identification information. The carousel animation identification information can be used as a basis for judging whether the animation to be displayed comprises the carousel animation. Accordingly, as shown in fig. 3, the method further includes the following steps (S250 to S260).

And step S250, under the condition that the carousel animation identification information indicates that the animation to be displayed comprises the carousel animation, determining a carousel animation layer corresponding to the carousel animation.

The carousel animation refers to animation in which display elements are displayed in a page in a circulating manner according to a certain frequency. Optionally, the carousel animation comprises a masked carousel animation. In one example, during the playing process of the covering carousel animation, the next carousel picture to be displayed can be moved out from the edge of the screen and displayed above the current carousel picture in a covering mode until the current recorded broadcast picture is completely covered, and then the process is executed in a circulating mode on all carousel pictures. The type of the carousel animation is not limited in the embodiment of the application, and can be determined according to a specific scene.

The carousel animation identification information includes layer position information and layer size information. In a possible implementation manner, first layer size information and first layer position information of a display element corresponding to a current animation layer when the display is finished, and second layer size information and second layer position information of a display element corresponding to a previous animation layer when the display is finished are determined, whether the first layer size information and the first layer position information of the current animation layer are equal to the second layer size information and the second layer position information of the previous animation layer is judged, and whether the current animation layer covers the previous animation layer is judged. And determining that the animation to be displayed comprises carousel animation when the first layer size information and the first layer position information are respectively equal to the second layer size information and the second layer position information and the current animation layer is covered on the previous animation layer.

Further, according to the layer position information and the layer size information, a carousel animation layer corresponding to the carousel animation in each animation layer of the animation to be displayed can be determined. For example, traversing each animation layer according to the above-mentioned determination method, determining that the layer size information and the layer position information of the display element at the end of the display are the same, and cyclically capping the layers between the layers, that is, the carousel animation layer corresponding to the carousel animation. The method for judging whether the animation to be displayed comprises the carousel animation is not limited, and the corresponding judging method can be determined according to the specific carousel animation type.

Step 260, a first number of carousel animation configuration objects corresponding to the carousel animation layers are created.

The number of layers of the carousel animation layers is greater than or equal to the first number. The carousel animation configuration object is used for loading and rendering carousel display elements in the carousel animation picture layer.

In some application scenarios, it is common for a carousel animation to have multiple carousel presentation elements and to perform a circular carousel presentation, but at most, only a limited number of carousel presentation elements can be presented simultaneously in an animation page. Therefore, in order to reduce the amount of computation required for rendering the animation, in the embodiment of the present disclosure, a first number of carousel animation configuration objects may be created for a carousel animation layer, where the first number is the maximum number of carousel display elements that can be simultaneously displayed in an animation page, and the first number of carousel animation configuration objects may be reused subsequently, and the animation layer where the carousel display element that is not currently displayed is located may be rendered without allocating a configuration object, and only the configuration object is allocated for the animation layer where the carousel display element that is currently displayed is located to be rendered, so that the amount of computation required for rendering the animation is effectively reduced.

In an exemplary embodiment, for an animation layer corresponding to a non-carousel animation in an animation to be presented, a corresponding configuration object is also created. Correspondingly, as shown in fig. 3, a corresponding configuration object is created for the non-carousel animation layer, and the method further includes step S270.

Step S270, creating configuration objects corresponding to non-carousel animation layers in the animation to be displayed.

The non-carousel animation layer refers to an animation layer except for a carousel animation layer corresponding to the carousel animation in the animation layer to be displayed. For the non-carousel animation layers, the application program can create configuration objects corresponding to the non-carousel animation layers, and can separate the rendering process of each non-carousel animation layer so as to achieve independent rendering and each non-carousel animation layer as required.

In an exemplary embodiment, the target number of target animation layers includes a third number of non-carousel animation layers. Accordingly, as shown in fig. 3, the method further includes step S232 and step S240 c. The step S232 can be a sub-step of the step S230.

Step S232, determining configuration objects corresponding to the third number of non-carousel animation layers.

The third number of non-carousel animation layers refers to animation layers, except for carousel animation layers, in the target number of target animation layers. And the display elements corresponding to the third number of non-carousel animation layers belong to the current display elements of the animation page.

The configuration objects corresponding to the non-carousel animation layers are created in step S270. Here, the configuration objects corresponding to the third number of non-carousel animation layers may be determined according to the correspondence between the animation layers and the configuration objects. For example, the corresponding configuration object is determined according to the animation layer identifier.

Step S240c, based on the configuration objects corresponding to the third number of non-carousel animation layers, displaying, on the animation page, display elements corresponding to the third number of non-carousel animation layers.

The configuration objects corresponding to the third number of non-carousel animation layers respectively include display configuration information of the third number of non-carousel animation layers, specifically, but not limited to, configuration information such as layer size information, layer position information, size information of display elements in the layers, position information, and transformation information.

And drawing display elements corresponding to the third number of non-carousel animation layers in the animation page based on the display configuration information.

In an exemplary embodiment, the target number of target animation layers includes a second number of carousel animation layers corresponding to carousel presentation elements currently presented in the animation page. Correspondingly, the target display elements include carousel display elements corresponding to the second number of carousel animation layers. Accordingly, as shown in fig. 3, the implementation process of the step S230 includes the following sub-step S231.

Step S231, determining carousel animation configuration objects corresponding to respective second number of carousel animation layers from the first number of carousel animation configuration objects.

The first number is greater than or equal to the second number.

The second number of carousel animation layers refers to carousel animation layers corresponding to carousel display elements currently displayed in the animation page. The first number is the maximum number of carousel display elements which can be displayed simultaneously in the animation page, so that the first number is larger than or equal to the second number.

Alternatively, in the case that the first number is equal to the second number, the carousel animation configuration objects may be allocated to the second number of carousel animation layers one by one.

Optionally, when the first number is greater than the second number, a second number of carousel animation configuration objects may be selected from the first number of carousel animation configuration objects, and the second number of carousel animation configuration objects may be allocated to the second number of carousel animation layers one by one.

Step S240a may be executed if the target animation layers include a second number of carousel animation layers and the target display elements include carousel display elements corresponding to the second number of carousel animation layers.

Step S240a, based on the carousel animation configuration objects corresponding to the second number of carousel animation layers, displaying carousel display elements corresponding to the second number of carousel animation layers on an animation page.

The carousel animation configuration objects corresponding to the second number of carousel animation layers respectively include display configuration information of the second number of carousel animation layers, specifically, but not limited to, configuration information such as layer size information, layer position information, size information of carousel display elements in the layers, position information, and transformation information.

And drawing carousel display elements corresponding to the second number of carousel animation layers in the animation page based on the display configuration information.

And distributing the carousel animation configuration objects corresponding to the second number of carousel animation layers to independently render carousel display elements corresponding to the currently displayed carousel animation layers, so that the carousel animation rendering efficiency is improved.

In an exemplary embodiment, the second number of carousel animation layers includes the first carousel animation layer. The first carousel animation layer is any one of the second number of carousel animation layers. Under the condition that the display of the first carousel display element corresponding to the first carousel animation layer is finished, the configuration object corresponding to the first carousel animation layer can be reallocated to other carousel animation layers to be displayed in the animation page. Accordingly, as shown in fig. 3, the method further includes the following step S280.

Step S280, when the display of the first carousel display element corresponding to the first carousel animation layer is finished, taking the first carousel animation configuration object corresponding to the first carousel animation layer as the carousel animation configuration object corresponding to the second carousel animation layer.

The first carousel animation layer is any one of the second number of carousel animation layers, and a first carousel display element corresponding to the first carousel animation layer belongs to a current display element in the animation page.

In the animation display process of the carousel animation, carousel display elements are circularly and alternately displayed in an animation page, and when the carousel display elements are moved out of the animation page or are covered by other display elements in the animation page, namely the carousel display elements are not displayed in the animation page, the carousel display elements can be considered to be displayed completely.

The configuration object corresponding to the first carousel animation layer where the first carousel display element is located may be referred to as a first carousel animation configuration object. Since the carousel animation configuration object is alternately multiplexed by each carousel animation layer, the first carousel animation configuration object needs to be reset and allocated to the next carousel animation layer to be displayed when the first carousel display element is displayed. Therefore, the carousel display elements can be rendered as required, the required calculation amount for rendering the carousel animation is effectively reduced, and the rendering efficiency of the carousel animation is improved.

And the second carousel animation layer is a carousel animation layer corresponding to the second carousel display element displayed after the first carousel display element. The second carousel animation layer may be a carousel animation layer in the second number of carousel animation layers, or may be a carousel animation layer other than the second number of carousel animation layers.

In one possible implementation, the first carousel presentation element and the second carousel presentation element may be the same carousel presentation element. And under the condition that the first carousel display element and the second carousel display element are the same carousel display element, maintaining the corresponding relation between the first carousel animation configuration object and the first carousel animation layer without redistribution. Here, a case where the first carousel presentation element and the second carousel presentation element are the same carousel presentation element is explained by an example. The carousel display elements of the carousel animation comprise a carousel display element 1 and a carousel display element 2, the carousel display element 1 and the carousel display element 2 are displayed in the animation page in a circulating mode, the carousel display element 2 is moved out of the carousel display element 1 until the carousel display element 1 is completely covered, and the carousel display element 1 is displayed completely. The carousel presentation element 1 may be considered as the first carousel presentation element. Because there are only two carousel display elements, after the carousel display element 1 is displayed, the carousel display element 1 needs to be moved out from above the carousel display element 2 and displayed in an animation page, where the carousel display element 1 is a second carousel display element displayed after the first carousel display element, and there is no need to reset and update the configuration object.

In an exemplary embodiment, as shown in fig. 3, after the above-described step S280, step S240b may be performed.

Step S240b, displaying a second carousel presentation element on the animation page based on the first carousel animation configuration object.

Before the first carousel animation configuration object is reset, the first carousel animation configuration object comprises display configuration information of a first carousel animation layer; after the first carousel animation configuration object is reset and allocated to the second carousel animation layer, the first carousel animation configuration object includes display configuration information of the second carousel animation layer. Therefore, the second carousel display element is drawn in the animation page based on the display configuration information of the second carousel animation layer in the first carousel animation configuration object. By multiplexing the carousel animation configuration objects, the complexity and the calculation amount of an application program are effectively reduced, and the carousel animation rendering efficiency is effectively improved.

Step S240, displaying the target display element on the animation page based on the configuration object.

In an exemplary embodiment, as shown in fig. 4, the implementation process of the above step 240 may include the following steps (S241 to S244), and fig. 4 is a flowchart three illustrating a page display method according to an exemplary embodiment.

Step S2401, based on the configuration object corresponding to the animation layer in the animation playing state in the target number of target animation layers, obtaining a first media resource corresponding to the animation layer in the animation playing state.

The animation layer in the animation playing state refers to the animation layer in the animation playing stage at the current animation frame. For example, the animation to be displayed has 100 animation frames, and the animation playing stage of one animation layer in the target number of target animation layers is from 10 th frame to 30 th frame. And if the current animation frame is the 20 th frame, the animation layer is the animation layer in the animation playing state.

In one possible implementation, it is determined whether the animation layer in the animation playing state is in the animation playing stage at the current animation frame. If so, it is indicated that the animation layer in the animation playing state needs to be animated in the current animation frame and display the display element, and whether the display element corresponding to the animation layer in the animation playing state has the associated media resource can be further determined. The first media resource is a media resource associated with a display element corresponding to an animation layer in an animation playing state. Media assets include, but are not limited to, picture, video, audio, and like media types.

The reason why whether the animation layer in the animation playing state has the associated media resource is judged here is that if the display element does not have the associated media resource, the associated media resource does not need to be called, and the drawing and rendering can be performed in the animation page. For example, the display elements are characters, and can be directly displayed in the animation page according to display configuration information such as font information, font size information and the like.

Therefore, if the display element corresponding to the animation layer in the animation playing state does not have the associated media resource, namely the first media resource, the corresponding configuration object is directly rendered without calling the first media resource, and the display element corresponding to the animation layer in the animation playing state is displayed; if the display element corresponding to the animation layer in the animation playing state has an associated media resource, namely the first media resource, whether the first media resource is in the cache can be further judged, and if so, the first media resource is obtained from the cache; if not, the first media resource is asynchronously loaded to the memory, the first media resource is cached and stored in the cache pool, and when the first media resource needs to be used next time, the first media resource is directly multiplexed from the cache, so that the efficiency is improved. In addition, the asynchronous loading mode does not influence the application process on the main thread, the application running pressure can be reduced, and the animation playing fluency can be improved.

Step S2402, displaying a display element corresponding to the animation layer in the animation playing state on the animation page based on the first media resource.

After the first media resource is obtained, the corresponding display element can be drawn in the animation page according to the display configuration information of the animation layer in the configuration object corresponding to the animation layer in the animation playing state.

According to the method and the device for acquiring the media resource, the mode for acquiring the media resource is determined by judging the animation state of the animation layer, the media resource rendering animation is acquired according to the requirement, the animation rendering accuracy is guaranteed, and meanwhile the running pressure of the main thread is effectively relieved.

Step S2403, based on the configuration objects corresponding to the animation layers in the static state in the target number of target animation layers, obtaining the second media resources corresponding to the animation layers in the static state from the cache.

In one possible implementation, it is determined whether the current animation layer is in an animation playing stage at the current animation frame. If not, the current animation layer is not animated in the current animation frame, and the current animation layer is the animation layer in the static state. The media resources associated with the animation layers in the static state are asynchronously loaded and cached to be completed before. Therefore, the second media resource corresponding to the static animation layer can be obtained from the cache, and the running pressure of the main thread is reduced.

Step S2404, displaying the display element corresponding to the animation layer in the static state on the animation page based on the second media resource.

After the second media resource is obtained, the corresponding display element can be drawn in the animation page according to the display configuration information of the animation layer in the configuration object corresponding to the animation layer in the static state.

According to the embodiment of the disclosure, the media resources of the animation layer in the static state are obtained from the cache, so that the operating pressure of the main thread of the application program is effectively reduced, and the smoothness of animation rendering is ensured.

In an exemplary embodiment, as shown in fig. 5, the implementation process of the step S240 may further include the following steps (S2405 to S2411), and fig. 5 is a fourth flowchart of a page display method according to an exemplary embodiment.

Step S2405, based on the configuration object, determining first layer configuration information corresponding to the target number of target animation layers in the current animation frame, and second layer configuration information corresponding to the target number of target animation layers in the previous animation frame.

The configuration object comprises layer configuration information corresponding to the animation layer at each moment. The layer configuration information comprises configuration data such as transparency data, rotation data, position data, anchor point data and scaling data.

For any animation layer in the target animation layers, the first layer configuration information of the animation layer comprises configuration data such as transparency data, rotation data, position data, anchor point data, scaling data and the like corresponding to the animation layer in the current animation frame. The second layer configuration information of the animation layer includes configuration data such as transparency data, rotation data, position data, anchor point data, scaling data and the like corresponding to the previous animation frame of the animation layer.

Step S2406, matching the first layer configuration information and the second layer configuration information to obtain a matching result.

The above-mentioned matching processing of the first layer configuration information and the second layer configuration information means that whether the first layer configuration information and the second layer configuration information of each animation layer in the target number of target animation layers are the same, that is, whether the animation layer is in a static state is judged. If the two layers are the same, the matching result indicates that no difference exists between the first layer configuration information and the second layer configuration information, which indicates that the animation layer does not change between the previous animation frame and the current animation frame, and the animation layer is in a static state; if the two layers are different, the matching result is that the first layer configuration information and the second layer configuration information are different, which indicates that the animation layer changes between the previous animation frame and the current animation frame, and the animation layer is in a changing state.

Step S2407, the target animation layers with the difference in the matching result are used as first animation layers in the target number of target animation layers.

The first animation layer is an animation layer in a changing state in a target number of target animation layers.

Step S2408, a third media resource corresponding to the first animation layer is obtained.

In a possible implementation manner, whether a display element corresponding to the current animation layer has an associated media resource may be further determined. The third media resource is a media resource associated with a display element corresponding to the animation layer in the change state. Media assets include, but are not limited to, picture, video, audio, and like media types.

The reason for judging whether the display element has the associated media resource is that if the display element does not have the associated media resource, the drawing and rendering can be performed in the animation page without calling the associated media resource. For example, the display elements are characters, and can be directly displayed in the animation page according to display configuration information such as font information, font size information and the like.

Therefore, if the display element corresponding to the first animation layer does not have the associated media resource, the media resource does not need to be called, and the display element corresponding to the first animation layer is directly rendered and displayed according to the configuration object; if the display element corresponding to the first animation layer has the associated media resource, namely the third media resource, whether the third media resource is in the cache can be further judged, and if yes, the third media resource is obtained from the cache; if not, the third media resource is asynchronously loaded to the memory, and the third media resource is cached and stored in the cache pool, and when the third media resource needs to be used next time, the third media resource is directly multiplexed from the cache, so that the efficiency is improved. In addition, the asynchronous loading mode does not affect the application process on the main thread, the application running pressure can be reduced, and the animation playing fluency can be improved.

Step S2409, displaying a display element corresponding to the first animation layer on the animation page based on the third media resource.

After the third media resource is obtained, the corresponding display element can be drawn in the animation page according to the layer configuration information of the animation layer in the configuration object corresponding to the first animation layer.

According to the embodiment of the disclosure, whether the animation layer changes between the front animation frame and the rear animation frame or not is detected, the animation layer which needs to be rendered and is in a changing state is determined, the corresponding media resource is obtained to perform corresponding animation rendering, display elements corresponding to the animation layer are prevented from being repeatedly rendered, and animation rendering efficiency is effectively improved.

Step S2410, taking the target animation layers with no difference as the matching results in the target animation layers with the target number as second animation layers.

The second animation layer is an animation layer in a static state in a target number of target animation layers.

Step S2411, displaying display elements corresponding to the second animation layer on the animation page based on second layer configuration information corresponding to the second animation layer.

If the animation layer is in a static state, the animation layer does not need to be repeatedly rendered, only the display elements corresponding to the second animation layer need to be kept displayed by the animation page, and the display elements corresponding to the second animation layer are still displayed according to the display elements corresponding to the second animation layer of the previous animation frame of the animation layer, so that the display elements corresponding to the animation layer can be rendered according to the requirement, and the animation rendering efficiency is improved.

In summary, according to the embodiments provided by the present disclosure, in an animation rendering process, according to animation configuration information of an animation to be displayed, a target animation layer corresponding to a current display element in an animation page is determined, and a configuration object corresponding to each target animation layer is obtained, and a target display element corresponding to each target animation layer can be rendered in the animation page based on the configuration object corresponding to each target animation layer, so that the target display element corresponding to each target animation layer is independently rendered, and thus it can be ensured that only the current display element needs to be rendered in the animation rendering process, and no non-current display element needs to be rendered, which effectively reduces a calculation amount required by animation rendering, and effectively improves animation rendering efficiency.

FIG. 6 illustrates a flow diagram of an application loading animation. As shown in FIG. 6, the application loading animation includes the following steps (S01-S26).

And S01, acquiring the animation file of the animation to be displayed.

And (4) making the animation to be displayed through animation software, and generating the JSON file of the animation to be displayed through a conversion tool.

The JSON file can be placed on a server and is issued to the client by the server. The JSON file can also be placed directly on the client.

Optionally, the JSON file is set in an application program of the client, and the client may start to call the animation to be displayed according to the relevant instruction. Specifically, the client asynchronously loads the JSON file into the memory and caches the JSON file. The buffer size is controlled by service, multiplexed next time and not analyzed again.

And S02, analyzing the animation file to obtain animation configuration information.

A Composition information (Composition), i.e. the above animation configuration information, is generated, which includes the layer information and the resource information. The layer information refers to an animation information set corresponding to each animation layer. Such as the start and end frames of the entire animation, and the animation frame rate. The resource information comprises media resource information required by the animation to be shown. Such as a picture.

Each animation layer contains an animation process of the animation layer. For example, the animation start frame is the 20 th frame; the animation end frame is the 50 th frame. The display elements in the animation layer are animated at the stage from the animation start frame to the animation end frame. In addition, the layer information also comprises information such as transparency data, rotation data, position data, anchor point data, scaling data and the like, and is used for determining the animation process of the display element corresponding to the animation layer.

And S03, judging whether the carousel animation exists in the animation to be displayed. If yes, the process starts from step S04; if not, the process starts at step S06.

Specifically, whether the carousel animation exists in the animation to be displayed is judged through the ending position of the picture, the refreshing time and the animation process. The judgment method for carousel animation has already been explained in the above embodiments, and is not described here again.

And S04, determining the carousel animation layer corresponding to the carousel animation.

S05, creating a first number of carousel animation configuration objects corresponding to the carousel animation layers.

In the covering type carousel animation, at most two recorded broadcast pictures are displayed in an animation page, so that 2 local layer views can be created, and layer animation of different carousel animation layers is rendered through the 2 views.

And S06, creating configuration objects corresponding to the non-carousel animation layers in the animation to be displayed.

Optionally, a local layer View (View, i.e., the configuration object) is created, one View is bound to one non-carousel animation layer, and each View can independently refresh the drawing. The View includes animation information of the non-carousel animation layer.

And S07, responding to the loading instruction of the animation to be displayed, and acquiring the current animation frame.

And starting the animation, circularly displaying each animation frame of the animation, and circulating from the starting frame to the ending frame.

And acquiring the current animation frame, and circulating all animation layers corresponding to the current animation frame.

And S08, acquiring the current animation layer of the current animation frame.

And S09, judging whether the display position of the current animation layer in the current animation frame is in the animation page. If yes, the process starts from step S10; if not, the process starts at step S17.

Optionally, the display range of the animation page is a terminal screen range. If the display position of the current animation layer in the current animation frame is not in the screen, the current animation layer is not rendered, unnecessary layer rendering is reduced, and animation rendering efficiency is improved.

And S10, judging whether the current animation layer is in the animation playing stage at the current animation frame. If yes, the process starts from step S11; if not, the process starts at step S17.

And for the animation layers which are not in the animation playing stage but in the animation static stage, the rendering is not repeated, and the next animation layer is directly traversed.

And S11, judging whether the current animation layer is in a static state. If not, the process starts from step S12; if so, execution begins at step S17.

The purpose of determining whether the current animation layer is in a static state is that although some animation layers are in an animation playing stage, the presentation element may be static in the animation playing stage. If the presentation element is static, the next animation layer may be traversed directly without repeatedly rendering the animation layer. If the display element is not static, the current animation layer needs to be animated in the current animation frame and the display element is displayed. Therefore, after judging whether the current animation layer is in a static state, if so, traversing the next animation layer; if not, whether the display element corresponding to the current animation layer has the associated media resource can be further judged.

And S12, judging whether the display element corresponding to the current animation layer has the associated media resource. If yes, the process starts from step S13; if not, the process starts at step S17.

For the animation layer without the associated media resources, the display elements of the animation layer can be rendered directly according to the corresponding configuration objects, and the media resources do not need to be called. For example, the animation layer corresponding to the text display element is an animation layer without an associated media resource, and can be directly rendered.

S13, determining whether the associated media resource is in the cache. If yes, the process starts from step S14; if not, the process starts at step S15.

And S14, acquiring the associated media resource from the cache.

S15, asynchronously loading the associated media asset.

And S16, displaying the display element corresponding to the current animation layer on the animation page based on the associated media resource.

And S17, judging whether the current animation layer is the last animation layer. If not, the process starts from step S18; if yes, the process starts at step S19.

And S18, taking the next animation layer of the current animation layer as the current animation layer.

And S19, judging whether the current animation frame is the last frame. If not, the process starts from step S20; if yes, go to step S21.

S20, the next animation frame of the current animation frame is set as the current animation frame.

And S21, stopping loading the animation to be displayed.

Alternatively, after the step S07, the following steps (S22 to S26) may be further included.

S22, obtaining the next animation frame of the current animation frame.

S23, it is determined whether to preload the associated media resource for the next animation frame. If yes, the process starts from step S24; if not, step S26 is executed.

The method comprises the steps of obtaining a next animation frame and judging whether the associated media resource of the next animation frame needs to be preloaded, and aims to preload the media resource, improve rendering efficiency, avoid the situation that a client reads the associated media resource in a main thread and solve the problem that the main thread is blocked.

S24, determining whether the buffer includes the associated media resource of the next animation frame. If not, go to step S25; if yes, go to step S26.

S25, the associated media asset for the next animation frame is asynchronously loaded.

And asynchronously loading and caching the associated media resource of the next animation frame, and directly multiplexing the associated media resource next time, so that the client is prevented from reading the associated media resource in the main thread, the problem of unsmooth main thread is solved, and the animation rendering efficiency is improved.

S26, the preloading of the associated media resource for the next animation frame is stopped.

In summary, according to the embodiments provided by the present disclosure, an animation layer displayed in a page is determined according to animation configuration information of an animation to be displayed; rendering is not carried out on the animation layers which are not displayed in the page, and whether the animation layers displayed in the page are in an animation playing state or not is further judged; the method comprises the steps of not repeatedly rendering an animation layer in a static state, further judging whether the animation layer in an animation playing state is in the static state, not repeatedly rendering the static animation layer in the animation playing state, and further judging whether the animation layer in a changing state has associated media resources; and directly rendering the animation layer without the associated media resource, further judging whether the associated media resource of the animation layer with the associated media resource is in a cache, if so, acquiring the associated media resource from the cache, otherwise, asynchronously loading the associated media resource, and finally displaying a display element corresponding to the current animation layer in the page. By distributing independent configuration objects for the animation layers and setting the judgment logic, the calculation amount required by rendering the animation can be effectively reduced, unnecessary layer rendering and repeated layer rendering are avoided, media resources can be obtained in an asynchronous loading mode and can also be obtained in a caching mode, the calculation pressure of the main thread of an application program is reduced, animation blockage is avoided, and the animation rendering efficiency is effectively improved.

Fig. 7 is a block diagram illustrating a page display apparatus according to an exemplary embodiment. Referring to fig. 7, the apparatus 700 includes:

a configuration information obtaining module 710 configured to perform obtaining animation configuration information of an animation to be shown in an animation page;

a target layer determining module 720, configured to determine, based on the animation configuration information, a target number of target animation layers corresponding to the animation page, where target display elements corresponding to the target number of target animation layers are currently displayed elements in the animation page;

a configuration object obtaining module 730, configured to perform obtaining of configuration objects corresponding to the target animation layers, where the configuration objects are used to load display elements in the rendered animation layers;

a page display module 740 configured to perform displaying the target presentation element on the animation page based on the configuration object.

In an exemplary embodiment, the animation configuration information includes carousel animation identification information, and the apparatus 700 further includes: the system comprises a carousel animation determination module and a configuration object creation module.

In an exemplary embodiment, the target number of target animation layers includes a second number of carousel animation layers corresponding to carousel display elements currently displayed in the animation page, where the target display elements include carousel display elements corresponding to respective carousel display elements of the second number of carousel animation layers, and the configuration object obtaining module 730 includes: configuration object allocation unit

And the configuration object distribution unit is configured to determine carousel animation configuration objects corresponding to the second number of carousel animation layers from the first number of carousel animation configuration objects, wherein the first number is greater than or equal to the second number.

The page display module 740 includes: and displaying the carousel elements.

In an exemplary embodiment, the second number of carousel animation layers includes a first carousel animation layer, and the configuration object allocation unit is further configured to perform:

In an exemplary embodiment, the carousel element presentation unit is further configured to perform:

In an exemplary embodiment, the configuration object creation module is further configured to perform:

In an exemplary embodiment, the animation configuration information includes presentation configuration information, and the target layer determining module 720 includes: the device comprises an element position determining unit, a display element determining unit and a target layer determining unit.

And the element position determining unit is configured to determine the current display position information of the display element in the animation to be displayed based on the display configuration information.

A display element determination unit configured to perform determining a target display element of the animation page based on the current display position information.

In an exemplary embodiment, the presentation element determining unit is specifically configured to perform:

In an exemplary embodiment, the page display module 740 includes: the media resource acquisition unit and the display element display unit.

In an exemplary embodiment, the media resource obtaining unit is configured to execute obtaining, from a cache, a second media resource corresponding to an animation layer in a static state based on a configuration object corresponding to an animation layer in a static state in the target number of target animation layers.

In an exemplary embodiment, the page display module 740 includes: the device comprises a layer information determining unit, a layer information matching unit, a first layer determining unit, a media resource acquiring unit and a display element displaying unit.

And the layer information determining unit is configured to determine, based on the configuration object, first layer configuration information corresponding to the target number of target animation layers in the current animation frame, and second layer configuration information corresponding to the target number of target animation layers in the previous animation frame.

And the layer information matching unit is configured to perform matching processing on the first layer configuration information and the second layer configuration information to obtain a matching result.

And the first layer determining unit is configured to execute the target animation layers with the difference as the matching result in the target animation layers with the target number as the first animation layers.

And the media resource acquisition unit is configured to execute acquisition of a third media resource corresponding to the first animation layer.

In an exemplary embodiment, the page display module 740 further includes: and a second layer determining unit.

And the second layer determining unit is configured to execute the target animation layer with no difference in the matching result in the target animation layers with the target number as the second animation layer.

With regard to the apparatus in the above-described embodiment, the specific manner in which each module performs the operation has been described in detail in the embodiment related to the method, and will not be elaborated here.

Fig. 8 is a block diagram illustrating an electronic device for page display, which may be a terminal, according to an exemplary embodiment, and an internal structure thereof may be as shown in fig. 8. The electronic device comprises a processor, a memory, a network interface, a display screen and an input device which are connected through a system bus. Wherein the processor of the electronic device is configured to provide computing and control capabilities. The memory of the electronic equipment comprises a nonvolatile storage medium and an internal memory. The non-volatile storage medium stores an operating system and a computer program. The internal memory provides an environment for the operation of an operating system and computer programs in the non-volatile storage medium. The network interface of the electronic device is used for connecting and communicating with an external terminal through a network. The computer program is executed by a processor to implement a page display method. The display screen of the electronic equipment can be a liquid crystal display screen or an electronic ink display screen, and the input device of the electronic equipment can be a touch layer covered on the display screen, a key, a track ball or a touch pad arranged on the shell of the electronic equipment, an external keyboard, a touch pad or a mouse and the like.

Those skilled in the art will appreciate that the architecture shown in fig. 8 is merely a block diagram of some of the structures associated with the disclosed aspects and does not constitute a limitation on the electronic devices to which the disclosed aspects apply, as a particular electronic device may include more or less components than those shown, or combine certain components, or have a different arrangement of components.

In an exemplary embodiment, there is also provided an electronic device including: a processor; a memory for storing the processor-executable instructions; wherein the processor is configured to execute the instructions to implement a page display method as in the embodiments of the present disclosure.

In an exemplary embodiment, there is also provided a computer-readable storage medium, in which instructions, when executed by a processor of an electronic device, enable the electronic device to perform a page display method in an embodiment of the present disclosure.

In an exemplary embodiment, there is also provided a computer program product containing instructions which, when run on a computer, cause the computer to perform the page display method in the embodiments of the present disclosure.

It will be understood by those skilled in the art that all or part of the processes of the methods of the embodiments described above can be implemented by hardware instructions of a computer program, which can be stored in a non-volatile computer-readable storage medium, and when executed, can include the processes of the embodiments of the methods described above. Any reference to memory, storage, database, or other medium used in the embodiments provided herein may include non-volatile and/or volatile memory, among others. Non-volatile memory can include read-only memory (ROM), Programmable ROM (PROM), Electrically Programmable ROM (EPROM), Electrically Erasable Programmable ROM (EEPROM), or flash memory. Volatile memory can include Random Access Memory (RAM) or external cache memory. By way of illustration and not limitation, RAM is available in a variety of forms such as Static RAM (SRAM), Dynamic RAM (DRAM), Synchronous DRAM (SDRAM), Double Data Rate SDRAM (DDRSDRAM), Enhanced SDRAM (ESDRAM), synchronous Link (Synchlink) DRAM (SLDRAM), Rambus (Rambus) direct RAM (RDRAM), direct bused dynamic RAM (DRDRAM), and bused dynamic RAM (RDRAM).

Other embodiments of the disclosure will be apparent to those skilled in the art from consideration of the specification and practice of the disclosure disclosed herein. This application is intended to cover any variations, uses, or adaptations of the disclosure following, in general, the principles of the disclosure and including such departures from the present disclosure as come within known or customary practice within the art to which the disclosure pertains. It is intended that the specification and examples be considered as exemplary only, with a true scope and spirit of the disclosure being indicated by the following claims.

It will be understood that the present disclosure is not limited to the precise arrangements described above and shown in the drawings and that various modifications and changes may be made without departing from the scope thereof. The scope of the present disclosure is limited only by the appended claims.

Claims

1. A page display method, comprising:

2. The page display method of claim 1, wherein the animation configuration information comprises carousel animation identification information, the method further comprising:

under the condition that the carousel animation identification information indicates that the animation to be displayed comprises carousel animation, determining a carousel animation layer corresponding to the carousel animation;

and creating a first number of carousel animation configuration objects corresponding to the carousel animation layers, wherein the number of the layers of the carousel animation layers is greater than or equal to the first number, and the carousel animation configuration objects are used for loading and rendering carousel display elements in the carousel animation layers.

3. The page display method according to claim 2, wherein the target number of target animation layers includes a second number of carousel animation layers corresponding to carousel display elements currently displayed in the animation page, the target display elements include carousel display elements corresponding to the second number of carousel animation layers, and the obtaining of the configuration objects corresponding to the target animation layers includes:

4. The method of displaying pages as recited in claim 3 wherein the second number of carousel animation layers comprises a first carousel animation layer, the method further comprising:

5. The page display method of claim 4, wherein said displaying the target presentation element on the animated page based on the configuration object further comprises:

6. The page display method according to claim 2, characterized in that the method further comprises:

7. A page display apparatus, comprising:

8. An electronic device, comprising:

a processor;

a memory for storing the processor-executable instructions;

wherein the processor is configured to execute the instructions to implement the page display method of any of claims 1 to 6.

9. A computer-readable storage medium, wherein instructions in the storage medium, when executed by a processor of an electronic device, enable the electronic device to perform the page display method of any of claims 1 to 6.

10. A computer program product comprising computer instructions, wherein the computer instructions, when executed by a processor, implement the page display method of any one of claims 1 to 6.