CN110704138B - Animation effect realization method and device and computer readable storage medium - Google Patents
Animation effect realization method and device and computer readable storage medium Download PDFInfo
- Publication number
- CN110704138B CN110704138B CN201810663668.2A CN201810663668A CN110704138B CN 110704138 B CN110704138 B CN 110704138B CN 201810663668 A CN201810663668 A CN 201810663668A CN 110704138 B CN110704138 B CN 110704138B
- Authority
- CN
- China
- Prior art keywords
- displayed
- unit
- view
- content
- page
- Prior art date
- Legal status (The legal status is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the status listed.)
- Active
Links
- 230000000694 effects Effects 0.000 title claims abstract description 51
- 238000000034 method Methods 0.000 title claims abstract description 38
- 230000003993 interaction Effects 0.000 claims description 9
- 238000010276 construction Methods 0.000 claims description 5
- 230000008569 process Effects 0.000 description 6
- 239000003795 chemical substances by application Substances 0.000 description 2
- 238000010586 diagram Methods 0.000 description 2
- 238000009792 diffusion process Methods 0.000 description 2
- 230000006870 function Effects 0.000 description 2
- 230000009286 beneficial effect Effects 0.000 description 1
- 230000008859 change Effects 0.000 description 1
- 238000005516 engineering process Methods 0.000 description 1
- 238000012986 modification Methods 0.000 description 1
- 230000004048 modification Effects 0.000 description 1
- 238000012544 monitoring process Methods 0.000 description 1
- 239000003973 paint Substances 0.000 description 1
- 230000000750 progressive effect Effects 0.000 description 1
Images
Classifications
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F9/00—Arrangements for program control, e.g. control units
- G06F9/06—Arrangements for program control, e.g. control units using stored programs, i.e. using an internal store of processing equipment to receive or retain programs
- G06F9/44—Arrangements for executing specific programs
- G06F9/451—Execution arrangements for user interfaces
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06T—IMAGE DATA PROCESSING OR GENERATION, IN GENERAL
- G06T13/00—Animation
Landscapes
- Engineering & Computer Science (AREA)
- Theoretical Computer Science (AREA)
- Software Systems (AREA)
- Physics & Mathematics (AREA)
- General Physics & Mathematics (AREA)
- Human Computer Interaction (AREA)
- General Engineering & Computer Science (AREA)
- Processing Or Creating Images (AREA)
- User Interface Of Digital Computer (AREA)
Abstract
The application discloses a method and a device for realizing animation effect and a computer readable storage medium, wherein the method for realizing the animation effect comprises the following steps: creating a plurality of cell views of the slide management component; the sliding management component is used for realizing the animation display effect of the content to be displayed on the page, and the content to be displayed comprises pictures and characters; configuring display parameters of each unit view, and determining initial content to be displayed of each unit view on a page; after the sliding operation is determined to be executed, calculating to obtain the layout parameter of each unit view and the content to be displayed, displayed on the page, of each unit view after the sliding operation is executed according to the sliding distance corresponding to the sliding operation; the layout parameters are used for describing the animation display effect of the content to be displayed on the page displayed by the unit view.
Description
Technical Field
The present invention relates to the field of image processing technologies, and in particular, to a method and an apparatus for implementing an animation effect, and a computer-readable storage medium.
Background
For a touch-controllable terminal, in order to improve user experience, animation effects need to be presented to content displayed on a terminal page. Generally, for the content to be displayed on the page, it is realized that the content presents a continuous change graphic size, a 2D effect or a 3D effect of a gradation paint, and the like, for example, scrolled news, a page-turnable card, along with a slide operation by a user.
At present, an implementation method of an animation effect of a touch terminal refers to calculating an animation effect of a unit view presented on a page of the terminal when the touch terminal is operated in a sliding manner. Specifically, for each content to be displayed in the page, a corresponding unit view is configured, each content to be displayed is stored in the memory, and each content to be displayed is displayed in the page by the unit view. However, in the practical application process of the animation effect implementation method, the number of the contents to be displayed is increased, the occupied amount of the memory is also increased, and particularly when the number of the contents to be displayed reaches a certain value, the problems of memory tension, slow operation and frequent flash backing are caused.
Disclosure of Invention
In view of the above, the present invention provides a method and an apparatus for implementing an animation effect, and a computer-readable storage medium, so as to achieve an effect of reducing a memory occupied by a content to be displayed when a display terminal is operated to slide to display the animation effect.
In order to achieve the purpose, the technical scheme is as follows:
a realization method of animation effect comprises the following steps:
creating a unit view of the slide management component; the sliding management component is used for realizing the animation display effect of the content to be displayed on the page, and the content to be displayed comprises pictures and characters;
configuring display parameters of each unit view, and determining initial content to be displayed on a page of each unit view;
after the sliding operation executed by the user is judged, calculating the layout parameter of each unit view and the content to be displayed on the page of each unit view after the sliding operation executed by the user is obtained according to the sliding distance corresponding to the sliding operation; the layout parameters are used for describing the animation display effect of the content to be displayed on the page displayed by the unit view.
Optionally, the slide management component is encapsulated by a container component, wherein the container component comprises an interface for external interaction.
Optionally, the cell view comprises a typical cell view and a plurality of secondary cell views; wherein, the calculating, according to the sliding distance corresponding to the sliding operation, the layout parameter of each unit view after the sliding operation is performed by the user includes:
and sequentially calculating the layout parameters of each unit view after the sliding operation is executed by the user by utilizing the sliding distance corresponding to the sliding operation executed by the user and adopting the calculation sequence of the typical unit view and the diffusion from the typical unit view to the surrounding secondary unit view.
Optionally, the calculating, according to the sliding distance corresponding to the sliding operation, the layout parameter of each unit view after the sliding operation is performed by the user includes:
constructing and obtaining a relational expression between the layout parameter of each unit view and the sliding distance;
and solving the constructed relational expression by using a fitting method to obtain the layout parameters of each unit view after the user executes the sliding operation.
Optionally, after the sliding operation is performed by the user according to the sliding distance corresponding to the sliding operation, the calculating to-be-displayed content displayed on the page by each unit view includes:
obtaining the index number of the content to be displayed currently displayed on the page of each unit view;
determining the moving sequence of the content to be displayed in the unit view according to the sliding distance;
and determining the index number of the content to be displayed on the page of each unit view after the user executes the sliding operation according to the moving sequence of the content to be displayed in the unit view and the index number of the content to be displayed currently displayed on the page of each unit view.
An apparatus for implementing animation effects, comprising:
the creating unit is used for creating a unit view of the sliding management component; the sliding management component is used for realizing the animation display effect of the content to be displayed on the page, and the content to be displayed comprises pictures and characters;
a configuration unit, using the display parameter of each unit view;
the determining unit is used for determining the initial content to be displayed of each unit view on the page;
the calculating unit is used for calculating the layout parameter of each unit view and the content to be displayed on the page of each unit view after the sliding operation executed by the user is obtained according to the sliding distance corresponding to the sliding operation when the sliding operation executed by the user is judged; the layout parameters are used for describing the animation display effect of the content to be displayed on the page displayed by the unit view.
Optionally, the sliding management component is encapsulated by a container component, wherein the container component comprises an interface for external interaction.
Optionally, the cell view comprises a typical cell view and a plurality of secondary cell views; the calculating unit calculates the layout parameters of each unit view after the user executes the sliding operation according to the sliding distance corresponding to the sliding operation, and includes:
and the first calculating unit is used for sequentially calculating the layout parameters of each unit view after the sliding operation is executed by the user by using the sliding distance corresponding to the sliding operation executed by the user and adopting the calculation sequence of the typical unit view diffusing to the surrounding secondary unit views from the typical unit view.
Optionally, the calculating unit, after performing the sliding operation according to the sliding distance corresponding to the sliding operation, calculates the layout parameter of each unit view after the user performs the sliding operation, and includes:
the construction unit is used for constructing and obtaining a relational expression between the layout parameter and the sliding distance of each unit view;
and the second calculation unit is used for solving the constructed relational expression by using a fitting method to obtain the layout parameters of each unit view after the user executes the sliding operation.
Optionally, the calculating unit, after performing the sliding operation according to the sliding distance corresponding to the sliding operation, calculates to obtain the content to be displayed, displayed on the page by each unit view, after the user performs the sliding operation, and includes:
the obtaining unit is used for obtaining the index number of the content to be displayed currently displayed on the page of each unit view;
a first determining unit, configured to determine, according to the sliding distance, a moving order in which the content to be displayed is displayed in the unit view;
and the second determining unit is used for determining the index number of the content to be displayed, which is displayed on the page by each unit view after the user executes the sliding operation, according to the moving sequence of the content to be displayed, which is displayed in the unit view, and the index number of the content to be displayed, which is currently displayed on the page by each unit view.
An apparatus for implementing animation effects, comprising: a processor and a memory; wherein:
the memory is to store computer instructions;
the processor is configured to execute computer instructions stored by the memory for performing the method of any of the above.
A computer readable storage medium having stored therein instructions for performing a method as in any above.
Compared with the prior art, the invention has the following beneficial effects:
the invention provides a method for realizing animation effect, which comprises the steps that after the sliding operation is judged to be executed, the content to be displayed of each unit view on a page is calculated according to the sliding distance corresponding to the sliding operation, and the content to be displayed of the page is ensured to be stored in a memory and displayed by the unit view only after a user executes the sliding operation, and not all the content to be displayed is stored in the memory, so that the memory occupied by the content to be displayed is reduced.
Drawings
In order to more clearly illustrate the embodiments of the present invention or the technical solutions in the prior art, the drawings used in the description of the embodiments or the prior art will be briefly described below, it is obvious that the drawings in the following description are only embodiments of the present invention, and for those skilled in the art, other drawings can be obtained according to the provided drawings without creative efforts.
FIG. 1 is a flowchart of a method for implementing animation effects disclosed in an embodiment of the present application;
FIG. 2 is a display view of a plurality of cell views on a page, according to an embodiment of the present disclosure;
FIG. 3 is a flowchart of an embodiment of step S104 in the present application;
FIG. 4 is a flowchart of an embodiment of step S104 in the present application;
FIG. 5 is a schematic structural diagram of an apparatus for implementing animation effects disclosed in an embodiment of the present application;
fig. 6 is a schematic structural diagram of an apparatus for implementing an animation effect according to another embodiment of the present application.
Detailed Description
The technical solutions in the embodiments of the present invention will be clearly and completely described below with reference to the drawings in the embodiments of the present invention, and it is obvious that the described embodiments are only a part of the embodiments of the present invention, and not all of the embodiments. All other embodiments, which can be derived by a person skilled in the art from the embodiments given herein without making any creative effort, shall fall within the protection scope of the present invention.
The invention provides a method and a device for realizing an animation effect and a computer readable storage medium, which are used for realizing the effect of reducing the memory occupied by contents to be displayed when a display terminal is operated in a sliding manner to display the animation effect.
Referring to fig. 1, a method for implementing an animation effect disclosed in the embodiment of the present application includes the steps of:
s101, creating a plurality of unit views of the sliding management component.
The sliding management component is used for achieving an animation display effect of the content to be displayed on the page, and the content to be displayed comprises pictures and characters.
And creating a unit view of the sliding management component, and setting a data source and an agent of the unit view as the data source and the agent of the sliding management component. Therefore, the unit view of the slide management component can retain the slide management component as an attribute, can receive data input to the slide management component, and the like.
It should be noted that before creating multiple unit views of the slide management component, the slide management component needs to be created in advance. And after the slide management component is created, the animation effect of the slide management component can be realized for a plurality of contents to be displayed. Optionally, the sliding management component created in the embodiment of the present application may be a UICollectionVIew component.
Optionally, in another embodiment of the present application, the sliding management component is packaged by a container component, wherein the container component includes an interface for external interaction.
The container component comprises an interface for external interaction, so that after the container component is used for encapsulating the sliding management component, the container component can receive data input by a user through the interface for external interaction and forward the data to the sliding management component, and the data obtained by the sliding management component is transmitted outwards through the interface for external interaction of the container component. Optionally, the container component in the embodiment of the present application may be a UIView component.
S102, configuring display parameters of each unit view.
The unit view is used for filling the content to be displayed and can be displayed on a page for displaying. And displaying the content to be displayed filled in the unit view according to the display parameters of the unit view.
The display parameters of the cell view include: size, shape, etc. of the cell view. Referring to fig. 2, the page shows three unit views, wherein each unit view is an ellipse, and the unit view at the middle position is larger than the unit views at both sides. Optionally, the multiple cell views configured in the embodiment of the present application may be views of the UICollectionViewCell.
S103, determining the initial content to be displayed of each unit view on the page.
The unit view is used for filling the content to be displayed and is displayed on the page. Therefore, after the configuration of the display parameters of the cell views is completed, it is necessary to determine the initial content displayed on the page by each cell view, that is, to select the content to be displayed that needs to be displayed first from the content to be displayed, and fill each cell view separately, and one cell view fills one content to be displayed.
The display order of the contents to be displayed may be set by a user, or may be set randomly, which is not limited herein.
It should be further noted that after the display parameters of the plurality of unit views are configured, only the initial content to be displayed of each unit view on the page needs to be determined, and not all the content to be displayed need to be determined.
And S104, after the sliding operation executed by the user is judged, calculating the layout parameter of each unit view and the content to be displayed on the page of each unit view after the sliding operation executed by the user is obtained according to the sliding distance corresponding to the sliding operation.
The layout parameters are used for describing the animation display effect of the content to be displayed on the page displayed by the unit view.
When the content to be displayed presents the display of the animation effect on the page, the user can also perform operation on the page for displaying the content to be displayed so as to switch the content to be displayed in each unit view. Monitoring the sliding operation executed by the user on the page, if the sliding operation executed by the user on the page is judged, calculating to obtain a sliding distance corresponding to the sliding operation executed by the user, and calculating to obtain the layout parameter of each unit view and the content to be displayed, displayed on the page, of each unit view after the sliding operation is executed by the user according to the sliding distance.
In this step, after it is determined that the user performs the sliding operation, the content to be displayed, which is displayed on the page by each unit view, is obtained by calculation according to the sliding distance corresponding to the sliding operation after the user performs the sliding operation, so that it is ensured that the content to be displayed, which needs to be displayed on the page, is stored in the memory and displayed by the unit views only after the user performs the sliding operation, and all the content to be displayed does not need to be stored in the memory, thereby reducing the memory occupied by the content to be displayed.
Optionally, the continuous display of the plurality of contents to be displayed of the unit view may be implemented in a continuous multiplexing manner, that is, only the contents to be displayed adjacent to the currently displayed unit view are stored in the multiplexing pool, and the currently displayed display contents are loaded to the unit view, and all the contents to be displayed do not need to be stored in the memory, so that the memory occupied by the contents to be displayed is reduced, and the continuity of display after the sliding operation is performed is ensured.
Optionally, in another embodiment of the present application, in step S104, an implementation manner of the layout parameter of each cell view after the user performs the sliding operation is calculated and obtained according to the sliding distance corresponding to the sliding operation, referring to fig. 3, includes:
s301, a relational expression of the layout parameters and the sliding distance of each unit view is constructed and obtained.
S302, solving the constructed relational expression by using a fitting method to obtain the layout parameters of each unit view after the user executes the sliding operation.
For the layout parameters of each unit view, a relational expression between the layout parameters and the sliding distance needs to be constructed. For example, the layout parameters include the size of the cell view, transparency, scrolling parameters, and 3D morphing, etc. And setting Y as a layout parameter and Offset as a sliding distance, and setting Y as a function (Offset) as a relational expression of the layout parameter and the sliding distance of each constructed unit view.
After filling the content to be displayed in the plurality of unit views on the page, the user performs a sliding operation, and along with the sliding operation of the user, the content to be displayed filled in the plurality of unit views on the page is switched in a scrolling manner along with the sliding direction. This phenomenon can be understood as an animation effect of scrolling switching the contents to be displayed. In this case, x is a scroll distance, y is a scroll parameter, and the relationship between the layout parameter and the slide distance is constructed as f (x) with y 0.
Taking the relation as an example of the first order, determining the size of the middle cell view in the multiple cell views on the page as S1, after the user performs the sliding operation, scrolling the content to be displayed filled in the middle cell view to the size of the adjacent cell view as S2, recording the scrolling as CX, obtaining a set of eigenvalues Pi, and performing eigen function solution.
Specifically, P1(0, S1), P2(CX, S2), because the first-order relation is y ═ ax + b type, we use the equation of one-time to determine the coefficients, and we get two equations: s1 ═ b, S2 ═ a × CX + b; after the union, y ═ (S2-S1)/CX × + S1 can be solved quickly.
If the animation effect of the content to be displayed filled in the unit view displayed on the page is complex, for example, the content to be displayed is presented with accelerated or decelerated scrolling along with the sliding operation of the user. At this time, the relationships of y ═ a × 2+ b and y ═ a × lnx + b were constructed. For the relational expression, the relational expression obtained by construction can be solved by a fitting method.
It should be further noted that, if the animation effect to be implemented on the content to be displayed is complex, the process of solving the above-mentioned relational expression obtained by construction is also extremely complex. And by adopting a fitting solving mode, the solving process of the relational expression can be simplified, and the rapid solving is realized.
Optionally, in another embodiment of the present application, in step S104, after the sliding operation is performed by the user according to the sliding distance corresponding to the sliding operation, an implementation manner of the content to be displayed, which is displayed on the page by each unit view, is obtained through calculation, referring to fig. 4, where the implementation manner includes:
s401, obtaining the index number of the content to be displayed currently displayed on the page of each unit view.
At the previous moment when the user performs the sliding operation, the index number of the content to be displayed on the page of each unit view is the index number of the content to be displayed currently displayed on the page of each unit view.
S402, determining the moving sequence of the content to be displayed in the unit view according to the sliding distance.
The positive and negative values of the sliding distance can indicate the direction of the sliding operation of the user, so that the moving sequence of the content to be displayed in the unit view can be determined according to the positive and negative values of the sliding distance.
S403, according to the moving sequence of the content to be displayed in the unit views and the index number of the content to be displayed currently displayed on the page of each unit view, determining the index number of the content to be displayed on the page of each unit view after the user executes the sliding operation.
The index number of the content to be displayed, which is currently displayed on the page by each unit view, is moved in sequence according to the moving sequence of the content to be displayed, which is displayed in the unit view, and the index number of the content to be displayed, which is displayed on the page by each unit view after moving, is the index number of the content to be displayed, which needs to be determined.
And determining the index number of the content to be displayed on the page of each unit view, namely obtaining the content to be displayed according to the index number and displaying the content by the corresponding unit view.
Referring also to fig. 2, the user performs a right-to-left sliding operation, and after the user performs the operation, the displayed contents of each of the three cell views of the page display are moved in the order from right to left. For example, before the user performs a sliding operation, a first unit view displays picture 1, a second unit view displays picture 2, and a third unit view displays picture 3. After the user performs the sliding operation, the first unit view is the display picture 2, the second unit view is the display picture 3, and the third unit view is the picture 4 which is not displayed before the display, wherein each picture in the content to be displayed is displayed according to the sequence of the index numbers from small to large.
Optionally, in another embodiment of the present application, in order to highlight one of the plurality of cell views displayed on the page, the display parameter of the cell view may be set to be different from that of the other cell views. In this case, the cell view whose display parameters are different from those of the other cells is referred to as a typical cell view, and the other cell view is referred to as a secondary cell view. Referring also to fig. 2, the second cell view has different display parameters from the other two cell views, and thus, the cell view is a typical cell view, and the other two are secondary cell views.
In this case, in step S104, it is necessary to perform different priority orders according to different types of cell views to obtain layout parameters. Therefore, according to the sliding distance corresponding to the sliding operation, an embodiment of the layout parameter of each cell view after the sliding operation is performed by the user is calculated and obtained, and the embodiment includes:
and sequentially calculating the layout parameters of each unit view after the sliding operation is executed by the user by utilizing the sliding distance corresponding to the sliding operation executed by the user and adopting the calculation sequence of the typical unit view and the diffusion from the typical unit view to the surrounding secondary unit view.
In the process of calculating the layout parameters corresponding to each cell view, the typical cell view is calculated first, then the secondary cell views connected with the typical cell view are calculated, and then the secondary cell views are diffused outwards in sequence until all the secondary cell views are obtained.
Another embodiment of the present application further discloses an apparatus for implementing an animation effect, as shown in fig. 5, including:
a creating unit 501, configured to create a plurality of unit views of the sliding management component; the sliding management component is used for achieving an animation display effect of the content to be displayed on the page, and the content to be displayed comprises pictures and characters.
Optionally, in another embodiment of the present application, the sliding management component is packaged by a container component, wherein the container component includes an interface for external interaction.
A configuration unit 502, configured to configure the display parameters of each unit view.
The determining unit 503 is configured to determine the initial content to be displayed, displayed on the page, of each unit view.
The calculating unit 504 is configured to calculate, after it is determined that the user performs the sliding operation, a layout parameter of each unit view and a content to be displayed, displayed on a page in each unit view, of the user performing the sliding operation according to a sliding distance corresponding to the sliding operation; the layout parameters are used for describing the animation display effect of the content to be displayed on the page displayed by the unit view.
In this embodiment, after it is determined that the user performs the sliding operation, the calculating unit 504 calculates the content to be displayed, which is displayed on the page by each unit view, according to the sliding distance corresponding to the sliding operation, and then the content to be displayed, which needs to be displayed on the page, is stored in the memory and displayed by the unit views only after the user performs the sliding operation, and all the content to be displayed does not need to be stored in the memory, thereby reducing the memory occupied by the content to be displayed.
Optionally, the continuous display of the plurality of contents to be displayed of the unit view may be implemented in a continuous multiplexing manner, that is, only the contents to be displayed adjacent to the currently displayed unit view are stored in the multiplexing pool, and the currently displayed display contents are loaded to the unit view, and all the contents to be displayed do not need to be stored in the memory, so that the memory occupied by the contents to be displayed is reduced, and the continuity of display after the sliding operation is performed is ensured. .
Optionally, in another embodiment of the present application, the cell view includes a typical cell view and a plurality of secondary cell views; the calculating unit 504 calculates the layout parameters of each unit view after the user executes the sliding operation according to the sliding distance corresponding to the sliding operation, and includes:
and the first calculating unit is used for sequentially calculating the layout parameters of each unit view after the sliding operation is executed by the user by using the sliding distance corresponding to the sliding operation executed by the user and adopting the calculation sequence of the typical unit view diffusing to the surrounding secondary unit views from the typical unit view.
Optionally, in another embodiment of the application, the calculating unit 504 calculates, according to the sliding distance corresponding to the sliding operation, to obtain the layout parameter of each unit view after the sliding operation is performed by the user, where the calculating includes:
and the construction unit is used for constructing and obtaining a relational expression between the layout parameter and the sliding distance of each unit view.
And the second calculation unit is used for solving the constructed relational expression by using a fitting method to obtain the layout parameters of each unit view after the user executes the sliding operation.
Optionally, in another embodiment of the application, after the calculating unit 504 calculates to obtain the content to be displayed, displayed on the page in each unit view, after the user performs the sliding operation according to the sliding distance corresponding to the sliding operation, the calculating includes:
and the obtaining unit is used for obtaining the index number of the content to be displayed currently displayed on the page of each unit view.
And the first determining unit is used for determining the moving sequence of the content to be displayed in the unit view according to the sliding distance.
And the second determining unit is used for determining the index number of the content to be displayed, which is displayed on the page by each unit view after the user executes the sliding operation, according to the moving sequence of the content to be displayed, which is displayed in the unit view, and the index number of the content to be displayed, which is currently displayed on the page by each unit view.
For the specific working processes of each unit in the above embodiments of the present application, reference may be made to the contents of the corresponding method embodiments, which are not described herein again.
Another embodiment of the present application further discloses an apparatus for implementing an animation effect, as shown in fig. 6, including: a processor 601 and a memory 602; wherein:
the memory 602 is used to store computer instructions;
the processor 601 is configured to execute the computer instructions stored in the memory 602 for executing the method for implementing animation effects as disclosed in any of the above embodiments.
For a specific working process of the processor in the embodiment of the present application, reference may be made to contents of the corresponding method embodiment, which are not described herein again.
Another embodiment of the present application further discloses a computer-readable storage medium, in which instructions are stored, and the instructions are used to execute the method for implementing the animation effect disclosed in any one of the above embodiments.
The embodiments in the present description are described in a progressive manner, each embodiment focuses on differences from other embodiments, and the same and similar parts among the embodiments are referred to each other.
The previous description of the disclosed embodiments is provided to enable any person skilled in the art to make or use the present invention. Various modifications to these embodiments will be readily apparent to those skilled in the art, and the generic principles defined herein may be applied to other embodiments without departing from the spirit or scope of the invention. Thus, the present invention is not intended to be limited to the embodiments shown herein but is to be accorded the widest scope consistent with the principles and novel features disclosed herein.
Claims (10)
1. A method for realizing animation effect is characterized by comprising the following steps:
creating a plurality of cell views of the slide management component; the sliding management component is used for realizing the animation display effect of the content to be displayed on the page, and the content to be displayed comprises pictures and characters; the cell view comprises a typical cell view and a plurality of secondary cell views; the typical cell view is: the display parameters in the cell view are different from other cell views; the secondary unit view is: cell views other than the typical cell view among the cell views;
configuring display parameters of each unit view, selecting initial contents to be displayed of each unit view on a page from the contents to be displayed, and filling the initial contents to be displayed in each unit view; wherein one of the cell views fills one of the initial content to be displayed;
after the sliding operation is determined to be executed, sequentially calculating the layout parameters of each unit view and the content to be displayed, displayed on the page, of each unit view by using the sliding distance corresponding to the sliding operation and the calculation sequence of the typical unit view diffusing to the surrounding secondary unit views from the typical unit view; the layout parameters are used for describing the animation display effect of the content to be displayed, displayed on the page by the unit views, and the content to be displayed, displayed on the page by each unit view, is used for being stored in the memory and displayed by the unit views.
2. The method of claim 1, wherein the sliding management component is encapsulated by a container component, wherein the container component comprises an interface for external interaction.
3. The method according to claim 1, wherein the calculating of the layout parameter of each cell view comprises:
constructing and obtaining a relational expression between the layout parameter of each unit view and the sliding distance;
and solving the constructed relational expression by using a fitting method to obtain the layout parameters of each unit view after the sliding operation is executed.
4. The method according to any one of claims 1 to 3, wherein the calculating manner of the content to be displayed on the page by each unit view comprises:
obtaining the index number of the content to be displayed currently displayed on the page of each unit view;
determining the moving sequence of the content to be displayed in the unit view according to the sliding distance;
and determining the index number of the content to be displayed on the page of each unit view after the user executes the sliding operation according to the moving sequence of the content to be displayed in the unit view and the index number of the content to be displayed currently displayed on the page of each unit view.
5. An apparatus for implementing animation effect, comprising:
a creating unit for creating a plurality of unit views of the slide management component; the sliding management component is used for realizing the animation display effect of the content to be displayed on the page, and the content to be displayed comprises pictures and characters; the cell view comprises a typical cell view and a plurality of secondary cell views; the typical cell view is: the display parameters in the cell view are different from other cell views; the secondary unit view is: cell views other than the typical cell view among the cell views;
the configuration unit is used for configuring the display parameters of each unit view;
the determining unit is used for selecting initial content to be displayed of each unit view on a page from the content to be displayed and filling the initial content to be displayed in each unit view; wherein one of the cell views fills one of the initial content to be displayed;
the calculation unit is used for calculating layout parameters of each unit view and contents to be displayed on a page of each unit view after the sliding operation is determined to be executed and the sliding operation is executed according to the sliding distance corresponding to the sliding operation; the layout parameters are used for describing the animation display effect of the content to be displayed, displayed on the page by the unit views, and the content to be displayed, displayed on the page by each unit view, is stored in the memory and is displayed by the unit views;
wherein, the calculating unit executes the sliding distance corresponding to the sliding operation, and after the sliding operation is executed, the calculating unit calculates the layout parameter of each unit view, including:
and the first calculating unit is used for sequentially calculating layout parameters of each unit view after the sliding operation is executed by using the sliding distance corresponding to the sliding operation and the calculation sequence of the typical unit view diffusing to the surrounding secondary unit views from the typical unit view.
6. The apparatus of claim 5, wherein the sliding management component is encapsulated by a container component, wherein the container component comprises an interface for external interaction.
7. The apparatus according to claim 5, wherein the calculating unit calculates the layout parameter of each cell view after the sliding operation is executed according to the sliding distance corresponding to the sliding operation, and includes:
the construction unit is used for constructing and obtaining a relational expression between the layout parameter and the sliding distance of each unit view;
and the second calculation unit is used for solving the constructed relational expression by using a fitting method to obtain the layout parameters of each unit view after the sliding operation is executed.
8. The apparatus according to any one of claims 5 to 7, wherein the calculating unit, after calculating that the sliding operation is executed according to the sliding distance corresponding to the sliding operation, calculates the content to be displayed, which is displayed on the page in each unit view, and includes:
the obtaining unit is used for obtaining the index number of the content to be displayed currently displayed on the page of each unit view;
a first determining unit, configured to determine, according to the sliding distance, a moving order in which the content to be displayed is displayed in the unit view;
and the second determining unit is used for determining the index number of the content to be displayed, which is displayed on the page by each unit view after the user executes the sliding operation, according to the moving sequence of the content to be displayed, which is displayed in the unit view, and the index number of the content to be displayed, which is currently displayed on the page by each unit view.
9. An apparatus for implementing animation effect, comprising: a processor and a memory; wherein:
the memory is to store computer instructions;
the processor is configured to execute the memory-stored computer instructions for performing the method of any of claims 1-4.
10. A computer-readable storage medium having stored thereon instructions for performing the method of any one of claims 1-4.
Priority Applications (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN201810663668.2A CN110704138B (en) | 2018-06-25 | 2018-06-25 | Animation effect realization method and device and computer readable storage medium |
Applications Claiming Priority (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN201810663668.2A CN110704138B (en) | 2018-06-25 | 2018-06-25 | Animation effect realization method and device and computer readable storage medium |
Publications (2)
| Publication Number | Publication Date |
|---|---|
| CN110704138A CN110704138A (en) | 2020-01-17 |
| CN110704138B true CN110704138B (en) | 2021-04-23 |
Family
ID=69192674
Family Applications (1)
| Application Number | Title | Priority Date | Filing Date |
|---|---|---|---|
| CN201810663668.2A Active CN110704138B (en) | 2018-06-25 | 2018-06-25 | Animation effect realization method and device and computer readable storage medium |
Country Status (1)
| Country | Link |
|---|---|
| CN (1) | CN110704138B (en) |
Families Citing this family (1)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN112882637B (en) * | 2021-02-23 | 2022-07-29 | 上海哔哩哔哩科技有限公司 | Interaction method for multi-layer animation display and browser |
Citations (9)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN103268624A (en) * | 2013-05-09 | 2013-08-28 | 四三九九网络股份有限公司 | Method and device for generating animation with high-efficiency |
| CN103785171A (en) * | 2014-01-23 | 2014-05-14 | 北京智明星通科技有限公司 | Game system and method integrating click self-induction mode and sliding operation mode |
| CN104035820A (en) * | 2013-03-08 | 2014-09-10 | 腾讯科技（深圳）有限公司 | Display terminal data loading method and device |
| CN104392474A (en) * | 2014-06-30 | 2015-03-04 | 贵阳朗玛信息技术股份有限公司 | Method and device for generating and displaying animation |
| CN106933463A (en) * | 2015-12-30 | 2017-07-07 | 百度在线网络技术（北京）有限公司 | A kind of method and apparatus that object is shown in screen |
| CN107038735A (en) * | 2017-03-31 | 2017-08-11 | 武汉斗鱼网络科技有限公司 | It is a kind of to realize the method and system that entity opens animation |
| CN107340964A (en) * | 2017-06-02 | 2017-11-10 | 武汉斗鱼网络科技有限公司 | The animation effect implementation method and device of a kind of view |
| CN107633554A (en) * | 2017-03-16 | 2018-01-26 | 柳州桂通科技股份有限公司 | Mobile surface targets and its methods of exhibiting with the three-dimensional scenic of present position |
| CN108052546A (en) * | 2017-11-27 | 2018-05-18 | 深圳市丰巢科技有限公司 | A kind of method and mobile terminal in mobile terminal browsing pictures |
Family Cites Families (1)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| US20150040059A1 (en) * | 2012-06-26 | 2015-02-05 | Intel Corporation | System, device, and method for scrolling content with motion blur on an electronic display |
-
2018
- 2018-06-25 CN CN201810663668.2A patent/CN110704138B/en active Active
Patent Citations (9)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN104035820A (en) * | 2013-03-08 | 2014-09-10 | 腾讯科技（深圳）有限公司 | Display terminal data loading method and device |
| CN103268624A (en) * | 2013-05-09 | 2013-08-28 | 四三九九网络股份有限公司 | Method and device for generating animation with high-efficiency |
| CN103785171A (en) * | 2014-01-23 | 2014-05-14 | 北京智明星通科技有限公司 | Game system and method integrating click self-induction mode and sliding operation mode |
| CN104392474A (en) * | 2014-06-30 | 2015-03-04 | 贵阳朗玛信息技术股份有限公司 | Method and device for generating and displaying animation |
| CN106933463A (en) * | 2015-12-30 | 2017-07-07 | 百度在线网络技术（北京）有限公司 | A kind of method and apparatus that object is shown in screen |
| CN107633554A (en) * | 2017-03-16 | 2018-01-26 | 柳州桂通科技股份有限公司 | Mobile surface targets and its methods of exhibiting with the three-dimensional scenic of present position |
| CN107038735A (en) * | 2017-03-31 | 2017-08-11 | 武汉斗鱼网络科技有限公司 | It is a kind of to realize the method and system that entity opens animation |
| CN107340964A (en) * | 2017-06-02 | 2017-11-10 | 武汉斗鱼网络科技有限公司 | The animation effect implementation method and device of a kind of view |
| CN108052546A (en) * | 2017-11-27 | 2018-05-18 | 深圳市丰巢科技有限公司 | A kind of method and mobile terminal in mobile terminal browsing pictures |
Also Published As
| Publication number | Publication date |
|---|---|
| CN110704138A (en) | 2020-01-17 |
Similar Documents
| Publication | Publication Date | Title |
|---|---|---|
| EP3657327B1 (en) | Method for rendering game, and method, apparatus and device for generating game resource file | |
| US9547525B1 (en) | Drag toolbar to enter tab switching interface | |
| AU2014308633B2 (en) | Swipe toolbar to switch tabs | |
| EP2871560B1 (en) | Image processing method and apparatus | |
| AU2017259235A1 (en) | Display control method and device for side sliding interface, terminal and storage medium | |
| CN104350487B (en) | The method for drafting of 3D webpage and the terminal using the method | |
| IL276621B2 (en) | Browser for mixed reality systems | |
| US10901587B2 (en) | Widget area adjustment method and apparatus | |
| CN113467871A (en) | H5 page display method, device, equipment and storage medium | |
| CA2811491C (en) | Method for three-dimensional viewing | |
| CN106649639A (en) | Page display method and device | |
| CN107045546B (en) | Webpage processing method and device and intelligent terminal | |
| CN110704138B (en) | Animation effect realization method and device and computer readable storage medium | |
| WO2014082541A1 (en) | Method for switching pictures of picture galleries and browser | |
| CN114527980A (en) | Display rendering method and device, electronic equipment and readable storage medium | |
| EP2843626A2 (en) | Image rendering method using layers | |
| CN109800039B (en) | User interface display method and device, electronic equipment and storage medium | |
| CN113297313B (en) | Table data display method and device, electronic equipment and storage medium | |
| CN104915102A (en) | Graphical interface based interaction method and apparatus | |
| CN104156185A (en) | Three-dimensional font display method and device | |
| CN105278896A (en) | Image display method and apparatus, and terminal equipment | |
| Sawicki et al. | 3D mesh viewer using HTML5 technology | |
| CN105931285A (en) | Control realization method and apparatus in 3D space | |
| US20190163762A1 (en) | Reflow of user interface elements | |
| CN111243069A (en) | Scene switching method and system of Unity3D engine |
Legal Events
| Date | Code | Title | Description |
|---|---|---|---|
| PB01 | Publication | ||
| PB01 | Publication | ||
| SE01 | Entry into force of request for substantive examination | ||
| SE01 | Entry into force of request for substantive examination | ||
| GR01 | Patent grant | ||
| GR01 | Patent grant | ||
| OL01 | Intention to license declared | ||
| OL01 | Intention to license declared |