CN113989425B - Frame animation playing method and device, storage medium and electronic equipment - Google Patents
Frame animation playing method and device, storage medium and electronic equipment Download PDFInfo
- Publication number
- CN113989425B CN113989425B CN202111594033.XA CN202111594033A CN113989425B CN 113989425 B CN113989425 B CN 113989425B CN 202111594033 A CN202111594033 A CN 202111594033A CN 113989425 B CN113989425 B CN 113989425B
- Authority
- CN
- China
- Prior art keywords
- file
- frame animation
- animation file
- frame
- played
- 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
Images
Classifications
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06T—IMAGE DATA PROCESSING OR GENERATION, IN GENERAL
- G06T13/00—Animation
- G06T13/80—2D [Two Dimensional] animation, e.g. using sprites
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F16/00—Information retrieval; Database structures therefor; File system structures therefor
- G06F16/10—File systems; File servers
- G06F16/13—File access structures, e.g. distributed indices
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F16/00—Information retrieval; Database structures therefor; File system structures therefor
- G06F16/10—File systems; File servers
- G06F16/14—Details of searching files based on file metadata
- G06F16/148—File search processing
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F16/00—Information retrieval; Database structures therefor; File system structures therefor
- G06F16/10—File systems; File servers
- G06F16/17—Details of further file system functions
- G06F16/174—Redundancy elimination performed by the file system
- G06F16/1744—Redundancy elimination performed by the file system using compression, e.g. sparse files
Landscapes
- Engineering & Computer Science (AREA)
- Theoretical Computer Science (AREA)
- Physics & Mathematics (AREA)
- General Physics & Mathematics (AREA)
- Data Mining & Analysis (AREA)
- Databases & Information Systems (AREA)
- General Engineering & Computer Science (AREA)
- Library & Information Science (AREA)
- Processing Or Creating Images (AREA)
Abstract
The application provides a frame animation playing method and device, a storage medium and electronic equipment, wherein the method comprises the following steps: the method comprises the steps of obtaining a frame animation compression package, decompressing the frame animation compression package to obtain each frame animation file included in the frame animation compression package, forming a file array by each frame animation file based on a timestamp of each frame animation file, writing each frame animation file in file data into an animation frame output container in sequence, calling a preset animation frame output function, and executing the frame animation files in the animation frame output container in sequence to realize playing of each frame animation file. Therefore, according to the scheme, the frame animation compression package is obtained, so that the picture format in the frame animation file included in the frame animation compression package can be any picture format, and a special effect program does not need to be written, and therefore the development cost is high and the resource occupation is reduced.
Description
Technical Field
The present application relates to the field of animation playing technologies, and in particular, to a frame animation playing method and apparatus, a storage medium, and an electronic device.
Background
At present, there are two main animation playing schemes:
(1) and writing a special effect program, writing animation logic by using JavaScript, CSS, Canvas technologies and the like, and controlling the states of generation, deformation, size, position, track and the like of an object within a certain time to realize the animation effect.
(2) And (4) manufacturing GIF animation, and enabling a plurality of GIF pictures to be played rapidly and continuously according to a certain rule by using a special animation manufacturing tool to achieve the effect of moving pictures.
However, for the first animation playing scheme, various animation algorithms need to be mastered, and the object control difficulty is high, so that the development cost is high, and the CPU computing resource of the complex animation occupies a large amount. For the second animation playing scheme, only the GIF compression format is supported, and the universality is poor.
Disclosure of Invention
The application provides a frame animation playing method and device, a storage medium and electronic equipment, and aims to solve the problems of high development cost, large resource occupation and poor universality of the existing animation playing scheme.
In order to achieve the above object, the present application provides the following technical solutions:
a frame animation playing method is characterized by comprising the following steps:
acquiring a frame animation compressed packet;
decompressing the frame animation compressed packet to obtain each frame animation file included in the frame animation compressed packet;
forming a file array by each frame animation file based on the timestamp of each frame animation file;
taking the first frame animation file in the file array as a frame animation file to be played;
judging whether the current playing time of the player is not less than the time stamp of the frame animation file to be played and less than the time stamp of the next frame animation file of the frame animation file to be played in the file array, if the current playing time of the player is not less than the time stamp of the frame animation file to be played and less than the time stamp of the next frame animation file of the frame animation file to be played in the file array, deleting the frame animation file in a preset animation frame output container, writing the frame animation file to be played into the animation frame output container, calling a preset animation frame output function, executing the frame animation file in the animation frame output container, and playing the frame animation file in the animation frame output container;
judging whether the frame animation file to be played is the last frame animation file in the file array or not;
and if the frame animation file to be played is not the last frame animation file in the file array, taking the next frame animation file of the frame animation file to be played in the file array as a new frame animation file to be played, returning to the step of judging whether the current playing time of the player is not less than the time stamp of the frame animation file to be played and less than the time stamp of the next frame animation file of the frame animation file to be played in the file array based on the new frame animation file to be played until the frame animation file to be played is the last frame animation file in the file array.
The above method, optionally, further includes:
if the current playing time of the player is less than the timestamp of the frame animation file to be played, judging whether the frame animation file currently being played carries a static mark;
if the frame animation file currently being played carries a static mark, returning to the step of judging whether the current playing time of the player is not less than the time stamp of the frame animation file to be played and less than the time stamp of the next frame animation file of the frame animation file to be played in the file array;
if the frame animation file which is played currently does not carry a static mark, determining the time to be indexed based on the current playing time of the player;
searching a frame animation file corresponding to the time to be indexed from the file array;
and determining the searched frame animation file as a new frame animation file to be played, and returning to the step of judging whether the current playing time of the player is not less than the timestamp of the frame animation file to be played and less than the timestamp of the next frame animation file of the frame animation file to be played in the file array based on the new frame animation file to be played.
The above method, optionally, further includes:
if the current playing time of the player is not less than the timestamp of the next frame animation file of the frame animation file to be played in the file array, determining the time to be indexed based on the current playing time of the player;
searching a frame animation file corresponding to the time to be indexed from the file array;
and determining the searched frame animation file as a new frame animation file to be played, and returning to the step of judging whether the current playing time of the player is not less than the timestamp of the frame animation file to be played and less than the timestamp of the next frame animation file of the frame animation file to be played in the file array based on the new frame animation file to be played.
Optionally, in the method, the searching for the frame animation file corresponding to the time to be indexed from the file array includes:
acquiring a reference index;
taking the next frame animation file of the frame animation file corresponding to the reference index in the file array as an initial frame animation file;
judging whether the time to be indexed is greater than the timestamp of the previous frame animation file of the initial frame animation file in the file array and is less than the timestamp of the initial frame animation file;
if so, determining the initial frame animation file as a frame animation file corresponding to the time to be indexed;
if not, taking the next frame animation file of the initial frame animation file in the file array as a new initial frame animation file, and returning to the step of judging whether the time to be indexed is greater than the timestamp of the last frame animation file of the initial frame animation file in the file array and is less than the timestamp of the initial frame animation file based on the new initial frame animation file.
The above method, optionally, the obtaining the frame animation compressed packet, includes:
calling an Application Programming Interface (API) of a browser, and loading a frame animation compression packet; in the loading process, the loaded data is converted into binary data, and the binary data is buffered.
Optionally, the method for using the first frame animation file in the file array as the frame animation file to be played includes:
judging whether the player is in a playing state;
and if the player is in a playing state, taking the first frame animation file in the file array as a frame animation file to be played.
A frame animation playback apparatus, comprising:
the acquisition unit is used for acquiring the frame animation compressed packet;
the decompression unit is used for decompressing the frame animation compressed packet to obtain each frame animation file included in the frame animation compressed packet;
the combination unit is used for forming a file array by the animation files of each frame based on the time stamps of the animation files of each frame;
the first determining unit is used for taking the first frame animation file in the file array as a frame animation file to be played;
the first judging unit is used for judging whether the current playing time of the player is not less than the time stamp of the frame animation file to be played and less than the time stamp of the next frame animation file of the frame animation file to be played in the file array, if the current playing time of the player is not less than the time stamp of the frame animation file to be played and less than the time stamp of the next frame animation file of the frame animation file to be played in the file array, deleting the frame animation file in a preset animation frame output container, writing the frame animation file to be played into the animation frame output container, calling a preset animation frame output function, executing the frame animation file in the animation frame output container, and playing the frame animation file in the animation frame output container;
the second judging unit is used for judging whether the frame animation file to be played is the last frame animation file in the file array;
and the first returning unit is used for taking the next frame animation file of the frame animation file to be played in the file array as a new frame animation file to be played if the frame animation file to be played is not the last frame animation file in the file array, and returning to execute the step of judging whether the current playing time of the player is not less than the timestamp of the frame animation file to be played and less than the timestamp of the next frame animation file of the frame animation file to be played in the file array until the frame animation file to be played is the last frame animation file in the file array based on the new frame animation file to be played.
The above apparatus, optionally, further comprises:
a third judging unit, configured to judge whether the frame animation file currently being played carries a static mark if the current playing time of the player is less than the timestamp of the frame animation file to be played;
a second returning unit, configured to return to the step of determining whether the current playing time of the player is not less than the timestamp of the frame animation file to be played and is less than the timestamp of the next frame animation file of the frame animation file to be played in the file array, if the frame animation file currently being played carries a static mark;
the second determining unit is used for determining the time to be indexed based on the current playing time of the player if the frame animation file which is currently played does not carry a static mark;
the first searching unit is used for searching the frame animation file corresponding to the time to be indexed from the file array;
and the second returning unit is used for determining the searched frame animation file as a new frame animation file to be played, and returning to execute the step of judging whether the current playing time of the player is not less than the timestamp of the frame animation file to be played and less than the timestamp of the next frame animation file of the frame animation file to be played in the file array based on the new frame animation file to be played.
A storage medium storing a set of instructions, wherein the set of instructions, when executed by a processor, implement a frame animation playback method as described above.
An electronic device, comprising:
a memory for storing at least one set of instructions;
and the processor is used for executing the instruction set stored in the memory and realizing the frame animation playing method by executing the instruction set.
Compared with the prior art, the method has the following advantages:
the application provides a frame animation playing method and device, a storage medium and electronic equipment, wherein the method comprises the following steps: the method comprises the steps of obtaining a frame animation compression package, decompressing the frame animation compression package to obtain each frame animation file included in the frame animation compression package, forming a file array by each frame animation file based on a timestamp of each frame animation file, writing each frame animation file in file data into an animation frame output container in sequence, calling a preset animation frame output function, and executing the frame animation files in the animation frame output container in sequence to realize playing of each frame animation file. Therefore, according to the scheme, the frame animation compression package is obtained, so that the picture format in the frame animation file included in the frame animation compression package can be any picture format, and a special effect program does not need to be written, and therefore the development cost is high and the resource occupation is reduced.
Drawings
In order to more clearly illustrate the embodiments of the present application or the technical solutions in the prior art, the drawings needed to be used in the description of the embodiments or the prior art will be briefly introduced below, it is obvious that the drawings in the following description are only embodiments of the present application, 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 of playing frame animation according to the present application;
FIG. 2 is a flowchart of another method of a frame animation playing method provided in the present application;
FIG. 3 is a flow chart of another method of a frame animation playing method provided in the present application;
fig. 4 is a schematic structural diagram of a frame animation playback device according to the present application;
fig. 5 is a schematic structural diagram of an electronic device provided in the present application.
Detailed Description
The technical solutions in the embodiments of the present application will be clearly and completely described below with reference to the drawings in the embodiments of the present application, and it is obvious that the described embodiments are only a part of the embodiments of the present application, 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 application.
The application is operational with numerous general purpose or special purpose computing device environments or configurations. For example: personal computers, server computers, hand-held or portable devices, tablet-type devices, multi-processor apparatus, distributed computing environments that include any of the above devices or equipment, and the like.
In the present embodiment, for convenience of understanding, the terms related to the present application are described as follows:
1. time stamping: the Presentation TimeStamp (Presentation TimeStamp) is used to tell the player when to present the data of this frame.
2. window. requestanimationframe: the browser built-in API is used for telling the browser that animation logic which is to be executed next time requires the browser to call a specified callback function to update the animation before redrawing next time. The method transmits a callback function as a parameter and executes the callback function before the next redraw of the browser.
3. Redrawing by a browser: the method is characterized in that a browser window display area refreshes a drawing interface at a certain frequency (usually 60 Hz) so as to realize interface change effects such as animation, scrolling, mouse and keyboard interaction.
4. HTML5 (H5): HTML5 is an abbreviation of HyperText Markup Language 5, and HTML5 technology combines with a relevant standard of HTML4.01 and innovates, meets the requirement of modern network development, and is formally released in 2008.
The embodiment of the invention provides a frame animation playing method, which can be applied to a player, and the method flow chart of the method is shown in figure 1, and specifically comprises the following steps:
s101, obtaining a frame animation compression packet.
In this embodiment, a frame animation compression packet is obtained, where the frame animation compression packet includes a plurality of frame animation files, and a picture format in the frame animation files may be any picture format, for example, a picture format may be a JPG, GIF, PNG, SVG, or BMP format.
It should be noted that the present application does not limit the format of the pictures in the obtained frame animation file.
Specifically, the process of obtaining the frame animation compressed packet specifically includes the following steps: calling a programming interface API of a browser application program, namely loading a frame animation compression package through an API of the native H5; in the loading process, the loaded data is converted into binary data, and the binary data is buffered.
In this embodiment, a browser API (Application Programming Interface) is called to load a frame animation compression packet, optionally, an asynchronous frame animation compression packet may be adopted, in the loading process, the loaded data is converted into binary data in real time, and the binary data is buffered to obtain a buffer object ab corresponding to the compression packet, that is, after the buffering is completed, the frame animation compression packet is obtained. The frame animation compressed packet loaded asynchronously can call a preset loading function, and the preset loading function can be, for example, awake fetch (' mask.
The binary data may be buffered by using a preset buffer function, which may be, for example, response.
S102, decompressing the frame animation compressed packet to obtain each frame animation file included in the frame animation compressed packet.
In this embodiment, the frame animation compressed packet is decompressed to obtain each frame animation file included in the frame animation compressed packet, specifically, the frame animation compressed packet is imported into a compression module fft in the player, the decompression module fft performs synchronous decompression on the frame animation compressed packet to obtain decompressed file list objects, the synchronous decompression may be performed by a preset decompression function, and the preset decompression function may be fft.
The file list object comprises the file name and the binary file body of the frame animation file. Illustratively, files = { 'filename 1.svg', file binary body 1, 'filename 2. svg', file binary body 2 }.
That is, the frame animation compressed packet is decompressed to obtain each frame animation file included in the frame animation compressed packet, and each frame animation file includes a file name and a binary file body.
And S103, forming a file array by the frame animation files based on the time stamps of the frame animation files.
In this embodiment, the filename of each frame animation file carries a timestamp, and the timestamp of each frame animation file can be obtained by analyzing the filename of each frame animation file. The time stamp of each frame animation file is used to indicate the time at which the frame animation file is played.
In this embodiment, each frame animation file is formed into a file array based on the timestamp of each frame animation file, specifically, each frame animation file is formed into a file array according to the sequence of the timestamps of each frame animation file from small to large, that is, each frame animation file in the file array is arranged according to the sequence of the timestamps from small to large.
Optionally, based on the timestamp of each frame animation file, before each frame animation file is combined into a file array, the frame animation file may be preprocessed, which specifically includes: and deleting the binary body of the file with the width of 0 and the corresponding file name thereof, namely deleting the frame animation file with the width of 0, and converting the residual binary body of the file from binary to a Base64 character string.
Correspondingly, the process of forming a file array from each frame animation file based on the timestamp of each frame animation file specifically includes: and forming a file array by the preprocessed frame animation files based on the time stamps of the preprocessed frame animation files.
And S104, taking the first frame animation file in the file array as a frame animation file to be played.
In this embodiment, the first frame animation file in the file array is used as the frame animation file to be played.
In this embodiment, the player is started in advance, and the starting process of the player includes: acquiring related parameter information of a frame animation compressed packet, wherein the related parameter information includes, but is not limited to, a total frame number, a timestamp corresponding to a first frame, and a timestamp corresponding to a last frame, initializing a player based on the related parameter information of the frame animation compressed packet, and transferring a self-checking function player. fnUDTime, the timer is used for acquiring the real-time playing time point of the player; fnexport, a binding animation frame output container. The animation frame output container is used for being responsible for displaying the final exhibition.
In this embodiment, the player triggers and executes a self-check function player.
Referring to fig. 2, the process of using the first frame animation file in the file array as the frame animation file to be played specifically includes the following steps:
s201, judging whether the player is in a playing state, if so, executing S202, otherwise, returning to execute S201.
In this embodiment, the self-check function of the player determines whether the player is in a playing state.
S202, taking the first frame animation file in the file array as a frame animation file to be played.
In this embodiment, if the player is in the playing state, the first frame animation file in the file array is used as the frame animation file to be played.
S105, judging whether the current playing time of the player is not less than the time stamp of the frame animation file to be played, if so, executing S106, and if not, executing S107.
In this embodiment, the current playing time of the player is obtained, specifically, the current playing time of the player is obtained through the pre-bound timer.
In this embodiment, it is determined whether the current playing time of the player is not less than the timestamp of the frame animation file to be played.
S106, judging whether the current playing time of the player is smaller than the time stamp of the next frame animation file of the frame animation files to be played in the file array, if so, executing S108, and if not, executing S109.
In this embodiment, under the condition that the current playing time of the player is not less than the timestamp of the frame animation file to be played, it is further determined whether the current playing time of the player is less than the timestamp of the next frame animation file of the frame animation file to be played in the file array.
S107, judging whether the currently played frame animation file carries a static mark, if so, returning to execute S105, and if not, executing S109.
In this embodiment, a multi-frame animation corresponding to a still picture may be replaced with a frame of animation, and a still flag is set for a picture corresponding to the frame of animation, that is, a still flag is set for a frame of animation file corresponding to the frame of animation, and optionally, the still flag may be "-X".
In this embodiment, when the current playing time of the player is less than the timestamp of the frame animation file to be played, it is further determined whether the frame animation file currently being played carries a still flag, that is, whether the frame animation file currently being played carries an "-X" flag.
In this embodiment, when the current playing time of the player is less than the timestamp of the frame animation file to be played, if the frame animation file being played currently carries a still mark, it indicates that the current animation needs to be kept still, and the step S105 is executed again.
And S108, deleting the frame animation file in the preset animation frame output container, and writing the frame animation file to be played into the animation frame output container.
In this embodiment, if the current playing time of the player is not less than the timestamp of the frame animation file to be played and the current playing time of the player is less than the timestamp of the next frame animation file in the frame animation files to be played in the file array, the frame animation file in the preset animation frame output container is deleted, and the frame animation file to be played is written into the animation frame output container.
S109, determining the time to be indexed based on the current playing time of the player.
In this embodiment, if the current playing time of the player is less than the timestamp of the frame animation file to be played and the frame animation file being played currently does not carry a static mark, it indicates that a new frame animation file needs to be obtained again, and the time to be indexed is determined based on the current playing time of the player.
In this embodiment, if the current playing time of the player is not less than the timestamp of the frame animation file to be played, and the current playing time of the player is not less than the timestamp of the next frame animation file of the frame animation file to be played in the file array, it indicates that a new frame animation file needs to be reacquired, and the time to be indexed is determined based on the current playing time of the player.
S110, calling a preset animation frame output function, and executing a frame animation file in the animation frame output container so as to play the frame animation file in the animation frame output container.
In this embodiment, after writing the frame animation file to be played into the animation frame output container, a preset animation frame output function fnExport is called, and the frame animation file in the animation frame output container is executed, so as to play the frame animation file in the animation frame output container, that is, play the picture in the frame animation file in the animation frame output container.
And S111, searching the frame animation file corresponding to the time to be indexed from the file array, determining the searched frame animation file as a new frame animation file to be played, and returning to execute S105 based on the new frame animation file to be played.
In this embodiment, after the time to be indexed is determined, the frame animation file corresponding to the time to be indexed is searched from the file array.
Specifically, the process of searching the frame animation file corresponding to the time to be indexed from the file array by using the parameter map 3 includes the following steps:
s301, acquiring a reference index.
In this embodiment, a reference index is obtained, where the reference index is used to indicate an index number corresponding to a frame animation file currently being played by a player, and the index number is used to indicate a position of the frame animation file currently being played by the player in a file array.
Optionally, if the player does not start playing the frame animation file currently, the reference index defaults to 0.
S302, the next frame animation file of the frame animation file corresponding to the reference index in the file array is used as an initial frame animation file.
In this embodiment, the next frame animation file of the frame animation file corresponding to the parameter random shadow in the file array is used as the initial frame animation file.
S303, judging whether the time to be indexed is larger than the time stamp of the previous frame animation file of the initial frame animation file in the file array and smaller than the time stamp of the initial frame animation file, if so, executing S304, and if not, executing S305.
In this embodiment, it is determined whether the time to be indexed is greater than the timestamp of the previous frame animation file of the initial frame animation file in the file array and is less than the timestamp of the initial frame animation file, that is, whether the time to be indexed is between the timestamp of the initial frame animation file in the file array and the timestamp of the initial frame animation file.
S304, determining the initial frame animation file as a frame animation file corresponding to the time to be indexed.
In this embodiment, if the time to be indexed is greater than the timestamp of the previous frame animation file of the initial frame animation file in the file array and is less than the timestamp of the initial frame animation file, the initial animation file is determined as the frame animation file corresponding to the time to be indexed.
S305, taking the next frame animation file of the initial frame animation file in the file array as a new initial frame animation file, and returning to execute S303 based on the new initial frame animation file.
In this embodiment, if the time to be indexed is not greater than the timestamp of the previous frame animation file of the initial frame animation file, or the time to be indexed is not less than the timestamp of the initial frame animation file, the next frame animation file of the initial frame animation file in the file array is used as a new initial frame animation file, and step S303 is executed based on the new initial frame animation file.
And S112, judging whether the frame animation file to be played is the last frame animation file in the file array, if not, executing S113, and if so, directly ending.
In this embodiment, it is determined whether the frame animation file to be played is the last frame animation file in the file array, and if the frame animation file to be played is the last frame animation file in the file array, it indicates that all the frame animation files have been played, and the playing is finished.
If the frame animation file to be played is not the last frame animation file in the file array, it indicates that there is still a frame animation file that has not been played, and step S113 is executed.
S113, taking the next frame animation file of the frame animation files to be played in the file array as a new frame animation file to be played, and returning to execute S105 based on the new frame animation file to be played.
In this embodiment, if the frame animation file to be played is not the last frame animation file in the file array, the next frame animation file of the frame animation file to be played in the file array is used as a new frame animation file to be played, and step S105 is executed again based on the new frame animation file to be played.
The frame animation playing method provided by the embodiment of the application obtains the frame animation compression packet, decompresses the frame animation compression packet to obtain each frame animation file included in the frame animation compression packet, and forms each frame animation file into a file array based on the timestamp of each frame animation file, so that each frame animation file in file data is sequentially written into an animation frame output container, a preset animation frame output function is called, and the frame animation files in the animation frame output container are sequentially executed to realize playing of each frame animation file. Therefore, according to the scheme, the frame animation compression package is obtained, so that the picture format in the frame animation file included in the frame animation compression package can be any picture format, and a special effect program does not need to be written, and therefore the development cost is high and the resource occupation is reduced.
According to the frame animation playing method provided by the embodiment of the application, through the native H5, the player provided by the application realizes more flexible and changeable animation frame playing capacity, is not limited by picture formats, and can also apply strong control capacity of native CSS and DOM of a browser. So as to meet the realization requirement of the webpage animation under the harsh condition.
The frame animation playing method mentioned in the embodiment of the present application is exemplified as follows:
1. acquiring a frame animation compression packet:
the first step is as follows: catch using browser API window.
The second step is that: the compressed packet, await fetch (' mask.
The third step: after the compressed packet is loaded, the received streaming data is converted into a binary byte fixed-width array response.
The fourth step: and finally obtaining the buffer object ab corresponding to the compressed packet.
2. Buffering and decompressing:
the first step is as follows: and importing a decompression module fflate.
The second step is that: perform synchronous decompression of fft. unshipsync (new Uint8Array (ab)).
The third step: obtaining decompressed file list object files, such as: { 'File name 1.svg': File binary body 1, "File name 2.svg": File binary body 2. }.
3. Preprocessing a file list object:
the first step is as follows: list item clean up, delete 0 width object file.
The second step is that: the file name is parsed and a frame timestamp fname2Seconds (files [ i ] [0]) is obtained.
The third step: the binary file body is converted from binary Uint 8to Base64 character string U8ToB64(files [ i ] [1 ]).
4. Frame animation retriever preparation:
the first step is as follows: the reference index Idx and the corresponding timestamp (usually the valid result of the last search) are taken.
The second step is that: if the reference index is not taken (or the result is invalid), the default reference index is 0, i.e., from scratch.
The third step: when the time point to be indexed is reached, for example, the indexer is expected to find the closest next frame index Idx from the file list until 235 milliseconds from the animation playing.
The fourth step: the file list array entries are polled starting with the reference index.
The fifth step: judging whether the target time point is between the time stamps of the last index and the current index entry, namely: last timestamp > target time > = current timestamp.
And a sixth step: if the condition is true, returning to the current array polling Idx; otherwise, jumping to the fourth step to continue the next polling.
5. Player synchronization preparation:
the first step is as follows: initialization states, such as: status, total number of frames, first frame/last frame timestamp, etc.
The second step is that: the player self-check function player & status check is used as a parameter, transferred to the browser window & request animation frame method and executed, and a binding relationship is established, so that the player obtains animation processing capacity (about 60 frames per second) with the same frequency as the browser redraws.
The third step: a binding timer for acquiring a current real-time playing time point vm.
And fourthly, binding the animation frame output container, and finally displaying the VM in the picture by taking charge of the picture.
6. And (3) animation output:
the first step is as follows: request animation frame, trigger execution of player self-check function player status check.
The second step is that: the player status is checked and if the non-play Status (STOP) or the file list object (step 4) is not ready, a jump is made back to the first step to wait for the next callback trigger.
The third step: and acquiring the current real-time playing time through fnUDTime.
The fourth step: extracting a current animation frame to be output (curr = files [ Idx ]), a last animation frame to be output (before = files [ Idx-1]), and an animation frame behind the frame to be output (next = files [ Idx +1 ]).
The fifth step: if the current real-time playing time is larger than the time stamp of an animation frame after a frame to be output or smaller than or equal to the time stamp of the last output animation frame (fnUDTime > nextFileTime | | | fnUDTime < = before FileTime), judging that the current playing is non-sequential playing, retrieving a file list again, triggering a frame animation retriever to search a frame closest to the current real-time playing time, and returning to the first step.
And a sixth step: if the current real-time playing time is equal to the current animation frame time stamp to be output (fnUDTime ≈ currFileTime), judging that the current animation frame is played sequentially, executing an animation output function (fnExport), updating the current playing index to be the next frame (VM. curridx = VM. curridx + 1), and finally returning to the first step.
The seventh step: if the last animation frame which is output is marked with the file name of the "_ x", the current animation exhibition is not carried out, the last animation which is output to the container is emptied (fnExport (')), and the first step is returned to enter the silent state until the conditions of the fifth step or the sixth step are met.
It should be noted that while instructions are depicted in a particular order, this should not be understood as requiring that such instructions be performed in the particular order shown or in sequential order. Under certain circumstances, multitasking and parallel processing may be advantageous.
It should be understood that the various steps recited in the method embodiments disclosed herein may be performed in a different order and/or performed in parallel. Moreover, method embodiments may include additional steps and/or omit performing the illustrated steps. The scope of the disclosure is not limited in this respect.
Corresponding to the method described in fig. 1, an embodiment of the present application further provides a frame animation playing device, which is used for implementing the method in fig. 1 specifically, and a schematic structural diagram of the frame animation playing device is shown in fig. 4, and specifically includes:
an obtaining unit 401, configured to obtain a frame animation compressed packet;
a decompression unit 402, configured to decompress the frame animation compressed packet to obtain each frame animation file included in the frame animation compressed packet;
a combining unit 403, configured to combine the frame animation files into a file array based on the time stamps of the frame animation files;
a first determining unit 404, configured to use a first frame animation file in the file array as a frame animation file to be played;
a first judging unit 405, configured to judge whether a current playing time of the player is not less than a timestamp of the frame animation file to be played and is less than a timestamp of a next frame animation file of the frame animation file to be played in the file array, and if the current playing time of the player is not less than the timestamp of the frame animation file to be played and is less than the timestamp of the next frame animation file of the frame animation file to be played in the file array, delete the frame animation file in a preset animation frame output container, write the frame animation file to be played in the animation frame output container, call a preset animation frame output function, execute the frame animation file in the animation frame output container, and play the frame animation file in the animation frame output container;
a second judging unit 406, configured to judge whether the frame animation file to be played is the last frame animation file in the file array;
a first returning unit 407, configured to, if the frame animation file to be played is not the last frame animation file in the file array, take the next frame animation file of the frame animation file to be played in the file array as a new frame animation file to be played, and return to the step of determining whether the current playing time of the player is not less than the timestamp of the frame animation file to be played and less than the timestamp of the next frame animation file of the frame animation file to be played in the file array, based on the new frame animation file to be played, until the frame animation file to be played is the last frame animation file in the file array.
According to the frame animation playing device provided by the embodiment of the application, the frame animation compression package is obtained, so that the picture format in the frame animation file included in the frame animation compression package can be any picture format, and a special effect program does not need to be written, and therefore the development cost is high and the resource occupation is reduced.
In an embodiment of the present application, based on the foregoing scheme, the method may further include:
a third judging unit, configured to judge whether the frame animation file currently being played carries a static mark if the current playing time of the player is less than the timestamp of the frame animation file to be played;
a second returning unit, configured to return to the step of determining whether the current playing time of the player is not less than the timestamp of the frame animation file to be played and is less than the timestamp of the next frame animation file of the frame animation file to be played in the file array, if the frame animation file currently being played carries a static mark;
the second determining unit is used for determining the time to be indexed based on the current playing time of the player if the frame animation file which is currently played does not carry a static mark;
the first searching unit is used for searching the frame animation file corresponding to the time to be indexed from the file array;
and the second returning unit is used for determining the searched frame animation file as a new frame animation file to be played, and returning to execute the step of judging whether the current playing time of the player is not less than the timestamp of the frame animation file to be played and less than the timestamp of the next frame animation file of the frame animation file to be played in the file array based on the new frame animation file to be played.
In an embodiment of the present application, based on the foregoing scheme, the method may further include:
a third determining unit, configured to determine, based on the current playing time of the player, time to be indexed if the current playing time of the player is not less than a timestamp of a next frame animation file of the frame animation files to be played in the file array;
the second searching unit is used for searching the frame animation file corresponding to the time to be indexed from the file array;
and the third returning unit is used for determining the searched frame animation file as a new frame animation file to be played, and returning to execute the step of judging whether the current playing time of the player is not less than the timestamp of the frame animation file to be played and less than the timestamp of the next frame animation file of the frame animation file to be played in the file array based on the new frame animation file to be played.
In an embodiment of the application, based on the foregoing scheme, the second determining unit is specifically configured to:
acquiring a reference index;
taking the next frame animation file of the frame animation file corresponding to the reference index in the file array as an initial frame animation file;
judging whether the time to be indexed is greater than the timestamp of the previous frame animation file of the initial frame animation file in the file array and is less than the timestamp of the initial frame animation file;
if so, determining the initial frame animation file as a frame animation file corresponding to the time to be indexed;
if not, taking the next frame animation file of the initial frame animation file in the file array as a new initial frame animation file, and returning to the step of judging whether the time to be indexed is greater than the timestamp of the last frame animation file of the initial frame animation file in the file array and is less than the timestamp of the initial frame animation file based on the new initial frame animation file.
In an embodiment of the present application, based on the foregoing scheme, the obtaining unit 401 is specifically configured to:
calling an Application Programming Interface (API) of a browser, and loading a frame animation compression packet; in the loading process, the loaded data is converted into binary data, and the binary data is buffered.
In an embodiment of the present application, based on the foregoing scheme, the first determining unit 404 is specifically configured to:
judging whether the player is in a playing state;
and if the player is in a playing state, taking the first frame animation file in the file array as a frame animation file to be played.
The embodiment of the present application further provides a storage medium, where the storage medium stores an instruction set, and when the instruction set runs, the frame animation playing method disclosed in any of the above embodiments is executed.
An embodiment of the present application further provides an electronic device, a schematic structural diagram of which is shown in fig. 5, and specifically includes a memory 501, configured to store at least one set of instruction sets; a processor 502 for executing the instruction set stored in the memory, and implementing the frame animation playing method as disclosed in any of the above embodiments by executing the instruction set.
Although the subject matter has been described in language specific to structural features and/or methodological acts, it is to be understood that the subject matter defined in the appended claims is not necessarily limited to the specific features or acts described above. Rather, the specific features and acts described above are disclosed as example forms of implementing the claims.
While several specific implementation details are included in the above discussion, these should not be construed as limitations on the scope of the disclosure. Certain features that are described in the context of separate embodiments can also be implemented in combination in a single embodiment. Conversely, various features that are described in the context of a single embodiment can also be implemented in multiple embodiments separately or in any suitable subcombination.
The foregoing description is only exemplary of the preferred embodiments disclosed herein and is illustrative of the principles of the technology employed. It will be appreciated by those skilled in the art that the scope of the disclosure herein is not limited to the particular combination of features described above, but also encompasses other arrangements formed by any combination of the above features or their equivalents without departing from the spirit of the disclosure. For example, the above features and (but not limited to) technical features having similar functions disclosed in the present disclosure are mutually replaced to form the technical solution.
Claims (10)
1. A frame animation playing method is characterized by comprising the following steps:
acquiring a frame animation compressed packet;
decompressing the frame animation compressed packet to obtain each frame animation file included in the frame animation compressed packet; the frame animation file comprises a file name and a file binary main body;
preprocessing the frame animation file; the pretreatment comprises the following steps: deleting the frame animation file with the width of 0, and converting the binary main body of the file of the rest frame animation file from binary to Base64 character string;
forming a file array by each frame animation file based on the time stamp of each frame animation file after preprocessing; the time stamp is obtained by analyzing the file name of the frame animation file;
taking the first frame animation file in the file array as a frame animation file to be played;
judging whether the current playing time of the player is not less than the time stamp of the frame animation file to be played and less than the time stamp of the next frame animation file of the frame animation file to be played in the file array, if the current playing time of the player is not less than the time stamp of the frame animation file to be played and less than the time stamp of the next frame animation file of the frame animation file to be played in the file array, deleting the frame animation file in a preset animation frame output container, writing the frame animation file to be played into the animation frame output container, calling a preset animation frame output function, executing the frame animation file in the animation frame output container, and playing the frame animation file in the animation frame output container;
if the current playing time of the player is less than the timestamp of the frame animation file to be played, judging whether the frame animation file currently being played carries a static mark;
if the frame animation file currently being played carries a static mark, returning to the step of judging whether the current playing time of the player is not less than the time stamp of the frame animation file to be played and less than the time stamp of the next frame animation file of the frame animation file to be played in the file array;
judging whether the frame animation file to be played is the last frame animation file in the file array or not;
and if the frame animation file to be played is not the last frame animation file in the file array, taking the next frame animation file of the frame animation file to be played in the file array as a new frame animation file to be played, returning to the step of judging whether the current playing time of the player is not less than the time stamp of the frame animation file to be played and less than the time stamp of the next frame animation file of the frame animation file to be played in the file array based on the new frame animation file to be played until the frame animation file to be played is the last frame animation file in the file array.
2. The method of claim 1, further comprising:
if the frame animation file which is played currently does not carry a static mark, determining the time to be indexed based on the current playing time of the player;
searching a frame animation file corresponding to the time to be indexed from the file array;
and determining the searched frame animation file as a new frame animation file to be played, and returning to the step of judging whether the current playing time of the player is not less than the timestamp of the frame animation file to be played and less than the timestamp of the next frame animation file of the frame animation file to be played in the file array based on the new frame animation file to be played.
3. The method of claim 1, further comprising:
if the current playing time of the player is not less than the timestamp of the next frame animation file of the frame animation file to be played in the file array, determining the time to be indexed based on the current playing time of the player;
searching a frame animation file corresponding to the time to be indexed from the file array;
and determining the searched frame animation file as a new frame animation file to be played, and returning to the step of judging whether the current playing time of the player is not less than the timestamp of the frame animation file to be played and less than the timestamp of the next frame animation file of the frame animation file to be played in the file array based on the new frame animation file to be played.
4. The method according to claim 2 or 3, wherein the searching the frame animation file corresponding to the time to be indexed from the file array comprises:
acquiring a reference index;
taking the next frame animation file of the frame animation file corresponding to the reference index in the file array as an initial frame animation file;
judging whether the time to be indexed is greater than the timestamp of the previous frame animation file of the initial frame animation file in the file array and is less than the timestamp of the initial frame animation file;
if so, determining the initial frame animation file as a frame animation file corresponding to the time to be indexed;
if not, taking the next frame animation file of the initial frame animation file in the file array as a new initial frame animation file, and returning to the step of judging whether the time to be indexed is greater than the timestamp of the last frame animation file of the initial frame animation file in the file array and is less than the timestamp of the initial frame animation file based on the new initial frame animation file.
5. The method of claim 1, wherein obtaining the frame animation compressed packet comprises:
calling an Application Programming Interface (API) of a browser, and loading a frame animation compression packet; in the loading process, the loaded data is converted into binary data, and the binary data is buffered.
6. The method according to claim 1, wherein the step of using the first frame animation file in the file array as the frame animation file to be played comprises:
judging whether the player is in a playing state;
and if the player is in a playing state, taking the first frame animation file in the file array as a frame animation file to be played.
7. A frame animation playback apparatus, comprising:
the acquisition unit is used for acquiring the frame animation compressed packet;
the decompression unit is used for decompressing the frame animation compressed packet to obtain each frame animation file included in the frame animation compressed packet; the frame animation file comprises a file name and a file binary main body;
the combination unit is used for preprocessing the frame animation file; forming a file array by each frame animation file based on the time stamp of each frame animation file after preprocessing; the time stamp is obtained by analyzing the file name of the frame animation file; the pretreatment comprises the following steps: deleting the frame animation file with the width of 0, and converting the binary main body of the file of the rest frame animation file from binary to Base64 character string;
the first determining unit is used for taking the first frame animation file in the file array as a frame animation file to be played;
the first judging unit is used for judging whether the current playing time of the player is not less than the time stamp of the frame animation file to be played and less than the time stamp of the next frame animation file of the frame animation file to be played in the file array, if the current playing time of the player is not less than the time stamp of the frame animation file to be played and less than the time stamp of the next frame animation file of the frame animation file to be played in the file array, deleting the frame animation file in a preset animation frame output container, writing the frame animation file to be played into the animation frame output container, calling a preset animation frame output function, executing the frame animation file in the animation frame output container, and playing the frame animation file in the animation frame output container;
a third judging unit, configured to judge whether the frame animation file currently being played carries a static mark if the current playing time of the player is less than the timestamp of the frame animation file to be played;
a second returning unit, configured to return to the step of determining whether the current playing time of the player is not less than the timestamp of the frame animation file to be played and is less than the timestamp of the next frame animation file of the frame animation file to be played in the file array, if the frame animation file currently being played carries a static mark;
the second judging unit is used for judging whether the frame animation file to be played is the last frame animation file in the file array;
and the first returning unit is used for taking the next frame animation file of the frame animation file to be played in the file array as a new frame animation file to be played if the frame animation file to be played is not the last frame animation file in the file array, and returning to execute the step of judging whether the current playing time of the player is not less than the timestamp of the frame animation file to be played and less than the timestamp of the next frame animation file of the frame animation file to be played in the file array until the frame animation file to be played is the last frame animation file in the file array based on the new frame animation file to be played.
8. The apparatus of claim 7, further comprising:
the second determining unit is used for determining the time to be indexed based on the current playing time of the player if the frame animation file which is currently played does not carry a static mark;
the first searching unit is used for searching the frame animation file corresponding to the time to be indexed from the file array;
and the second returning unit is used for determining the searched frame animation file as a new frame animation file to be played, and returning to execute the step of judging whether the current playing time of the player is not less than the timestamp of the frame animation file to be played and less than the timestamp of the next frame animation file of the frame animation file to be played in the file array based on the new frame animation file to be played.
9. A storage medium storing a set of instructions, wherein the set of instructions, when executed by a processor, implement a frame animation playing method according to any one of claims 1 to 6.
10. An electronic device, comprising:
a memory for storing at least one set of instructions;
a processor for executing the instruction set stored in the memory, and implementing the frame animation playing method according to any one of claims 1 to 6 by executing the instruction set.
Priority Applications (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN202111594033.XA CN113989425B (en) | 2021-12-24 | 2021-12-24 | Frame animation playing method and device, storage medium and electronic equipment |
Applications Claiming Priority (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN202111594033.XA CN113989425B (en) | 2021-12-24 | 2021-12-24 | Frame animation playing method and device, storage medium and electronic equipment |
Publications (2)
| Publication Number | Publication Date |
|---|---|
| CN113989425A CN113989425A (en) | 2022-01-28 |
| CN113989425B true CN113989425B (en) | 2022-04-26 |
Family
ID=79734253
Family Applications (1)
| Application Number | Title | Priority Date | Filing Date |
|---|---|---|---|
| CN202111594033.XA Active CN113989425B (en) | 2021-12-24 | 2021-12-24 | Frame animation playing method and device, storage medium and electronic equipment |
Country Status (1)
| Country | Link |
|---|---|
| CN (1) | CN113989425B (en) |
Citations (3)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN108664299A (en) * | 2018-03-28 | 2018-10-16 | 北京奇艺世纪科技有限公司 | A kind of control method for playing back of frame animation, device and mobile device |
| CN109389661A (en) * | 2017-08-04 | 2019-02-26 | 阿里健康信息技术有限公司 | A kind of animation file method for transformation and device |
| CN110647703A (en) * | 2019-09-18 | 2020-01-03 | 平安科技（深圳）有限公司 | Animation playing method and device, computer equipment and storage medium |
Family Cites Families (1)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN112070867A (en) * | 2019-06-11 | 2020-12-11 | 腾讯科技（深圳）有限公司 | Animation file processing method and device, computer readable storage medium and computer equipment |
-
2021
- 2021-12-24 CN CN202111594033.XA patent/CN113989425B/en active Active
Patent Citations (3)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN109389661A (en) * | 2017-08-04 | 2019-02-26 | 阿里健康信息技术有限公司 | A kind of animation file method for transformation and device |
| CN108664299A (en) * | 2018-03-28 | 2018-10-16 | 北京奇艺世纪科技有限公司 | A kind of control method for playing back of frame animation, device and mobile device |
| CN110647703A (en) * | 2019-09-18 | 2020-01-03 | 平安科技（深圳）有限公司 | Animation playing method and device, computer equipment and storage medium |
Also Published As
| Publication number | Publication date |
|---|---|
| CN113989425A (en) | 2022-01-28 |
Similar Documents
| Publication | Publication Date | Title |
|---|---|---|
| CN116501210B (en) | Display method, electronic equipment and storage medium | |
| CN103914205B (en) | A kind of file thumbnail methods of exhibiting of intelligent terminal and device | |
| US20110113365A1 (en) | Scrolling large data sets | |
| CN108810132B (en) | Animation display method, device, terminal, server and storage medium | |
| CN104254849A (en) | User terminal apparatus supporting fast web scroll of web documents and method therefor | |
| CN112817657B (en) | Application program starting item loading method, device, system and storage medium | |
| WO2021057325A1 (en) | Methods for caching and reading content, client, and storage medium | |
| CN113989425B (en) | Frame animation playing method and device, storage medium and electronic equipment | |
| CN113378084A (en) | Page display method and device, electronic equipment and computer readable storage medium | |
| CN112905920B (en) | Page display method and device | |
| US9633408B2 (en) | Coalescing graphics operations | |
| CN116414607A (en) | Fault detection method and device for application program | |
| CN113378895B (en) | Classification model generation method and device, storage medium and electronic equipment | |
| CN115438290A (en) | Method and system for automatically analyzing static resources of single-page application and preloading | |
| CN115421693A (en) | Method and device for realizing micro front-end architecture, computer equipment and storage medium | |
| CN115758002A (en) | Method, device, equipment and program product for displaying electronic map POI | |
| CN115495020A (en) | File processing method and device, electronic equipment and readable storage medium | |
| CN113672293B (en) | Media data processing method based on cloud mobile phone and terminal equipment | |
| WO2014024255A1 (en) | Terminal and video playback program | |
| Cai et al. | NetPadBrowser: An Offline Browser for Web-Based Dynamic Geometric Resources | |
| CN109491803B (en) | Page processing method and device and related equipment | |
| CN110381370B (en) | Animation processing method and device, terminal and storage medium | |
| CN113961298A (en) | Page switching method, device, equipment and medium | |
| CN118331658B (en) | Application program running method, device, computer equipment, storage medium and product | |
| CN117389668A (en) | Icon loading method and device |
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 |