WO2025044461A1 - Frame animation processing method and apparatus, electronic device, and storage medium - Google Patents
Frame animation processing method and apparatus, electronic device, and storage medium Download PDFInfo
- Publication number
- WO2025044461A1 WO2025044461A1 PCT/CN2024/102007 CN2024102007W WO2025044461A1 WO 2025044461 A1 WO2025044461 A1 WO 2025044461A1 CN 2024102007 W CN2024102007 W CN 2024102007W WO 2025044461 A1 WO2025044461 A1 WO 2025044461A1
- Authority
- WO
- WIPO (PCT)
- Prior art keywords
- frame
- view component
- dynamic view
- animation
- frame animation
- 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.)
- Pending
Links
Classifications
-
- G—PHYSICS
- G06—COMPUTING OR CALCULATING; 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 OR CALCULATING; COUNTING
- G06T—IMAGE DATA PROCESSING OR GENERATION, IN GENERAL
- G06T13/00—Animation
Definitions
- the present application relates to the field of computer technology, and in particular to a frame animation processing method, device, electronic device and storage medium in the field of computer technology.
- Frame animation is a common animation effect that can simulate animation effects by displaying a series of images frame by frame.
- frame animation needs to traverse and parse a large number of image resources during playback, there will be freezes or flickers when switching from static images to frame animations.
- the present application provides a frame animation processing method, device, electronic device and storage medium.
- the frame animation processing method can avoid the problem of freezing or flickering when a static image is switched to a frame animation.
- the present application provides a frame animation processing method, the frame animation processing method comprising:
- the display content of the dynamic view component is switched from a static image to a sequence of frame images of the frame animation.
- switching the display content of the dynamic view component from a static image to a sequence of frame images of a frame animation includes:
- the display content of the dynamic view component is switched from a static image to a sequence of frame images of a frame animation; the sequence of frame images of the frame animation is rendered and displayed frame by frame on the dynamic view component.
- the present application provides a frame animation processing method, the frame animation processing method comprising:
- the display state of the static view component is switched from a visible state to a hidden state, and the display state of the dynamic view component is switched from a hidden state to a visible state;
- setting the display content of the dynamic view component to the first frame image of the frame animation includes:
- the display content of the dynamic view component is set to the first frame image of the frame animation, and the display state of the dynamic view component is set to the hidden state.
- setting the display content of the dynamic view component to before the first frame image of the frame animation includes:
- switching the display content of the dynamic view component from the first frame image of the frame animation to the remaining sequence frame images of the frame animation includes:
- the display content of the dynamic view component is switched from the first frame image of the frame animation to the remaining sequence frame images of the frame animation; the remaining sequence frame images of the frame animation are rendered and displayed frame by frame on the dynamic view component.
- the present application provides a frame animation processing device, the frame animation processing device comprising:
- the first preset module is used to set the display content of the dynamic view component to a static image; the dynamic view component runs in a non-main thread;
- the first switching module is used to switch the display content of the dynamic view component from a static image to a sequence of frame images of the frame animation when a trigger event for playing the frame animation is received.
- the first switching module is specifically configured to:
- the sequence frame images of the frame animation are traversed and parsed through the dynamic view component
- the display content of the dynamic view component is switched from a static image to a sequence of frame images of a frame animation; the sequence of frame images of the frame animation is rendered and displayed frame by frame on the dynamic view component.
- the present application provides a frame animation processing device, the frame animation processing device comprising:
- a second preset module used to set the display content of the static view component to a static image
- a third preset module is used to set the display content of the dynamic view component to the first frame image of the frame animation; the dynamic view component runs in a non-main thread;
- the second switching module is used to switch the display state of the static view component from the visible state to the hidden state, and switch the display state of the dynamic view component from the hidden state to the visible state when receiving the trigger event of playing the frame animation;
- the third switching module is used to switch the display content of the dynamic view component from the first frame image of the frame animation to the remaining sequence frame images of the frame animation.
- the third preset module is specifically used to:
- the display content of the dynamic view component is set to the first frame image of the frame animation, and the display state of the dynamic view component is set to the hidden state.
- the device further includes an initialization module, which is used to:
- the third switching module is specifically configured to:
- the display content of the dynamic view component is switched from the first frame image of the frame animation to the remaining sequence frame images of the frame animation; the remaining sequence frame images of the frame animation are rendered and displayed frame by frame on the dynamic view component.
- the present application provides an electronic device, comprising a memory and a processor.
- the memory is used to store executable program code
- the processor is used to call and run the executable program code from the memory, so that the electronic device executes the method in the first aspect or any possible implementation of the first aspect, or the second aspect or any possible implementation of the second aspect.
- the present application provides a computer program product, comprising: a computer program code, which, when executed on a computer, enables the computer to execute the method in the first aspect or any possible implementation of the first aspect, or the second aspect or any possible implementation of the second aspect.
- the present application provides a computer-readable storage medium, which stores a computer program code.
- the computer program code runs on a computer, the computer executes the method in the above-mentioned first aspect or any possible implementation of the first aspect, or the second aspect or any possible implementation of the second aspect.
- the display content of the dynamic view component is set to a static image or the first frame image of a frame animation; the dynamic view component runs in a non-main thread; when a trigger event for playing a frame animation is received, the display content of the dynamic view component is switched from a static image to a sequence frame image of a frame animation or from the first frame image of the frame animation to the remaining sequence frame images of the frame animation.
- This method can smoothly implement the switch from a static image to a frame animation, avoiding the problem of freeze or flicker during the switching process, and the dynamic view component running in a non-main thread can reduce the burden of the main thread, improve the response speed and fluency, avoid freezes in the frame animation playback, and improve the user experience.
- FIG2 is a schematic flow chart of a frame animation processing method provided in an embodiment of the present application.
- FIG3 is a schematic flow chart of another frame animation processing method provided in an embodiment of the present application.
- FIG4 is a schematic diagram showing another change in which a view component is switched from a static image to a frame animation provided by an embodiment of the present application;
- FIG5 is a schematic flow chart of another frame animation processing method provided in an embodiment of the present application.
- FIG6 is a schematic diagram showing a process of creating a view component according to an embodiment of the present application.
- FIG. 7 is a schematic diagram showing another switching process of a view component provided in an embodiment of the present application.
- FIG8 is a schematic diagram of the structure of a frame animation processing device provided in an embodiment of the present application.
- FIG9 is a schematic diagram of the structure of another frame animation processing device provided in an embodiment of the present application.
- FIG. 10 is a schematic diagram of the structure of an electronic device provided in an embodiment of the present application.
- the embodiment of the present application provides a frame animation processing method.
- the frame animation processing method can be implemented by a computer program and can be run on a frame animation processing device or system based on the von Neumann system.
- the computer program can be integrated into an application or run as an independent tool application.
- the frame animation processing device can be an electronic device, including but not limited to: a personal computer, a tablet computer, a handheld device, a vehicle-mounted device, a wearable device, a computing device, or other processing devices connected to a wireless modem.
- TextureView is a special view component in Android, which is used for asynchronous rendering of surfaces. It can render and draw frame animations in non-main threads without occupying the main thread, thereby avoiding the phenomenon of frame animation stuck.
- a static image 111 can be presented using a normal View (i.e., the static view 110 in FIG. 1 ), and a frame animation 121 can be played using a TextureView (i.e., the dynamic view 120 in FIG. 1 ).
- a TextureView i.e., the dynamic view 120 in FIG. 1
- it can be achieved by hiding the static view 110 and displaying the dynamic view 120.
- the dynamic view 120 After the dynamic view 120 is displayed, it takes a certain amount of time for the dynamic view 120 to parse the frame animation image and other steps, and the display content cannot be drawn in time, resulting in empty display content. Therefore, after the static view 110 is hidden, the dynamic view 120 that is displayed immediately has no display content, and then the first frame image of the frame animation 121 is played, causing the user to visually see flickering.
- FIG2 is a schematic flow chart of a frame animation processing method provided by an embodiment of the present application, and the method can be executed by an electronic device. As shown in FIG2, the method includes:
- the dynamic view component refers to a view group for playing frame animation in the embodiment of the present application.
- a dynamic view component is a view component that runs on a non-main thread, such as TextureView in Android, which can be used to render and display complex graphic content, such as displaying images or playing frame animations. Since the dynamic view component runs on a non-main thread (UI thread), using the dynamic view component to play frame animations does not interfere with the operation of the main thread, which helps improve the fluency of the application.
- UI thread non-main thread
- the target image may be a static image or the first frame image of a frame animation.
- the static image is displayed by the dynamic view component, that is, the static image and the frame animation are displayed using the same view component.
- the static image can be displayed by the static view component (other view component), that is, the static image and the frame animation are displayed using different view components.
- the display content of the dynamic view component needs to be set before playing the frame animation, so that the dynamic view component pre-loads and displays an image to avoid displaying a blank image when the frame animation needs to be played.
- the static image is switched to the frame animation.
- the trigger event can be a signal or command, such as an interactive operation of the user (such as clicking a button), a logical judgment of the program, a notification of the system, etc.
- the trigger event is used to notify the system of the timing to switch the static view to the frame animation, so that the dynamic view component starts playing the frame animation.
- the system can receive a trigger event for playing a frame animation only after the user interface displays a static image.
- a trigger event for playing a frame animation only after the user interface displays a static image.
- the static image of the part is displayed first. After the static image appears, the user can click on the static image (trigger event) to trigger the display of a more detailed frame animation to explain the specific situation of the problem.
- the target image displayed by the dynamic view component is a static image
- the entire process of switching from the static image to the frame animation is carried out within the same view component (dynamic view component). There is no need to switch between two different view components.
- the switching transition will be very smooth, and the user will not feel any incoherence or flickering when observing, which enhances the overall visual experience.
- the static image is displayed by the static view component.
- the dynamic view component displays the first frame of the frame animation before the switching process is executed, the dynamic view component will not display blank content even if the dynamic view component takes a long time to initialize or parse and render the frame animation. Therefore, when switching from the static view component to the dynamic view component, you can directly see the first frame of the frame animation, and then continue to play the sequence of frame images of the frame animation frame by frame. Users will not feel any discontinuity or flickering when observing, which enhances the overall visual experience.
- the sequence frame images of the frame animation are a series of frame images (static images) used to constitute the animation. These frame images are displayed one by one in a specific order and rate, thereby reflecting the animation effect.
- the display content of the dynamic view component is set to the target image; the dynamic view component runs in a non-main thread, and the target image is a static image or the first frame image of a frame animation; when a trigger event for playing a frame animation is received, the static image is switched to the frame animation, and the display content of the dynamic view component is switched from the target image to a sequence of frame images of the frame animation displayed frame by frame.
- This method can smoothly implement the switch from a static image to a frame animation, avoiding the problem of freeze or flicker during the switching process, and the dynamic view component running in a non-main thread can reduce the burden of the main thread, improve the response speed and fluency, avoid freezes in the frame animation playback, and improve the user experience.
- FIG3 is a schematic flow chart of another frame animation processing method provided in an embodiment of the present application, which can be executed by an electronic device. As shown in FIG3 , the method includes:
- the dynamic view component refers to the view component used to play the frame animation in the embodiment of the present application, and is a view component running on a non-main thread, such as TextureView in Android.
- the display content of the dynamic view component can be directly set to a static image, and when a frame animation needs to be displayed, the display content can be replaced, so that the static image and the frame animation are displayed using the same view component.
- the frame animation is played after the static image is displayed, so it is necessary to set the static image as the display content of the dynamic view component before playing the frame animation to meet the demand for displaying static images in the application scenario.
- the dynamic view component can be created and the display content can be set when the user interface is first displayed, and the user interface is used to display static images and frame animations.
- the system when it receives a trigger event for playing a frame animation, it starts switching from a static image to a frame animation.
- the dynamic view component traverses and parses the sequence frame images of the frame animation, and then switches the display content of the dynamic view component from a static image to the sequence frame images of the frame animation, which can be rendered and displayed frame by frame on the dynamic view component.
- the display of a static image 411 and the playback of a frame animation 412 are presented through a TextureView (i.e., the dynamic view component 410 in FIG4 ).
- a static image 411 is placed in the TextureView and set as the display content.
- the sequence frame images of the frame animation 412 are traversed and parsed, the first frame image of the frame animation 412 is rendered and replaced with the static image 411 in the TextureView for display, and then the sequence frame images of the frame animation 412 are rendered and displayed frame by frame, for example, the second frame image of the frame animation 412 is rendered and replaced with the first frame image in the TextureView for display, the third frame image of the frame animation 412 is rendered and replaced with the second frame image in the TextureView for display...
- TextureView in Android uses SurfaceTexture to render and display content.
- SurfaceTexture can be regarded as a subcomponent (rendering unit) inside the TextureView component.
- SurfaceTexture is a surface containing textures that can be used to render images generated by OpenGL ES and other hardware acceleration APIs, while TextureView provides a way to display such content in a regular view hierarchy.
- content (such as video streams or 3D graphics) can be rendered to SurfaceTexture and then displayed in the application interface through the associated TextureView.
- the display content of the dynamic view component is set to a static image; the dynamic view component runs in a non-main thread; when a trigger event for playing a frame animation is received, a switch is performed from the static image to the frame animation, and the display content of the dynamic view component is switched from the static image to a sequence of frame images of the frame animation.
- This method uses the same dynamic view component to display static images and frame animations, and can smoothly switch from static images to frame animations, avoiding problems such as freezes or flickers during the switching process.
- the dynamic view component runs in a non-main thread, which can reduce the burden on the main thread, improve the response speed and fluency, and improve the user experience.
- FIG5 is a schematic flow chart of another frame animation processing method provided in an embodiment of the present application, and the method can be executed by an electronic device. As shown in FIG5, the method includes:
- the static view component is used to display a fixed image content, and its display content can be set to a static image that needs to be displayed.
- the static view component can use a common view component, such as ImageView.
- the frame animation is played after the static image is displayed, so it is necessary to set the static image as the display content of the static view component before playing the frame animation to meet the demand for displaying static images in the application scenario.
- the static view component can be created and the display content can be set when the user interface is first displayed.
- the user interface is also an interface for displaying static images and frame animations.
- S502 Set the display content of the dynamic view component to the first frame image of the frame animation.
- the application After the application is started, it enters the user interface, creates a static view component in the user interface, and sets the specified static image as the display content of the static view component; at the same time, creates a dynamic view component in the user interface, and sets the first frame image of the frame animation as the display content of the dynamic view component.
- view components can have the ability to display static content and/or dynamic content, and the choice of which component to use may depend on specific needs.
- naming of the view components is only for the convenience of description. and distinction, not specific limitation.
- setting the display content of the dynamic view component to the first frame image of the frame animation includes: obtaining the first frame image of the frame animation; after the rendering unit in the dynamic view component is initialized, setting the display content of the dynamic view component to the first frame image of the frame animation, and setting the display state of the dynamic view component to the hidden state.
- the dynamic view component After the dynamic view component is created, its display content is blank.
- an initial display image is set, so that when switching from the static view component to the dynamic view component, the dynamic view component will not display blank content, which can avoid flickering.
- the initial display image is set to the first frame image of the frame animation, so that when playing the frame animation, the initial display image is replaced with other sequence frame images of the frame animation to avoid the problem of incoherence and jumping.
- before setting the display content of the dynamic view component to the first frame image of the frame animation it includes: creating a dynamic view component; setting the display state of the dynamic view component to a visible state to create and initialize a rendering unit in the dynamic view component.
- the rendering unit in the dynamic view component is not necessarily created and initialized immediately. Only when the display state of the dynamic view component is set to a visible state will the creation and initialization process of the rendering unit be triggered.
- the visibility property of a View can be set using the setVisibility(int visibility) method, which can be represented by one of the following three constants:
- View.INVISIBLE The view is not visible (hidden), but still occupies space in the layout.
- View.GONE The view is not visible (hidden) and does not occupy space in the layout.
- TextureView the content of TextureView is rendered to a SurfaceTexture (rendering unit).
- SurfaceTexture will be created and initialized only when TextureView is visible (that is, the visibility property of the view is View.VISIBLE). Therefore, even if the content in the dynamic view component does not need to be displayed, the dynamic view component should be set to a visible state.
- the dynamic view component such as TextureView
- the dynamic view component does not display content in the initial state (no image is rendered to its SurfaceTexture)
- the problem of interference between the display contents of the static view component and the dynamic view component can be avoided by controlling the hierarchy or transparency properties of the static view component and the dynamic view component through hierarchy management or transparency management.
- the system Before receiving the trigger event for playing a frame animation, the system needs to display a static image without playing the frame animation.
- the display state of the dynamic view component needs to be set to a hidden state to avoid interfering with the static view component in displaying the static image.
- a static view component 610 is created and placed in a static image 611, and then set to a visible state.
- the dynamic view component 620 (TextureView) is created at the same time as the static view component 610, but the content of TextureView needs to be rendered to SurfaceTexture (rendering unit).
- the initialization of SurfaceTexture is a time-consuming process, and SurfaceTexture will only be created and initialized when TextureView is visible. After the SurfaceTexture is initialized, the Android system will notify the developer that SurfaceTexture is ready through the onSurfaceTextureAvailable callback.
- the dynamic view component 620 may not be displayed at the beginning, in order to ensure the smooth playback of the frame animation, it is still necessary to set TextureView to visible, wait for the system to feedback the onSurfaceTextureAvailable notification, and then set the first frame image 621 of the frame animation to TextureView, and then hide TextureView after setting the first frame image 621 of the frame animation.
- the system when the system receives a trigger event for playing frame animation, it indicates that the interface needs to switch from displaying static image 711 to playing frame animation 721; therefore, the display state of static view component 710 can be switched from visible state to hidden state, and the display state of dynamic view component 720 can be switched from hidden state to visible state, so as to realize the switch from displaying static view component 710 to displaying dynamic view component 720.
- dynamic view component 720 Since dynamic view component 720 has been preloaded with a This is the first frame image of frame animation 721, so its displayed content is not blank content, and the user will not observe flickering during the view component switching process.
- S504 Switch the display content of the dynamic view component from the first frame image of the frame animation to the remaining sequence frame images of the frame animation.
- the display state of the dynamic view component is switched from a hidden state to a visible state, and the dynamic view component begins to traverse and parse the remaining sequence frame images of the frame animation; the display content of the dynamic view component is switched from the first frame image of the frame animation to the remaining sequence frame images of the frame animation.
- the remaining sequence frame images of the frame animation refer to all sequence frame images except the first frame image of the frame animation, which can be rendered and displayed frame by frame on the dynamic view component.
- the dynamic view component When the system receives a trigger event for playing frame animation and the display state of the dynamic view component switches to the visible state, it means that the frame animation needs to be played now.
- the dynamic view component first traverses and parses the sequence frame images of the frame animation. That is, it reads each frame of the frame animation and performs necessary analysis.
- the analysis process may involve format conversion, scaling or other preprocessing steps to ensure that each frame image can be displayed correctly.
- the rendering process may involve a processing step of converting each frame image from its original format to a format that can be directly displayed on the screen. One frame can be rendered and displayed, and the display can be replaced in sequence until the frame animation is played.
- the display content of the static view component is set to a static image; the display content of the dynamic view component is set to the first frame image of the frame animation; the dynamic view component runs in a non-main thread; when a trigger event for playing a frame animation is received, the display state of the static view component is switched from a visible state to a hidden state, and the display state of the dynamic view component is switched from a hidden state to a visible state; the display content of the dynamic view component is switched from the first frame image of the frame animation to the remaining sequence frame images of the frame animation.
- the dynamic view component of this method pre-loads the first frame image of the frame animation before switching, no blank content will appear during the process of switching from the static view to the dynamic view component display, and a smooth transition can be made from displaying the first frame image of the frame animation to displaying the remaining sequence frame images.
- This switching is continuous and seamless, avoiding the problem of freezes or flickers during the switching process, and the dynamic view component running in a non-main thread can reduce the burden on the main thread, while improving the response speed and fluency. It also improves the user experience.
- FIG. 8 is a schematic diagram of the structure of a frame animation processing device provided in an embodiment of the present application.
- the frame animation processing device 800 includes:
- the first preset module 810 is used to set the display content of the dynamic view component to a static image; the dynamic view component runs in a non-main thread;
- the first switching module 820 is configured to switch the display content of the dynamic view component from a static image to a sequence of frame images of the frame animation upon receiving a trigger event for playing the frame animation.
- the first switching module 820 is specifically configured to:
- the display content of the dynamic view component is switched from a static image to a sequence of frame images of a frame animation; the sequence of frame images of the frame animation is rendered and displayed frame by frame on the dynamic view component.
- the display content of the dynamic view component is set to a static image; the dynamic view component runs in a non-main thread; when a trigger event for playing a frame animation is received, the static image is switched to the frame animation, and the display content of the dynamic view component is switched from the static image to the sequence frame image of the frame animation.
- This method uses the same dynamic view component to display static images and frame animations, and can smoothly switch from static images to frame animations, avoiding the problem of freezing or flickering during the switching process.
- the dynamic view component running in a non-main thread can reduce the burden on the main thread, improve the response speed and fluency, and improve the user experience.
- FIG. 9 is a schematic diagram of the structure of another frame animation processing device provided in an embodiment of the present application.
- the frame animation processing device 900 includes:
- a second preset module 910 configured to set the display content of the static view component to a static image
- the third preset module 920 is used to set the display content of the dynamic view component to the first frame image of the frame animation; the dynamic view component runs in a non-main thread;
- the second switching module 930 is used to switch the display state of the static view component from the visible state to the hidden state, and switch the display state of the dynamic view component from the hidden state to the visible state when receiving a trigger event of playing a frame animation;
- the third switching module 940 is used to switch the display content of the dynamic view component from the first frame image of the frame animation to the remaining sequence frame images of the frame animation.
- the third preset module 920 is specifically used to:
- the display content of the dynamic view component is set to the first frame image of the frame animation
- the frame animation processing device 900 further includes an initialization module, which is used to:
- the display content of the dynamic view component is switched from the first frame image of the frame animation to the remaining sequence frame images of the frame animation; the remaining sequence frame images of the frame animation are rendered and displayed frame by frame on the dynamic view component.
- the display content of the static view component is set to a static image; the display content of the dynamic view component is set to the first frame image of the frame animation; the dynamic view component runs in a non-main thread; when a trigger event for playing the frame animation is received, the display state of the static view component is switched from a visible state to a hidden state, and the display state of the dynamic view component is switched from a hidden state to a visible state; the display content of the dynamic view component is switched from the first frame image of the frame animation to the remaining sequence frame images of the frame animation.
- the dynamic view component pre-loads the first frame image of the frame animation before switching, there will be no blank content in the process of switching from the static view to the dynamic view component display, and a smooth transition can be made from displaying the first frame image of the frame animation to displaying the remaining sequence frame images.
- This switching is continuous and seamless, avoiding the problem of freeze or flickering during the switching process, and the dynamic view component running in a non-main thread can reduce the burden of the main thread, improve the response speed and fluency, and improve the user experience.
- FIG. 10 is a schematic diagram of the structure of an electronic device provided in an embodiment of the present application.
- the electronic device 1000 includes: a memory 1010 and a processor 1020 , wherein the memory 1010 stores an executable program code 1011 , and the processor 1020 is used to call and execute the executable program code 1011 to perform a frame animation processing method.
- the embodiment of the present application can divide the electronic device into functional modules according to the above method example.
- each functional module can be corresponding, or two or more functions can be integrated into one processing module.
- the above integrated module can be implemented in the form of hardware.
- the division of modules in the application embodiment is schematic and is only a logical function division. There may be other division methods in actual implementation.
- the electronic device may include: a preset module and a first switching module, etc. It should be noted that all relevant contents of each step involved in the above method embodiment can be referred to the functional description of the corresponding functional module, which will not be repeated here.
- the electronic device provided in an embodiment of the present application is used to execute the above-mentioned frame animation processing method, and thus can achieve the same effect as the above-mentioned implementation method.
- the electronic device may include a processing module and a storage module.
- the processing module may be used to control and manage the actions of the electronic device.
- the storage module may be used to support the electronic device in executing related program codes and data.
- the processing module may be a processor or a controller, which may implement or execute various exemplary logic blocks, modules and circuits described in conjunction with the disclosure of this application.
- the processor may also be a combination that implements computing functions, such as a combination of one or more microprocessors, a combination of digital signal processing (DSP) and a microprocessor, etc.
- the storage module may be a memory.
- An embodiment of the present application also provides a computer-readable storage medium, in which a computer program code is stored.
- the computer program code When the computer program code is executed on a computer, the computer executes the above-mentioned related method steps to implement a frame animation processing method in the above-mentioned embodiment.
- An embodiment of the present application also provides a computer program product.
- the computer program product When the computer program product is run on a computer, the computer is enabled to execute the above-mentioned related steps to implement a frame animation processing method in the above-mentioned embodiment.
- the electronic device provided in the embodiments of the present application may specifically be a chip, component or module, and the electronic device may include a connected processor and memory; wherein the memory is used to store instructions, and when the electronic device is running, the processor may call and execute instructions so that the chip executes a frame animation processing method in the above-mentioned embodiments.
- the electronic device, computer-readable storage medium, computer program product or chip provided in the embodiments of the present application are all used to execute the corresponding methods provided above. Therefore, the beneficial effects that can be achieved can refer to the beneficial effects in the corresponding methods provided above and will not be repeated here.
- the disclosed devices and methods can be implemented in other ways.
- the device embodiments described above are only schematic, for example, the division of modules or units is only a logical function division, and there may be other division methods in actual implementation, such as multiple units or components can be combined or integrated into another device, or some features can be ignored or not executed.
- Another point is that the mutual coupling or direct coupling or communication connection shown or discussed can be through some interfaces, indirect coupling or communication connection of devices or units, which can be electrical, mechanical or other forms.
Landscapes
- Engineering & Computer Science (AREA)
- Software Systems (AREA)
- Theoretical Computer Science (AREA)
- Physics & Mathematics (AREA)
- General Physics & Mathematics (AREA)
- Human Computer Interaction (AREA)
- General Engineering & Computer Science (AREA)
- Processing Or Creating Images (AREA)
Abstract
Description
本申请要求于2023年08月30日提交国家知识产权局、申请号为202311104807.5、申请名称为“一种帧动画处理方法、装置、电子设备和存储介质”的中国专利申请的优先权,其全部内容通过引用结合在本申请中。This application claims the priority of the Chinese patent application filed with the State Intellectual Property Office on August 30, 2023, with application number 202311104807.5 and application name “A frame animation processing method, device, electronic device and storage medium”, all contents of which are incorporated by reference in this application.
本申请涉及计算机技术领域,尤其涉及计算机技术领域中一种帧动画处理方法、装置、电子设备和存储介质。The present application relates to the field of computer technology, and in particular to a frame animation processing method, device, electronic device and storage medium in the field of computer technology.
在Android平台上的应用开发中,有很多场景一开始需要展示一张静态图,然后在某个时机需要播放一段帧动画。帧动画是一种常见的动画效果,可以逐帧展示一系列图片来模拟动画效果。然而,由于帧动画在播放过程中需要遍历解析大量的图片资源,使得在从静态图切换至帧动画时会出现卡顿或闪烁的情况。In application development on the Android platform, there are many scenarios where you need to display a static image at the beginning and then play a frame animation at a certain time. Frame animation is a common animation effect that can simulate animation effects by displaying a series of images frame by frame. However, since frame animation needs to traverse and parse a large number of image resources during playback, there will be freezes or flickers when switching from static images to frame animations.
发明内容Summary of the invention
本申请提供了一种帧动画处理方法、装置、电子设备和存储介质,该帧动画处理方法能够避免静态图像切换至帧动画时出现卡顿或闪烁的问题。The present application provides a frame animation processing method, device, electronic device and storage medium. The frame animation processing method can avoid the problem of freezing or flickering when a static image is switched to a frame animation.
第一方面,本申请提供了一种帧动画处理方法,该帧动画处理方法包括:In a first aspect, the present application provides a frame animation processing method, the frame animation processing method comprising:
将动态视图组件的显示内容设为静态图像;动态视图组件运行在非主线程中;Set the display content of the dynamic view component to a static image; the dynamic view component runs in a non-main thread;
接收到播放帧动画的触发事件时,将动态视图组件的显示内容由静态图像切换为帧动画的序列帧图像。When a trigger event for playing a frame animation is received, the display content of the dynamic view component is switched from a static image to a sequence of frame images of the frame animation.
一种可能的实现方式中,将动态视图组件的显示内容由静态图像切换为帧动画的序列帧图像,包括:In a possible implementation, switching the display content of the dynamic view component from a static image to a sequence of frame images of a frame animation includes:
通过动态视图组件遍历并解析帧动画的序列帧图像; Traverse and parse the sequence frame images of frame animation through dynamic view components;
将动态视图组件的显示内容由静态图像切换为帧动画的序列帧图像;帧动画的序列帧图像在动态视图组件上逐帧渲染并显示。The display content of the dynamic view component is switched from a static image to a sequence of frame images of a frame animation; the sequence of frame images of the frame animation is rendered and displayed frame by frame on the dynamic view component.
第二方面,本申请提供了一种帧动画处理方法,该帧动画处理方法包括:In a second aspect, the present application provides a frame animation processing method, the frame animation processing method comprising:
将静态视图组件的显示内容设为静态图像;Set the display content of the static view component to a static image;
将动态视图组件的显示内容设为帧动画的第一帧图像;动态视图组件运行在非主线程中;Set the display content of the dynamic view component to the first frame image of the frame animation; the dynamic view component runs in a non-main thread;
接收到播放帧动画的触发事件时,将静态视图组件的显示状态由可见状态切换为隐藏状态,将动态视图组件的显示状态由隐藏状态切换为可见状态;When a trigger event for playing a frame animation is received, the display state of the static view component is switched from a visible state to a hidden state, and the display state of the dynamic view component is switched from a hidden state to a visible state;
将动态视图组件的显示内容由帧动画的第一帧图像切换为帧动画的其余序列帧图像。Switch the display content of the dynamic view component from the first frame image of the frame animation to the remaining sequence frame images of the frame animation.
一种可能的实现方式中,将动态视图组件的显示内容设为帧动画的第一帧图像,包括:In a possible implementation, setting the display content of the dynamic view component to the first frame image of the frame animation includes:
获取帧动画的第一帧图像;Get the first frame image of the frame animation;
在动态视图组件中的渲染单元初始化完成后,将动态视图组件的显示内容设为帧动画的第一帧图像,并将动态视图组件的显示状态设为隐藏状态。After the rendering unit in the dynamic view component is initialized, the display content of the dynamic view component is set to the first frame image of the frame animation, and the display state of the dynamic view component is set to the hidden state.
一种可能的实现方式中,将动态视图组件的显示内容设为帧动画的第一帧图像之前,包括:In a possible implementation, setting the display content of the dynamic view component to before the first frame image of the frame animation includes:
创建动态视图组件;Create dynamic view components;
将动态视图组件的的显示状态设为可见状态,以创建并初始化动态视图组件中的渲染单元。Set the display state of the dynamic view component to visible to create and initialize the rendering unit in the dynamic view component.
一种可能的实现方式中,将动态视图组件的显示内容由帧动画的第一帧图像切换为帧动画的其余序列帧图像,包括:In a possible implementation, switching the display content of the dynamic view component from the first frame image of the frame animation to the remaining sequence frame images of the frame animation includes:
通过动态视图组件遍历并解析帧动画的其余序列帧图像;Traverse and parse the remaining sequence frame images of the frame animation through the dynamic view component;
将动态视图组件的显示内容由帧动画的第一帧图像切换为帧动画的其余序列帧图像;帧动画的其余序列帧图像在动态视图组件上逐帧渲染并显示。The display content of the dynamic view component is switched from the first frame image of the frame animation to the remaining sequence frame images of the frame animation; the remaining sequence frame images of the frame animation are rendered and displayed frame by frame on the dynamic view component.
第三方面,本申请提供了一种帧动画处理装置,该帧动画处理装置包括:In a third aspect, the present application provides a frame animation processing device, the frame animation processing device comprising:
第一预设模块,用于将动态视图组件的显示内容设为静态图像;动态视图组件运行在非主线程中;The first preset module is used to set the display content of the dynamic view component to a static image; the dynamic view component runs in a non-main thread;
第一切换模块,用于接收到播放帧动画的触发事件时,将动态视图组件的显示内容由静态图像切换为帧动画的序列帧图像。 The first switching module is used to switch the display content of the dynamic view component from a static image to a sequence of frame images of the frame animation when a trigger event for playing the frame animation is received.
一种可能的实现方式中,第一切换模块具体用于:In a possible implementation, the first switching module is specifically configured to:
接收到播放帧动画的触发事件时,通过动态视图组件遍历并解析帧动画的序列帧图像;When receiving a trigger event for playing a frame animation, the sequence frame images of the frame animation are traversed and parsed through the dynamic view component;
将动态视图组件的显示内容由静态图像切换为帧动画的序列帧图像;帧动画的序列帧图像在动态视图组件上逐帧渲染并显示。The display content of the dynamic view component is switched from a static image to a sequence of frame images of a frame animation; the sequence of frame images of the frame animation is rendered and displayed frame by frame on the dynamic view component.
第四方面,本申请提供了一种帧动画处理装置,该帧动画处理装置包括:In a fourth aspect, the present application provides a frame animation processing device, the frame animation processing device comprising:
第二预设模块,用于将静态视图组件的显示内容设为静态图像;A second preset module, used to set the display content of the static view component to a static image;
第三预设模块,用于将动态视图组件的显示内容设为帧动画的第一帧图像;动态视图组件运行在非主线程中;A third preset module is used to set the display content of the dynamic view component to the first frame image of the frame animation; the dynamic view component runs in a non-main thread;
第二切换模块,用于接收到播放帧动画的触发事件时,将静态视图组件的显示状态由可见状态切换为隐藏状态,将动态视图组件的显示状态由隐藏状态切换为可见状态;The second switching module is used to switch the display state of the static view component from the visible state to the hidden state, and switch the display state of the dynamic view component from the hidden state to the visible state when receiving the trigger event of playing the frame animation;
第三切换模块,用于将动态视图组件的显示内容由帧动画的第一帧图像切换为帧动画的其余序列帧图像。The third switching module is used to switch the display content of the dynamic view component from the first frame image of the frame animation to the remaining sequence frame images of the frame animation.
一种可能的实现方式中,第三预设模块具体用于:In a possible implementation, the third preset module is specifically used to:
获取帧动画的第一帧图像;Get the first frame image of the frame animation;
在动态视图组件中的渲染单元初始化完成后,将动态视图组件的显示内容设为帧动画的第一帧图像,并将动态视图组件的显示状态设为隐藏状态。After the rendering unit in the dynamic view component is initialized, the display content of the dynamic view component is set to the first frame image of the frame animation, and the display state of the dynamic view component is set to the hidden state.
一种可能的实现方式中,该装置还包括初始化模块,用于:In a possible implementation, the device further includes an initialization module, which is used to:
创建动态视图组件;Create dynamic view components;
将动态视图组件的的显示状态设为可见状态,以创建并初始化动态视图组件中的渲染单元。Set the display state of the dynamic view component to visible to create and initialize the rendering unit in the dynamic view component.
一种可能的实现方式中,第三切换模块,具体用于:In a possible implementation, the third switching module is specifically configured to:
通过动态视图组件遍历并解析帧动画的其余序列帧图像;Traverse and parse the remaining sequence frame images of the frame animation through the dynamic view component;
将动态视图组件的显示内容由帧动画的第一帧图像切换为帧动画的其余序列帧图像;帧动画的其余序列帧图像在动态视图组件上逐帧渲染并显示。The display content of the dynamic view component is switched from the first frame image of the frame animation to the remaining sequence frame images of the frame animation; the remaining sequence frame images of the frame animation are rendered and displayed frame by frame on the dynamic view component.
第五方面,本申请提供了一种电子设备,包括存储器和处理器。该存储器用于存储可执行程序代码,该处理器用于从存储器中调用并运行该可执行程序代码,使得该电子设备执行上述第一方面或第一方面任意一种可能的实现方式,或第二方面或第二方面任意一种可能的实现方式中的方法。 In a fifth aspect, the present application provides an electronic device, comprising a memory and a processor. The memory is used to store executable program code, and the processor is used to call and run the executable program code from the memory, so that the electronic device executes the method in the first aspect or any possible implementation of the first aspect, or the second aspect or any possible implementation of the second aspect.
第六方面,本申请提供了一种计算机程序产品,该计算机程序产品包括:计算机程序代码,当该计算机程序代码在计算机上运行时,使得该计算机执行上述第一方面或第一方面任意一种可能的实现方式,或第二方面或第二方面任意一种可能的实现方式中的方法。In a sixth aspect, the present application provides a computer program product, comprising: a computer program code, which, when executed on a computer, enables the computer to execute the method in the first aspect or any possible implementation of the first aspect, or the second aspect or any possible implementation of the second aspect.
第七方面,本申请提供了一种计算机可读存储介质,该计算机可读存储介质存储有计算机程序代码,当该计算机程序代码在计算机上运行时,使得该计算机执行上述第一方面或第一方面任意一种可能的实现方式,或第二方面或第二方面任意一种可能的实现方式中的方法。In the seventh aspect, the present application provides a computer-readable storage medium, which stores a computer program code. When the computer program code runs on a computer, the computer executes the method in the above-mentioned first aspect or any possible implementation of the first aspect, or the second aspect or any possible implementation of the second aspect.
综上,在本申请实施例中,将动态视图组件的显示内容设为静态图像或帧动画的第一帧图像;动态视图组件运行在非主线程中;接收到播放帧动画的触发事件时,将动态视图组件的显示内容由静态图像切换为帧动画的序列帧图像或由上述帧动画的第一帧图像切换为上述帧动画的其余序列帧图像。该方法能够平滑地实现从静态图像到帧动画的切换,避免了切换过程中出现卡顿或闪烁的问题,且动态视图组件运行在非主线程中能够减轻主线程的负担,提高了响应速度和流畅度,避免帧动画播放卡顿,提高了用户体验。In summary, in the embodiment of the present application, the display content of the dynamic view component is set to a static image or the first frame image of a frame animation; the dynamic view component runs in a non-main thread; when a trigger event for playing a frame animation is received, the display content of the dynamic view component is switched from a static image to a sequence frame image of a frame animation or from the first frame image of the frame animation to the remaining sequence frame images of the frame animation. This method can smoothly implement the switch from a static image to a frame animation, avoiding the problem of freeze or flicker during the switching process, and the dynamic view component running in a non-main thread can reduce the burden of the main thread, improve the response speed and fluency, avoid freezes in the frame animation playback, and improve the user experience.
图1是本申请实施例提供的一种视图组件由静态图像切换至帧动画的示意性变化图;FIG1 is a schematic diagram showing a change in a view component from a static image to a frame animation provided by an embodiment of the present application;
图2是本申请实施例提供的一种帧动画处理方法的示意性流程图;FIG2 is a schematic flow chart of a frame animation processing method provided in an embodiment of the present application;
图3是本申请实施例提供的另一种帧动画处理方法的示意性流程图;FIG3 is a schematic flow chart of another frame animation processing method provided in an embodiment of the present application;
图4是本申请实施例提供的另一种视图组件由静态图像切换至帧动画的示意性变化图;FIG4 is a schematic diagram showing another change in which a view component is switched from a static image to a frame animation provided by an embodiment of the present application;
图5是本申请实施例提供的又一种帧动画处理方法的示意性流程图;FIG5 is a schematic flow chart of another frame animation processing method provided in an embodiment of the present application;
图6是本申请实施例提供的一种视图组件的创建过程的示意性变化图;FIG6 is a schematic diagram showing a process of creating a view component according to an embodiment of the present application;
图7是本申请实施例提供的另一种视图组件的切换过程的示意性变化图;FIG. 7 is a schematic diagram showing another switching process of a view component provided in an embodiment of the present application;
图8是本申请实施例提供的一种帧动画处理装置的结构示意图;FIG8 is a schematic diagram of the structure of a frame animation processing device provided in an embodiment of the present application;
图9是本申请实施例提供的另一种帧动画处理装置的结构示意图;FIG9 is a schematic diagram of the structure of another frame animation processing device provided in an embodiment of the present application;
图10是本申请实施例提供的一种电子设备的结构示意图。 FIG. 10 is a schematic diagram of the structure of an electronic device provided in an embodiment of the present application.
本申请实施例提供了一种帧动画处理方法。该帧动画处理方法可依赖于计算机程序实现,可运行于基于冯诺依曼体系的帧动画处理装置或系统上。该计算机程序可集成在应用中,也可作为独立的工具类应用运行。该帧动画处理装置可以是电子设备,包括但不限于:个人电脑、平板电脑、手持设备、车载设备、可穿戴设备、计算设备或连接到无线调制解调器的其它处理设备等。The embodiment of the present application provides a frame animation processing method. The frame animation processing method can be implemented by a computer program and can be run on a frame animation processing device or system based on the von Neumann system. The computer program can be integrated into an application or run as an independent tool application. The frame animation processing device can be an electronic device, including but not limited to: a personal computer, a tablet computer, a handheld device, a vehicle-mounted device, a wearable device, a computing device, or other processing devices connected to a wireless modem.
在Android平台进行应用程序开发或使用过程中,有很多场景一开始展示一张静态图像,然后在某个时机需要播放一段帧动画,而由于帧动画在播放过程中需要遍历解析大量的图片资源,如果用普通的View(Android中可视化UI组件的实体)在主线程(UI线程)去绘制帧动画,可能出现卡顿的现象。因此可以采用非主线程视图组件播放帧动画,例如使用TextureView播放帧动画。其中,TextureView是Android中一种特殊的视图组件,用于异步渲染表面,可以在非主线程中渲染绘制帧动画,不占用主线程,从而能够避免帧动画卡顿的现象。When developing or using applications on the Android platform, there are many scenarios where a static image is displayed at the beginning, and then a frame animation needs to be played at a certain time. Since the frame animation needs to traverse and parse a large number of image resources during playback, if a normal View (the entity of the visual UI component in Android) is used to draw the frame animation in the main thread (UI thread), it may be stuck. Therefore, you can use a non-main thread view component to play the frame animation, such as using TextureView to play the frame animation. Among them, TextureView is a special view component in Android, which is used for asynchronous rendering of surfaces. It can render and draw frame animations in non-main threads without occupying the main thread, thereby avoiding the phenomenon of frame animation stuck.
如图1所示,在一些实施例中,静态图像111可以使用普通的View进行呈现(也就是图1中的静态视图110),帧动画121可以使用TextureView进行播放(也就是图1中的动态视图120),在进行静态图像111到帧动画121的切换时,可以通过隐藏静态视图110和显示动态视图120来实现。由于显示动态视图120后,动态视图120解析帧动画图像等步骤还需要一定的时间,不能及时绘制显示内容,导致显示内容是空的。因此在隐藏了静态视图110后,立也就是展示出的动态视图120是没有显示内容的,然后才开始播放的帧动画121的第一帧图像,导致用户视觉上会看到闪烁。As shown in FIG. 1 , in some embodiments, a static image 111 can be presented using a normal View (i.e., the static view 110 in FIG. 1 ), and a frame animation 121 can be played using a TextureView (i.e., the dynamic view 120 in FIG. 1 ). When switching from a static image 111 to a frame animation 121, it can be achieved by hiding the static view 110 and displaying the dynamic view 120. After the dynamic view 120 is displayed, it takes a certain amount of time for the dynamic view 120 to parse the frame animation image and other steps, and the display content cannot be drawn in time, resulting in empty display content. Therefore, after the static view 110 is hidden, the dynamic view 120 that is displayed immediately has no display content, and then the first frame image of the frame animation 121 is played, causing the user to visually see flickering.
为此,本申请实施例提供了一种帧动画处理方法,该帧动画处理方法能够进一步避免静态图像切换至帧动画时出现卡顿或闪烁的问题。示例性的,图2为本申请实施例提供的一种帧动画处理方法的示意性流程图,该方法可以由电子设备执行。如图2所示,该方法包括:To this end, an embodiment of the present application provides a frame animation processing method, which can further avoid the problem of freezing or flickering when a static image switches to a frame animation. For example, FIG2 is a schematic flow chart of a frame animation processing method provided by an embodiment of the present application, and the method can be executed by an electronic device. As shown in FIG2, the method includes:
S201,将动态视图组件的显示内容设为目标图像。S201, setting the display content of the dynamic view component as the target image.
具体的,该动态视图组件是指本申请实施例中用于播放帧动画的视图组 件,是运行在非主线程上的视图组件,例如Android中的TextureView,其可以用于渲染和显示复杂的图形内容,如展现图像或播放帧动画等。由于动态视图组件运行在非主线程(UI线程)上,所以使用该动态视图组件进行帧动画的播放并不会干扰主线程的运行,有助于提高应用的流畅性。Specifically, the dynamic view component refers to a view group for playing frame animation in the embodiment of the present application. A dynamic view component is a view component that runs on a non-main thread, such as TextureView in Android, which can be used to render and display complex graphic content, such as displaying images or playing frame animations. Since the dynamic view component runs on a non-main thread (UI thread), using the dynamic view component to play frame animations does not interfere with the operation of the main thread, which helps improve the fluency of the application.
其中,目标图像可以为静态图像或帧动画的第一帧图像。The target image may be a static image or the first frame image of a frame animation.
在将动态视图组件的显示内容设为静态图像时,静态图像是由动态视图组件进行显示的,也就是静态图像和帧动画使用同一视图组件进行显示。When the display content of a dynamic view component is set to a static image, the static image is displayed by the dynamic view component, that is, the static image and the frame animation are displayed using the same view component.
在将动态视图组件的显示内容设为帧动画的第一帧图像时,静态图像可以由静态视图组件(其他视图组件)进行显示,也就是静态图像和帧动画使用不同视图组件进行显示。When the display content of the dynamic view component is set to the first frame image of the frame animation, the static image can be displayed by the static view component (other view component), that is, the static image and the frame animation are displayed using different view components.
需要注意的是,在本申请实施例中,动态视图组件的显示内容需要在播放帧动画之前进行设置,使得动态视图组件预先加载显示一张图像,避免在需要播放帧动画时显示空白图像。It should be noted that in the embodiment of the present application, the display content of the dynamic view component needs to be set before playing the frame animation, so that the dynamic view component pre-loads and displays an image to avoid displaying a blank image when the frame animation needs to be played.
S202,接收到播放帧动画的触发事件时,将动态视图组件的显示内容由目标图像切换为帧动画的序列帧图像。S202: When a trigger event for playing a frame animation is received, the display content of the dynamic view component is switched from a target image to a sequence of frame images of the frame animation.
具体的,在接收到播放帧动画的触发事件时,开始进行静态图像到帧动画的切换。触发事件可以是某种信号或命令,例如可以来自用户的交互操作(如点击按钮)、程序的某个逻辑判断、系统的通知等。触发事件用于通知系统将静态视图切换至帧动画的时机,以使动态视图组件开始播放帧动画。Specifically, when a trigger event for playing frame animation is received, the static image is switched to the frame animation. The trigger event can be a signal or command, such as an interactive operation of the user (such as clicking a button), a logical judgment of the program, a notification of the system, etc. The trigger event is used to notify the system of the timing to switch the static view to the frame animation, so that the dynamic view component starts playing the frame animation.
在本申请实施例中,只有用户界面展示静态图像后,系统才能接收到播放帧动画的触发事件。例如,在车况监控或仪表盘应用中,当系统检测到车辆某一部分需要检查或维修时,首先展示的是该部分的静态图像,当静态图像出现后,用户才可以点击该静态图像(触发事件),以触发展示一个更详细的帧动画,解释问题的具体情况。In the embodiment of the present application, the system can receive a trigger event for playing a frame animation only after the user interface displays a static image. For example, in a vehicle condition monitoring or dashboard application, when the system detects that a certain part of the vehicle needs to be inspected or repaired, the static image of the part is displayed first. After the static image appears, the user can click on the static image (trigger event) to trigger the display of a more detailed frame animation to explain the specific situation of the problem.
当动态视图组件显示的目标图像为静态图像时,从静态图像切换到帧动画的整个过程均在同一个视图组件(动态视图组件)内部进行,不需要在两个不同的视图组件之间切换,切换过渡会非常平滑,用户在观察时不会感觉到任何的不连贯或闪烁,增强了整体的视觉体验。When the target image displayed by the dynamic view component is a static image, the entire process of switching from the static image to the frame animation is carried out within the same view component (dynamic view component). There is no need to switch between two different view components. The switching transition will be very smooth, and the user will not feel any incoherence or flickering when observing, which enhances the overall visual experience.
当动态视图组件显示的目标图像为帧动画的第一帧图像时,静态图像由静态视图组件进行显示,从静态图像切换到帧动画时,需要在不同的视图组 件之间切换,也就是需要隐藏静态视图组件并显示动态视图组件。由于动态视图组件在切换过程执行前预先显示了帧动画的第一帧图像,即使动态视图组件进行初始化或解析渲染帧动画的时间较长,动态视图组件也不会展示空白内容。因此从静态视图组件切换到动态视图组件时可以直接看到帧动画的第一帧图像,然后继续逐帧播放帧动画的序列帧图像,用户在观察时不会感觉到任何的不连贯或闪烁,增强了整体的视觉体验。When the target image displayed by the dynamic view component is the first frame of the frame animation, the static image is displayed by the static view component. When switching from the static image to the frame animation, it is necessary to Switching between components requires hiding the static view component and displaying the dynamic view component. Since the dynamic view component displays the first frame of the frame animation before the switching process is executed, the dynamic view component will not display blank content even if the dynamic view component takes a long time to initialize or parse and render the frame animation. Therefore, when switching from the static view component to the dynamic view component, you can directly see the first frame of the frame animation, and then continue to play the sequence of frame images of the frame animation frame by frame. Users will not feel any discontinuity or flickering when observing, which enhances the overall visual experience.
其中,帧动画的序列帧图像也就是用于构成动画的一系列帧图像(静态的图像),这些帧图像按照特定的顺序和速率逐一展示,从而体现出动画效果。Among them, the sequence frame images of the frame animation are a series of frame images (static images) used to constitute the animation. These frame images are displayed one by one in a specific order and rate, thereby reflecting the animation effect.
在本申请实施例中,将动态视图组件的显示内容设为目标图像;动态视图组件运行在非主线程中,目标图像为静态图像或帧动画的第一帧图像;接收到播放帧动画的触发事件时,进行静态图像到帧动画的切换,将动态视图组件的显示内容由目标图像切换为逐帧显示的帧动画的序列帧图像。该方法能够平滑地实现从静态图像到帧动画的切换,避免了切换过程中出现卡顿或闪烁的问题,且动态视图组件运行在非主线程中能够减轻主线程的负担,提高了响应速度和流畅度,避免帧动画播放卡顿,提高了用户体验。In the embodiment of the present application, the display content of the dynamic view component is set to the target image; the dynamic view component runs in a non-main thread, and the target image is a static image or the first frame image of a frame animation; when a trigger event for playing a frame animation is received, the static image is switched to the frame animation, and the display content of the dynamic view component is switched from the target image to a sequence of frame images of the frame animation displayed frame by frame. This method can smoothly implement the switch from a static image to a frame animation, avoiding the problem of freeze or flicker during the switching process, and the dynamic view component running in a non-main thread can reduce the burden of the main thread, improve the response speed and fluency, avoid freezes in the frame animation playback, and improve the user experience.
示例性的,图3为本申请实施例提供的另一种帧动画处理方法的示意性流程图,该方法可以由电子设备执行。如图3所示,该方法包括:For example, FIG3 is a schematic flow chart of another frame animation processing method provided in an embodiment of the present application, which can be executed by an electronic device. As shown in FIG3 , the method includes:
S301,将动态视图组件的显示内容设为静态图像。S301, setting the display content of the dynamic view component to a static image.
具体的,该动态视图组件是指本申请实施例中用于播放帧动画的视图组件,是运行在非主线程上的视图组件,例如Android中的TextureView。在本申请实施例中,在需要展示静态图像时,可以直接将动态视图组件的显示内容设为静态图像,在需要展示帧动画时再进行显示内容的替换,使静态图像和帧动画采用相同的视图组件进行显示。Specifically, the dynamic view component refers to the view component used to play the frame animation in the embodiment of the present application, and is a view component running on a non-main thread, such as TextureView in Android. In the embodiment of the present application, when a static image needs to be displayed, the display content of the dynamic view component can be directly set to a static image, and when a frame animation needs to be displayed, the display content can be replaced, so that the static image and the frame animation are displayed using the same view component.
需要注意的是,在本申请实施例中,帧动画是在静态图像展示之后进行播放的,因此需要在播放帧动画之前将静态图像设置为动态视图组件的显示内容,以满足应用场景中展示静态图像的需求。具体的,可以在用户界面首次展示出来时,创建动态视图组件并设置显示内容,该用户界面也就是用来展示静态图像和帧动画的界面。It should be noted that in the embodiment of the present application, the frame animation is played after the static image is displayed, so it is necessary to set the static image as the display content of the dynamic view component before playing the frame animation to meet the demand for displaying static images in the application scenario. Specifically, the dynamic view component can be created and the display content can be set when the user interface is first displayed, and the user interface is used to display static images and frame animations.
S302,接收到播放帧动画的触发事件时,将动态视图组件的显示内容由 静态图像切换为帧动画的序列帧图像。S302, when receiving a trigger event for playing a frame animation, the display content of the dynamic view component is changed from The static image switches to a sequence of frame images of frame animation.
具体的,在系统接收到播放帧动画的触发事件时,开始进行静态图像到帧动画的切换。动态视图组件遍历并解析帧动画的序列帧图像,然后将动态视图组件的显示内容由静态图像切换为帧动画的序列帧图像,该帧动画的序列帧图像可以在动态视图组件上逐帧渲染并显示。Specifically, when the system receives a trigger event for playing a frame animation, it starts switching from a static image to a frame animation. The dynamic view component traverses and parses the sequence frame images of the frame animation, and then switches the display content of the dynamic view component from a static image to the sequence frame images of the frame animation, which can be rendered and displayed frame by frame on the dynamic view component.
示例性的,如图4所示,静态图像411的展示和帧动画412的播放通过一个TextureView(也就是图4中的动态视图组件410)来呈现。在需要展示静态图像411时,将一张静态图像411放入TextureView中,设置为显示内容。在需要切换成帧动画412时,就遍历并解析帧动画412的序列帧图像,渲染帧动画412的第一帧图像并替换TextureView中的静态图像411进行显示,此后依次逐帧渲染并显示帧动画412的序列帧图像,例如渲染帧动画412的第二帧图像并替换TextureView中的第一帧图像进行显示,渲染帧动画412的第三帧图像并替换TextureView中的第二帧图像进行显示……这样就保证了从静态图像切换到帧动画的过程中,TextureView中一直都有图像内容,从而在TextureView中的显示内容被替换的过程,避免了从静态图像切换到帧动画的过程中出现闪烁的问题。Exemplarily, as shown in FIG4 , the display of a static image 411 and the playback of a frame animation 412 are presented through a TextureView (i.e., the dynamic view component 410 in FIG4 ). When it is necessary to display a static image 411, a static image 411 is placed in the TextureView and set as the display content. When it is necessary to switch to the frame animation 412, the sequence frame images of the frame animation 412 are traversed and parsed, the first frame image of the frame animation 412 is rendered and replaced with the static image 411 in the TextureView for display, and then the sequence frame images of the frame animation 412 are rendered and displayed frame by frame, for example, the second frame image of the frame animation 412 is rendered and replaced with the first frame image in the TextureView for display, the third frame image of the frame animation 412 is rendered and replaced with the second frame image in the TextureView for display... In this way, it is ensured that in the process of switching from a static image to a frame animation, there is always image content in the TextureView, so that in the process of replacing the display content in the TextureView, the flickering problem in the process of switching from a static image to a frame animation is avoided.
需要注意的是,TextureView在Android中是通过SurfaceTexture来渲染并显示内容的,SurfaceTexture可以视为TextureView组件内部的一个子组件(渲染单元)。具体的,SurfaceTexture是一个包含纹理的表面,可以被用来渲染由OpenGL ES和其他硬件加速APIs生成的图像,而TextureView则提供了一个用于在常规视图层级中显示这样的内容的方式。在常规使用场景下,可以将内容(例如视频流或者3D图形)渲染到SurfaceTexture上,然后通过关联的TextureView将其显示在应用程序界面中。It should be noted that TextureView in Android uses SurfaceTexture to render and display content. SurfaceTexture can be regarded as a subcomponent (rendering unit) inside the TextureView component. Specifically, SurfaceTexture is a surface containing textures that can be used to render images generated by OpenGL ES and other hardware acceleration APIs, while TextureView provides a way to display such content in a regular view hierarchy. In regular usage scenarios, content (such as video streams or 3D graphics) can be rendered to SurfaceTexture and then displayed in the application interface through the associated TextureView.
在本申请实施例中,将动态视图组件的显示内容设为静态图像;动态视图组件运行在非主线程中;接收到播放帧动画的触发事件时,进行静态图像到帧动画的切换,将动态视图组件的显示内容由静态图像切换为帧动画的序列帧图像。该方法静态图像和帧动画使用同一个动态视图组件显示,能够平滑地实现从静态图像到帧动画的切换,避免了切换过程中出现卡顿或闪烁的问题,且动态视图组件运行在非主线程中能够减轻主线程的负担,提高了响应速度和流畅度的同时,还提高了用户体验。 In an embodiment of the present application, the display content of the dynamic view component is set to a static image; the dynamic view component runs in a non-main thread; when a trigger event for playing a frame animation is received, a switch is performed from the static image to the frame animation, and the display content of the dynamic view component is switched from the static image to a sequence of frame images of the frame animation. This method uses the same dynamic view component to display static images and frame animations, and can smoothly switch from static images to frame animations, avoiding problems such as freezes or flickers during the switching process. The dynamic view component runs in a non-main thread, which can reduce the burden on the main thread, improve the response speed and fluency, and improve the user experience.
示例性的,图5为本申请实施例提供的又一种帧动画处理方法的示意性流程图,该方法可以由电子设备执行。如图5所示,该方法包括:For example, FIG5 is a schematic flow chart of another frame animation processing method provided in an embodiment of the present application, and the method can be executed by an electronic device. As shown in FIG5, the method includes:
S501,将静态视图组件的显示内容设为静态图像。S501, setting the display content of the static view component to a static image.
具体的,静态视图组件用于展示一个固定的图像内容,其显示内容可设为需要进行展示的静态图像,静态视图组件可以使用普通的视图组件,如ImageView。Specifically, the static view component is used to display a fixed image content, and its display content can be set to a static image that needs to be displayed. The static view component can use a common view component, such as ImageView.
在本申请实施例中,帧动画是在静态图像展示之后进行播放的,因此需要在播放帧动画之前将静态图像设置为静态视图组件的显示内容,以满足应用场景中展示静态图像的需求。具体的,可以在用户界面首次展示时,创建静态视图组件并设置显示内容,该用户界面也就是用来展示静态图像和帧动画的界面。In the embodiment of the present application, the frame animation is played after the static image is displayed, so it is necessary to set the static image as the display content of the static view component before playing the frame animation to meet the demand for displaying static images in the application scenario. Specifically, the static view component can be created and the display content can be set when the user interface is first displayed. The user interface is also an interface for displaying static images and frame animations.
S502,将动态视图组件的显示内容设为帧动画的第一帧图像。S502: Set the display content of the dynamic view component to the first frame image of the frame animation.
具体的,动态视图组件用于播放帧动画,可以用来展示一系列的序列帧图像,形成动画效果,通过逐帧渲染的方式,动态视图组件能够实现丰富的视觉效果。动态视图组件可以使用在非主线程中运行的视图组件,如TextureView。Specifically, the dynamic view component is used to play frame animations, which can be used to display a series of sequence frame images to form animation effects. By rendering frame by frame, the dynamic view component can achieve rich visual effects. The dynamic view component can use view components running in non-main threads, such as TextureView.
在本申请实施例中,需要在动态视图组件播放帧动画之前将帧动画的第一帧图像设置为动态视图组件的显示内容,使得动态视图组件预先加载显示帧动画的第一帧图像,在需要播放帧动画时不会显示空白图像。具体的,由于在用户界面展示静态图像后,系统才能接收到播放帧动画的触发事件,所以可以在将静态视图组件的显示内容设为静态图像时,同时将动态视图组件的显示内容设为帧动画的第一帧图像,以避免出现接收到播放帧动画的触发事件时,动态视图组件的显示内容尚未设置的情况。In the embodiment of the present application, it is necessary to set the first frame image of the frame animation as the display content of the dynamic view component before the dynamic view component plays the frame animation, so that the dynamic view component pre-loads the first frame image of the frame animation, and does not display a blank image when the frame animation needs to be played. Specifically, since the system can receive the trigger event of playing the frame animation only after the static image is displayed in the user interface, the display content of the static view component can be set to the static image while the display content of the dynamic view component is set to the first frame image of the frame animation, so as to avoid the situation where the display content of the dynamic view component has not been set when the trigger event of playing the frame animation is received.
例如,应用启动后进入用户界面,在该用户界面创建静态视图组件,并将指定静态图像设置为静态视图组件的显示内容;同时,在该用户界面创建动态视图组件,并将帧动画的第一帧图像设置为动态视图组件的显示内容。For example, after the application is started, it enters the user interface, creates a static view component in the user interface, and sets the specified static image as the display content of the static view component; at the same time, creates a dynamic view component in the user interface, and sets the first frame image of the frame animation as the display content of the dynamic view component.
需要注意的是,虽然描述将这两种视图组件区分为“静态”和“动态”,但这是本申请实施例从功能和用途的角度来自定义的。在实际具体操作中,许多视图组件都可以具备展示静态内容和/或动态内容的能力,选择使用哪种组件可能取决于具体需求。在本申请实施例中,视图组件的命名仅便于描述 和区分,并不是进行具体限定。It should be noted that although the description distinguishes these two view components as "static" and "dynamic", this is self-defined in the embodiment of the present application from the perspective of function and use. In actual specific operations, many view components can have the ability to display static content and/or dynamic content, and the choice of which component to use may depend on specific needs. In the embodiment of the present application, the naming of the view components is only for the convenience of description. and distinction, not specific limitation.
在一些实施例中,将动态视图组件的显示内容设为帧动画的第一帧图像,包括:获取帧动画的第一帧图像;在动态视图组件中的渲染单元初始化完成后,将动态视图组件的显示内容设为帧动画的第一帧图像,并将动态视图组件的显示状态设为隐藏状态。In some embodiments, setting the display content of the dynamic view component to the first frame image of the frame animation includes: obtaining the first frame image of the frame animation; after the rendering unit in the dynamic view component is initialized, setting the display content of the dynamic view component to the first frame image of the frame animation, and setting the display state of the dynamic view component to the hidden state.
具体的,在动态视图组件创建后,其显示内容是空白的,在动态视图组件未播放帧动画时,设置一个初始显示图像,这样在从静态视图组件切换至动态视图组件显示的过程中,动态视图组件不会显示空白内容,可以避免出现闪烁现象。该初始显示图像设置为帧动画的第一帧图像,由此在播放帧动画时从该初始显示图像替换成帧动画的其他序列帧图像,避免产生不连贯感和跳跃感的问题。Specifically, after the dynamic view component is created, its display content is blank. When the dynamic view component does not play the frame animation, an initial display image is set, so that when switching from the static view component to the dynamic view component, the dynamic view component will not display blank content, which can avoid flickering. The initial display image is set to the first frame image of the frame animation, so that when playing the frame animation, the initial display image is replaced with other sequence frame images of the frame animation to avoid the problem of incoherence and jumping.
若想在动态视图组件上预先设置帧动画的第一帧图像进行显示,需要对动态视图组件中的渲染单元进行创建并初始化,因为只有该渲染单元初始化完成后,才能对图像进行渲染,以实现将图像放在动态视图组件上显示。If you want to pre-set the first frame image of the frame animation for display on the dynamic view component, you need to create and initialize the rendering unit in the dynamic view component, because only after the rendering unit is initialized can the image be rendered to display the image on the dynamic view component.
在一些实施例中,将动态视图组件的显示内容设为帧动画的第一帧图像之前,包括:创建动态视图组件;将动态视图组件的的显示状态设为可见状态,以创建并初始化动态视图组件中的渲染单元。In some embodiments, before setting the display content of the dynamic view component to the first frame image of the frame animation, it includes: creating a dynamic view component; setting the display state of the dynamic view component to a visible state to create and initialize a rendering unit in the dynamic view component.
具体的,在创建动态视图组件后,动态视图组件中的渲染单元并不一定会立即被创建并进行初始化,只有该动态视图组件的显示状态设为可见状态后,才会触发渲染单元的创建和初始化进程。Specifically, after a dynamic view component is created, the rendering unit in the dynamic view component is not necessarily created and initialized immediately. Only when the display state of the dynamic view component is set to a visible state will the creation and initialization process of the rendering unit be triggered.
示例性的,在Android中,View的可见性属性可以通过setVisibility(int visibility)方法来设置,可以使用以下三个常量之一来表示:For example, in Android, the visibility property of a View can be set using the setVisibility(int visibility) method, which can be represented by one of the following three constants:
View.VISIBLE:视图可见。View.VISIBLE: The view is visible.
View.INVISIBLE:视图不可见(隐藏),但仍然占据布局中的空间。View.INVISIBLE: The view is not visible (hidden), but still occupies space in the layout.
View.GONE:视图不可见(隐藏),并且不占据布局中的空间。View.GONE: The view is not visible (hidden) and does not occupy space in the layout.
动态视图组件以TextureView为例,TextureView的内容是渲染到一个SurfaceTexture(渲染单元)上的,只有当TextureView是可见的(也就是视图的可见性属性为View.VISIBLE)时,SurfaceTexture才会被创建并初始化,因此即使不需要显示动态视图组件中的内容,也应将动态视图组件设为可见状态。 Taking TextureView as an example, the content of TextureView is rendered to a SurfaceTexture (rendering unit). SurfaceTexture will be created and initialized only when TextureView is visible (that is, the visibility property of the view is View.VISIBLE). Therefore, even if the content in the dynamic view component does not need to be displayed, the dynamic view component should be set to a visible state.
需要说明的是,在静态视图组件和动态视图组件均设为可见状态时,由于动态视图组件(例如TextureView)初始状态没有显示内容(未渲染任何图像到其SurfaceTexture上),那么它可能会完全透明,因此即使是“可见”状态也不会遮挡或干扰静态视图组件的显示。另外,在一些实施例中,还可以通过层次管理或透明度管理等方式,通过控制静态视图组件和动态视图组件的层次结构或透明度属性,来避免静态视图组件和动态视图组件的显示内容相互干扰的问题。It should be noted that when both the static view component and the dynamic view component are set to visible state, since the dynamic view component (such as TextureView) does not display content in the initial state (no image is rendered to its SurfaceTexture), it may be completely transparent, so even in the "visible" state it will not block or interfere with the display of the static view component. In addition, in some embodiments, the problem of interference between the display contents of the static view component and the dynamic view component can be avoided by controlling the hierarchy or transparency properties of the static view component and the dynamic view component through hierarchy management or transparency management.
在接收到播放帧动画的触发事件之前,系统需要显示静态图像,而不需要播放帧动画,在将动态视图组件的显示内容设为帧动画的第一帧图像时,需要将动态视图组件的显示状态设为隐藏状态,以避免干扰静态视图组件展示静态图像。Before receiving the trigger event for playing a frame animation, the system needs to display a static image without playing the frame animation. When setting the display content of the dynamic view component to the first frame image of the frame animation, the display state of the dynamic view component needs to be set to a hidden state to avoid interfering with the static view component in displaying the static image.
示例性的,如图6所示,在界面展示,静态视图组件610被创建放入静态图像611,然后设为可见状态。动态视图组件620(TextureView)与静态视图组件610同时被创建,但是TextureView的内容需要渲染到SurfaceTexture(渲染单元)上。而SurfaceTexture的初始化是一个耗时过程,只有当TextureView是可见状态时,SurfaceTexture才会被创建并初始化。在SurfaceTexture初始化完成后,Android系统会通过onSurfaceTextureAvailable回调来通知开发者SurfaceTexture已准备就绪。因此尽管一开始可能不需要显示动态视图组件620,但为了确保帧动画的顺利播放,依然需要将TextureView设为可见,等待系统反馈onSurfaceTextureAvailable的通知,然后将帧动画的第一帧图像621设置到TextureView中,然后在设置帧动画的第一帧图片621后将TextureView隐藏。Exemplarily, as shown in FIG6 , in the interface display, a static view component 610 is created and placed in a static image 611, and then set to a visible state. The dynamic view component 620 (TextureView) is created at the same time as the static view component 610, but the content of TextureView needs to be rendered to SurfaceTexture (rendering unit). The initialization of SurfaceTexture is a time-consuming process, and SurfaceTexture will only be created and initialized when TextureView is visible. After the SurfaceTexture is initialized, the Android system will notify the developer that SurfaceTexture is ready through the onSurfaceTextureAvailable callback. Therefore, although the dynamic view component 620 may not be displayed at the beginning, in order to ensure the smooth playback of the frame animation, it is still necessary to set TextureView to visible, wait for the system to feedback the onSurfaceTextureAvailable notification, and then set the first frame image 621 of the frame animation to TextureView, and then hide TextureView after setting the first frame image 621 of the frame animation.
S503,接收到播放帧动画的触发事件时,将静态视图组件的显示状态由可见状态切换为隐藏状态,将动态视图组件的显示状态由隐藏状态切换为可见状态。S503: When a trigger event for playing a frame animation is received, the display state of the static view component is switched from a visible state to a hidden state, and the display state of the dynamic view component is switched from a hidden state to a visible state.
具体的,如图7所示,系统接收到播放帧动画的触发事件时,表示现在界面需要从展示静态图像711切换到播放帧动画721;因此可以将静态视图组件710的显示状态由可见状态切换为隐藏状态,将动态视图组件720的显示状态由隐藏状态切换为可见状态,以实现展示静态视图组件710到展示动态视图组件720的切换。由于动态视图组件720在创建后已经预先加载了一 张帧动画721的第一帧图像,所以其显示内容非空白内容,在视图组件切换过程中,用户不会观察到闪烁的现象。Specifically, as shown in FIG7 , when the system receives a trigger event for playing frame animation, it indicates that the interface needs to switch from displaying static image 711 to playing frame animation 721; therefore, the display state of static view component 710 can be switched from visible state to hidden state, and the display state of dynamic view component 720 can be switched from hidden state to visible state, so as to realize the switch from displaying static view component 710 to displaying dynamic view component 720. Since dynamic view component 720 has been preloaded with a This is the first frame image of frame animation 721, so its displayed content is not blank content, and the user will not observe flickering during the view component switching process.
S504,将动态视图组件的显示内容由帧动画的第一帧图像切换为帧动画的其余序列帧图像。S504: Switch the display content of the dynamic view component from the first frame image of the frame animation to the remaining sequence frame images of the frame animation.
具体的,在接收到播放帧动画的触发事件时,动态视图组件的显示状态由隐藏状态切换为可见状态,动态视图组件开始遍历并解析帧动画的其余序列帧图像;将动态视图组件的显示内容由帧动画的第一帧图像切换为帧动画的其余序列帧图像。该帧动画的其余序列帧图像指除该帧动画的第一帧图像以外的所有序列帧图像,可以在动态视图组件上逐帧渲染并显示。Specifically, when a trigger event for playing a frame animation is received, the display state of the dynamic view component is switched from a hidden state to a visible state, and the dynamic view component begins to traverse and parse the remaining sequence frame images of the frame animation; the display content of the dynamic view component is switched from the first frame image of the frame animation to the remaining sequence frame images of the frame animation. The remaining sequence frame images of the frame animation refer to all sequence frame images except the first frame image of the frame animation, which can be rendered and displayed frame by frame on the dynamic view component.
其中,在系统接收到播放帧动画的触发事件,且动态视图组件的显示状态切换为可见状态时,表示现在需要播放帧动画,动态视图组件首先遍历并解析帧动画的序列帧图像。也就是读取帧动画的每一帧,并进行必要的解析,解析过程可能涉及格式转换、缩放或其他预处理步骤,以确保每一帧图像都能正确显示。When the system receives a trigger event for playing frame animation and the display state of the dynamic view component switches to the visible state, it means that the frame animation needs to be played now. The dynamic view component first traverses and parses the sequence frame images of the frame animation. That is, it reads each frame of the frame animation and performs necessary analysis. The analysis process may involve format conversion, scaling or other preprocessing steps to ensure that each frame image can be displayed correctly.
由于动态视图组件已将帧动画的第一帧图像设为初始的显示内容,可以只解析除第一帧之外的其余序列帧图像,然后再逐帧渲染帧动画的其余序列帧图像,并且按照特定的速率(例如30帧/秒)依次显示其余的帧。渲染过程可能涉及将每一帧图像从其原始格式转换为可以在屏幕上直接显示的格式的处理步骤,可以渲染一帧显示一帧,依次替换显示,直至该帧动画播放完毕。Since the dynamic view component has set the first frame image of the frame animation as the initial display content, only the remaining sequence frame images except the first frame can be parsed, and then the remaining sequence frame images of the frame animation are rendered frame by frame, and the remaining frames are displayed in sequence at a specific rate (for example, 30 frames per second). The rendering process may involve a processing step of converting each frame image from its original format to a format that can be directly displayed on the screen. One frame can be rendered and displayed, and the display can be replaced in sequence until the frame animation is played.
在本申请实施例中,将静态视图组件的显示内容设为静态图像;将动态视图组件的显示内容设为帧动画的第一帧图像;动态视图组件运行在非主线程中;接收到播放帧动画的触发事件时,将静态视图组件的显示状态由可见状态切换为隐藏状态,将动态视图组件的显示状态由隐藏状态切换为可见状态;将动态视图组件的显示内容由帧动画的第一帧图像切换为帧动画的其余序列帧图像。该方法由于动态视图组件在切换前就预先加载了帧动画的第一帧图像,从静态视图切换至动态视图组件显示的过程中不会出现空白内容,可以从显示帧动画的第一帧图像平滑过渡到显示其余序列帧图像,这种切换是连续和无缝的,避免了切换过程中出现卡顿或闪烁的问题,且动态视图组件运行在非主线程中能够减轻主线程的负担,提高了响应速度和流畅度的同 时,还提高了用户体验。In an embodiment of the present application, the display content of the static view component is set to a static image; the display content of the dynamic view component is set to the first frame image of the frame animation; the dynamic view component runs in a non-main thread; when a trigger event for playing a frame animation is received, the display state of the static view component is switched from a visible state to a hidden state, and the display state of the dynamic view component is switched from a hidden state to a visible state; the display content of the dynamic view component is switched from the first frame image of the frame animation to the remaining sequence frame images of the frame animation. Since the dynamic view component of this method pre-loads the first frame image of the frame animation before switching, no blank content will appear during the process of switching from the static view to the dynamic view component display, and a smooth transition can be made from displaying the first frame image of the frame animation to displaying the remaining sequence frame images. This switching is continuous and seamless, avoiding the problem of freezes or flickers during the switching process, and the dynamic view component running in a non-main thread can reduce the burden on the main thread, while improving the response speed and fluency. It also improves the user experience.
图8是本申请实施例提供的一种帧动画处理装置的结构示意图。FIG. 8 is a schematic diagram of the structure of a frame animation processing device provided in an embodiment of the present application.
示例性的,如图8所示,该帧动画处理装置800包括:Exemplarily, as shown in FIG8 , the frame animation processing device 800 includes:
第一预设模块810,用于将动态视图组件的显示内容设为静态图像;动态视图组件运行在非主线程中;The first preset module 810 is used to set the display content of the dynamic view component to a static image; the dynamic view component runs in a non-main thread;
第一切换模块820,用于接收到播放帧动画的触发事件时,将动态视图组件的显示内容由静态图像切换为帧动画的序列帧图像。The first switching module 820 is configured to switch the display content of the dynamic view component from a static image to a sequence of frame images of the frame animation upon receiving a trigger event for playing the frame animation.
一种可能的实现方式中,第一切换模块820具体用于:In a possible implementation, the first switching module 820 is specifically configured to:
通过动态视图组件遍历并解析帧动画的序列帧图像;Traverse and parse the sequence frame images of frame animation through dynamic view components;
将动态视图组件的显示内容由静态图像切换为帧动画的序列帧图像;帧动画的序列帧图像在动态视图组件上逐帧渲染并显示。The display content of the dynamic view component is switched from a static image to a sequence of frame images of a frame animation; the sequence of frame images of the frame animation is rendered and displayed frame by frame on the dynamic view component.
在本申请实施例中,将动态视图组件的显示内容设为静态图像;动态视图组件运行在非主线程中;接收到播放帧动画的触发事件时,进行静态图像到帧动画的切换,将动态视图组件的显示内容由静态图像切换为帧动画的序列帧图像。该方法静态图像和帧动画使用同一个动态视图组件显示,能够平滑地实现从静态图像到帧动画的切换,避免了切换过程中出现卡顿或闪烁的问题,且动态视图组件运行在非主线程中能够减轻主线程的负担,提高响应速度和流畅度,提高了用户体验。In the embodiment of the present application, the display content of the dynamic view component is set to a static image; the dynamic view component runs in a non-main thread; when a trigger event for playing a frame animation is received, the static image is switched to the frame animation, and the display content of the dynamic view component is switched from the static image to the sequence frame image of the frame animation. This method uses the same dynamic view component to display static images and frame animations, and can smoothly switch from static images to frame animations, avoiding the problem of freezing or flickering during the switching process. In addition, the dynamic view component running in a non-main thread can reduce the burden on the main thread, improve the response speed and fluency, and improve the user experience.
图9是本申请实施例提供的另一种帧动画处理装置的结构示意图。FIG. 9 is a schematic diagram of the structure of another frame animation processing device provided in an embodiment of the present application.
示例性的,如图9所示,该帧动画处理装置900包括:Exemplarily, as shown in FIG9 , the frame animation processing device 900 includes:
第二预设模块910,用于将静态视图组件的显示内容设为静态图像;A second preset module 910, configured to set the display content of the static view component to a static image;
第三预设模块920,用于将动态视图组件的显示内容设为帧动画的第一帧图像;动态视图组件运行在非主线程中;The third preset module 920 is used to set the display content of the dynamic view component to the first frame image of the frame animation; the dynamic view component runs in a non-main thread;
第二切换模块930,用于接收到播放帧动画的触发事件时,将静态视图组件的显示状态由可见状态切换为隐藏状态,将动态视图组件的显示状态由隐藏状态切换为可见状态;The second switching module 930 is used to switch the display state of the static view component from the visible state to the hidden state, and switch the display state of the dynamic view component from the hidden state to the visible state when receiving a trigger event of playing a frame animation;
第三切换模块940,用于将动态视图组件的显示内容由帧动画的第一帧图像切换为帧动画的其余序列帧图像。The third switching module 940 is used to switch the display content of the dynamic view component from the first frame image of the frame animation to the remaining sequence frame images of the frame animation.
一种可能的实现方式中,第三预设模块920具体用于:In a possible implementation, the third preset module 920 is specifically used to:
获取帧动画的第一帧图像; Get the first frame image of the frame animation;
在动态视图组件中的渲染单元初始化完成后,将动态视图组件的显示内容设为帧动画的第一帧图像;After the rendering unit in the dynamic view component is initialized, the display content of the dynamic view component is set to the first frame image of the frame animation;
将动态视图组件的显示状态设为隐藏状态。Sets the display state of a dynamic view component to the hidden state.
一种可能的实现方式中,该帧动画处理装置900还包括初始化模块,用于:In a possible implementation, the frame animation processing device 900 further includes an initialization module, which is used to:
创建动态视图组件;Create dynamic view components;
将动态视图组件的的显示状态设为可见状态,以创建并初始化动态视图组件中的渲染单元。Set the display state of the dynamic view component to visible to create and initialize the rendering unit in the dynamic view component.
一种可能的实现方式中,第三切换模块940,具体用于:In a possible implementation, the third switching module 940 is specifically configured to:
通过动态视图组件遍历并解析帧动画的其余序列帧图像;Traverse and parse the remaining sequence frame images of the frame animation through the dynamic view component;
将动态视图组件的显示内容由帧动画的第一帧图像切换为帧动画的其余序列帧图像;帧动画的其余序列帧图像在动态视图组件上逐帧渲染并显示。The display content of the dynamic view component is switched from the first frame image of the frame animation to the remaining sequence frame images of the frame animation; the remaining sequence frame images of the frame animation are rendered and displayed frame by frame on the dynamic view component.
在本申请实施例中,将静态视图组件的显示内容设为静态图像;将动态视图组件的显示内容设为帧动画的第一帧图像;动态视图组件运行在非主线程中;接收到播放帧动画的触发事件时,将静态视图组件的显示状态由可见状态切换为隐藏状态,将动态视图组件的显示状态由隐藏状态切换为可见状态;将动态视图组件的显示内容由帧动画的第一帧图像切换为帧动画的其余序列帧图像。该方法由于动态视图组件在切换前就预先加载了帧动画的第一帧图像,从静态视图切换至动态视图组件显示的过程中不会出现空白内容,可以从显示帧动画的第一帧图像平滑过渡到显示其余序列帧图像,这种切换是连续和无缝的,避免了切换过程中出现卡顿或闪烁的问题,且动态视图组件运行在非主线程中能够减轻主线程的负担,提高响应速度和流畅度,提高了用户体验。In an embodiment of the present application, the display content of the static view component is set to a static image; the display content of the dynamic view component is set to the first frame image of the frame animation; the dynamic view component runs in a non-main thread; when a trigger event for playing the frame animation is received, the display state of the static view component is switched from a visible state to a hidden state, and the display state of the dynamic view component is switched from a hidden state to a visible state; the display content of the dynamic view component is switched from the first frame image of the frame animation to the remaining sequence frame images of the frame animation. In this method, since the dynamic view component pre-loads the first frame image of the frame animation before switching, there will be no blank content in the process of switching from the static view to the dynamic view component display, and a smooth transition can be made from displaying the first frame image of the frame animation to displaying the remaining sequence frame images. This switching is continuous and seamless, avoiding the problem of freeze or flickering during the switching process, and the dynamic view component running in a non-main thread can reduce the burden of the main thread, improve the response speed and fluency, and improve the user experience.
图10是本申请实施例提供的一种电子设备的结构示意图。FIG. 10 is a schematic diagram of the structure of an electronic device provided in an embodiment of the present application.
示例性的,如图10所示,该电子设备1000包括:存储器1010和处理器1020,其中,存储器1010中存储有可执行程序代码1011,处理器1020用于调用并执行该可执行程序代码1011执行一种帧动画处理方法。Exemplarily, as shown in FIG. 10 , the electronic device 1000 includes: a memory 1010 and a processor 1020 , wherein the memory 1010 stores an executable program code 1011 , and the processor 1020 is used to call and execute the executable program code 1011 to perform a frame animation processing method.
本申请实施例可以根据上述方法示例对电子设备进行功能模块的划分,例如,可以对应各个功能模块,也可以将两个或两个以上的功能集成在一个处理模块中,上述集成的模块可以采用硬件的形式实现。需要说明的是,本 申请实施例中对模块的划分是示意性的,仅仅为一种逻辑功能划分,实际实现时可以有另外的划分方式。The embodiment of the present application can divide the electronic device into functional modules according to the above method example. For example, each functional module can be corresponding, or two or more functions can be integrated into one processing module. The above integrated module can be implemented in the form of hardware. The division of modules in the application embodiment is schematic and is only a logical function division. There may be other division methods in actual implementation.
在采用对应各个功能划分各个功能模块的情况下,该电子设备可以包括:预设模块和第一切换模块等。需要说明的是,上述方法实施例涉及的各个步骤的所有相关内容的可以援引到对应功能模块的功能描述,在此不再赘述。In the case of dividing each functional module according to each function, the electronic device may include: a preset module and a first switching module, etc. It should be noted that all relevant contents of each step involved in the above method embodiment can be referred to the functional description of the corresponding functional module, which will not be repeated here.
本申请实施例提供的电子设备,用于执行上述一种帧动画处理方法,因此可以达到与上述实现方法相同的效果。The electronic device provided in an embodiment of the present application is used to execute the above-mentioned frame animation processing method, and thus can achieve the same effect as the above-mentioned implementation method.
在采用集成的单元的情况下,电子设备可以包括处理模块、存储模块。其中,处理模块可以用于对电子设备的动作进行控制管理。存储模块可以用于支持电子设备执行相关程序代码和数据等。In the case of an integrated unit, the electronic device may include a processing module and a storage module. The processing module may be used to control and manage the actions of the electronic device. The storage module may be used to support the electronic device in executing related program codes and data.
其中,处理模块可以是处理器或控制器,其可以实现或执行结合本申请公开内容所描述的各种示例性的逻辑方框、模块和电路。处理器也可以是实现计算功能的组合,例如包括一个或多个微处理器组合、数字信号处理(digital signal processing,DSP)和微处理器的组合等等,存储模块可以是存储器。The processing module may be a processor or a controller, which may implement or execute various exemplary logic blocks, modules and circuits described in conjunction with the disclosure of this application. The processor may also be a combination that implements computing functions, such as a combination of one or more microprocessors, a combination of digital signal processing (DSP) and a microprocessor, etc. The storage module may be a memory.
本申请实施例还提供一种计算机可读存储介质,该计算机可读存储介质中存储有计算机程序代码,当该计算机程序代码在计算机上运行时,使得计算机执行上述相关方法步骤实现上述实施例中的一种帧动画处理方法。An embodiment of the present application also provides a computer-readable storage medium, in which a computer program code is stored. When the computer program code is executed on a computer, the computer executes the above-mentioned related method steps to implement a frame animation processing method in the above-mentioned embodiment.
本申请实施例还提供了一种计算机程序产品,当该计算机程序产品在计算机上运行时,使得计算机执行上述相关步骤,以实现上述实施例中的一种帧动画处理方法。An embodiment of the present application also provides a computer program product. When the computer program product is run on a computer, the computer is enabled to execute the above-mentioned related steps to implement a frame animation processing method in the above-mentioned embodiment.
另外,本申请的实施例提供的电子设备具体可以是芯片、组件或模块,该电子设备可包括相连的处理器和存储器;其中,存储器用于存储指令,当电子设备运行时,处理器可调用并执行指令,以使芯片执行上述实施例中的一种帧动画处理方法。In addition, the electronic device provided in the embodiments of the present application may specifically be a chip, component or module, and the electronic device may include a connected processor and memory; wherein the memory is used to store instructions, and when the electronic device is running, the processor may call and execute instructions so that the chip executes a frame animation processing method in the above-mentioned embodiments.
其中,本申请实施例提供的电子设备、计算机可读存储介质、计算机程序产品或芯片均用于执行上文所提供的对应的方法,因此,其所能达到的有益效果可参考上文所提供的对应的方法中的有益效果,此处不再赘述。Among them, the electronic device, computer-readable storage medium, computer program product or chip provided in the embodiments of the present application are all used to execute the corresponding methods provided above. Therefore, the beneficial effects that can be achieved can refer to the beneficial effects in the corresponding methods provided above and will not be repeated here.
通过以上实施方式的描述,所属领域的技术人员可以了解到,为描述的方便和简洁,仅以上述各功能模块的划分进行举例说明,实际应用中,可以 根据需要而将上述功能分配由不同的功能模块完成,也就是将装置的内部结构划分成不同的功能模块,以完成以上描述的全部或者部分功能。Through the description of the above implementation modes, those skilled in the art can understand that for the convenience and simplicity of description, only the division of the above functional modules is used as an example. The above functions are distributed and completed by different functional modules according to needs, that is, the internal structure of the device is divided into different functional modules to complete all or part of the functions described above.
在本申请所提供的实施例中,应该理解到,所揭露的装置和方法,可以通过其它的方式实现。例如,以上所描述的装置实施例仅仅是示意性的,例如,模块或单元的划分,仅仅为一种逻辑功能划分,实际实现时可以有另外的划分方式,例如多个单元或组件可以结合或者可以集成到另一个装置,或一些特征可以忽略,或不执行。另一点,所显示或讨论的相互之间的耦合或直接耦合或通信连接可以是通过一些接口,装置或单元的间接耦合或通信连接,可以是电性,机械或其它的形式。In the embodiments provided in the present application, it should be understood that the disclosed devices and methods can be implemented in other ways. For example, the device embodiments described above are only schematic, for example, the division of modules or units is only a logical function division, and there may be other division methods in actual implementation, such as multiple units or components can be combined or integrated into another device, or some features can be ignored or not executed. Another point is that the mutual coupling or direct coupling or communication connection shown or discussed can be through some interfaces, indirect coupling or communication connection of devices or units, which can be electrical, mechanical or other forms.
以上内容,仅为本申请的具体实施方式,但本申请的保护范围并不局限于此,任何熟悉本技术领域的技术人员在本申请揭露的技术范围内,可轻易想到变化或替换,都应涵盖在本申请的保护范围之内。因此,本申请的保护范围应以权利要求的保护范围为准。 The above contents are only specific implementation methods of the present application, but the protection scope of the present application is not limited thereto. Any technician familiar with the technical field can easily think of changes or substitutions within the technical scope disclosed in the present application, which should be included in the protection scope of the present application. Therefore, the protection scope of the present application should be based on the protection scope of the claims.
Claims (10)
Applications Claiming Priority (2)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN202311104807.5 | 2023-08-30 | ||
| CN202311104807.5A CN117193910A (en) | 2023-08-30 | 2023-08-30 | Frame animation processing method and device, electronic equipment and storage medium |
Publications (1)
| Publication Number | Publication Date |
|---|---|
| WO2025044461A1 true WO2025044461A1 (en) | 2025-03-06 |
Family
ID=88984278
Family Applications (1)
| Application Number | Title | Priority Date | Filing Date |
|---|---|---|---|
| PCT/CN2024/102007 Pending WO2025044461A1 (en) | 2023-08-30 | 2024-06-27 | Frame animation processing method and apparatus, electronic device, and storage medium |
Country Status (2)
| Country | Link |
|---|---|
| CN (1) | CN117193910A (en) |
| WO (1) | WO2025044461A1 (en) |
Families Citing this family (1)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN117193910A (en) * | 2023-08-30 | 2023-12-08 | 长城汽车股份有限公司 | Frame animation processing method and device, electronic equipment and storage medium |
Citations (9)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN109348295A (en) * | 2018-11-28 | 2019-02-15 | 四川长虹电器股份有限公司 | A method of solution android advertisement video, which opens, broadcasts preceding blank screen |
| CN109828791A (en) * | 2018-12-28 | 2019-05-31 | 北京奇艺世纪科技有限公司 | A kind of animation playing method, terminal and computer readable storage medium |
| CN110679154A (en) * | 2017-10-27 | 2020-01-10 | 谷歌有限责任公司 | Preview video in response to computing device interaction |
| US20200066022A1 (en) * | 2018-08-27 | 2020-02-27 | Microsoft Technology Licensing, Llc | Playback for embedded and preset 3d animations |
| CN111432265A (en) * | 2020-03-31 | 2020-07-17 | 腾讯科技(深圳)有限公司 | Method for processing video pictures, related device and storage medium |
| CN112348929A (en) * | 2020-11-26 | 2021-02-09 | 腾讯科技(深圳)有限公司 | Rendering method and device of frame animation, computer equipment and storage medium |
| CN112866779A (en) * | 2019-11-27 | 2021-05-28 | 北京沃东天骏信息技术有限公司 | Video display method, device, computer equipment and medium |
| CN116414489A (en) * | 2021-12-30 | 2023-07-11 | 深圳Tcl新技术有限公司 | Animation display method, device, computer equipment and storage medium |
| CN117193910A (en) * | 2023-08-30 | 2023-12-08 | 长城汽车股份有限公司 | Frame animation processing method and device, electronic equipment and storage medium |
-
2023
- 2023-08-30 CN CN202311104807.5A patent/CN117193910A/en active Pending
-
2024
- 2024-06-27 WO PCT/CN2024/102007 patent/WO2025044461A1/en active Pending
Patent Citations (9)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN110679154A (en) * | 2017-10-27 | 2020-01-10 | 谷歌有限责任公司 | Preview video in response to computing device interaction |
| US20200066022A1 (en) * | 2018-08-27 | 2020-02-27 | Microsoft Technology Licensing, Llc | Playback for embedded and preset 3d animations |
| CN109348295A (en) * | 2018-11-28 | 2019-02-15 | 四川长虹电器股份有限公司 | A method of solution android advertisement video, which opens, broadcasts preceding blank screen |
| CN109828791A (en) * | 2018-12-28 | 2019-05-31 | 北京奇艺世纪科技有限公司 | A kind of animation playing method, terminal and computer readable storage medium |
| CN112866779A (en) * | 2019-11-27 | 2021-05-28 | 北京沃东天骏信息技术有限公司 | Video display method, device, computer equipment and medium |
| CN111432265A (en) * | 2020-03-31 | 2020-07-17 | 腾讯科技(深圳)有限公司 | Method for processing video pictures, related device and storage medium |
| CN112348929A (en) * | 2020-11-26 | 2021-02-09 | 腾讯科技(深圳)有限公司 | Rendering method and device of frame animation, computer equipment and storage medium |
| CN116414489A (en) * | 2021-12-30 | 2023-07-11 | 深圳Tcl新技术有限公司 | Animation display method, device, computer equipment and storage medium |
| CN117193910A (en) * | 2023-08-30 | 2023-12-08 | 长城汽车股份有限公司 | Frame animation processing method and device, electronic equipment and storage medium |
Non-Patent Citations (1)
| Title |
|---|
| AN, HUI: "Using TextureView to Play Video on Andriod", CN BLOGS, CNBLOGS.COM, CN, CN, pages 1 - 6, XP009562079 * |
Also Published As
| Publication number | Publication date |
|---|---|
| CN117193910A (en) | 2023-12-08 |
Similar Documents
| Publication | Publication Date | Title |
|---|---|---|
| JP5506120B2 (en) | Apparatus and method for partitioning a display surface into a plurality of virtual display areas | |
| KR100482708B1 (en) | List controlled video operations | |
| CN106164839B (en) | Method for providing visual response to input with reduced latency | |
| JP4901261B2 (en) | Efficient remote display system with high-quality user interface | |
| JP7422784B2 (en) | Information processing device, information processing method, and program | |
| EP2859447B1 (en) | Virtual surface allocation | |
| CN104636035B (en) | Information processing apparatus, information processing method, computer program, and recording medium | |
| CN114095776B (en) | Screen recording method and electronic equipment | |
| CN114153410B (en) | Display control method and related device for multi-window pictures in same screen | |
| WO2025044461A1 (en) | Frame animation processing method and apparatus, electronic device, and storage medium | |
| CN105378639A (en) | Reducing control response latency with defined cross-control behavior | |
| CN103503430B (en) | Play control system and method | |
| CN117873625A (en) | Element processing method, device, electronic device and storage medium | |
| CN115460448A (en) | Media resource editing method and device, electronic equipment and storage medium | |
| CN119883170A (en) | Method for cross-screen transmission among multiple screens, electronic equipment and storage medium | |
| CN114710702A (en) | Video playing method and device | |
| US12206948B2 (en) | Method for displaying live streaming interface | |
| WO2025241637A1 (en) | Method and apparatus for video interaction, and device and storage medium | |
| CN117899477A (en) | Game launching method, device, equipment and storage medium in dialogue interface | |
| CN114339410B (en) | Frame insertion method, device and electronic equipment | |
| JP5087031B2 (en) | Display control device, input operation device, display system, and control system | |
| CN118466769A (en) | Writing acceleration method and device supporting transparency | |
| JP2010060623A (en) | Multi image display system, image processing method and program | |
| WO2025129610A1 (en) | Information display method and apparatus, computer-readable storage medium, and electronic device | |
| CN118689580A (en) | Application window switching method and device, storage medium and electronic device |
Legal Events
| Date | Code | Title | Description |
|---|---|---|---|
| 121 | Ep: the epo has been informed by wipo that ep was designated in this application |
Ref document number: 24858005 Country of ref document: EP Kind code of ref document: A1 |