Shulou(Shulou.com)06/03 Report--

This article mainly explains "using Android Lottie to realize the Mid-Autumn Festival mooncakes into moon animation special effects code sharing", interested friends may wish to have a look. The method introduced in this paper is simple, fast and practical. Next let the editor to take you to learn "using Android Lottie to achieve the Mid-Autumn Festival mooncakes into moon animation special effects code sharing" bar!

Catalogue

Case attempt

1. Integrated dependency

two。 Add LottieAnimationView to load network resources

3. Load local resources

4. Loop playback & Animation Monitoring

5. Pause & continue & cancel

Small expansion

1. Hardware accelerator

2. Json file parsing

Case attempt

1. Integrated dependency

Integrate the latest version of Lottie dependencies in build.gradle and synchronize them

Api 'com.airbnb.android:lottie:4.1.0'2. Add LottieAnimationView to load network resources

First add LottieAnimationView to the xml file, and then load the network resources through setAnimationFromUrl (); there are two overloading methods when loading network images, in which cacheKey is the cache strategy; after loading the network resources, you also need playAnimation (start the animation

MView = (LottieAnimationView) this.findViewById (R.id.lottie_view); mView.setAnimationFromUrl ("https://assets6.lottiefiles.com/packages/lf20_Tprkoc.json");mView.playAnimation();"

3. Load local resources

When LottieAnimationView loads local resources, you need to download the generated json file and add it to the project to introduce local resources through setAnimation (). Among them, setAnimation () also has several overloaded methods, which can be flexibly applied.

MView2 = (LottieAnimationView) this.findViewById (R.id.lottie_view2); mView2.setAnimation ("mooncake.json"); mView2.playAnimation ()

4. Loop playback & Animation Monitoring

After setting setAnimation () in the first two steps, stop the animation after playback is completed. If you need to repeat the playback, you can loop through loop (true), but this method is not recommended in the new API. You can set the playback times through setRepeatCount (), or play it again at the end of the animation through animation monitoring.

MView2.loop (true); mView1.setRepeatCount (5)

You can use addAnimatorListener () to monitor animation; when you set * playback times, the onAnimationRepeat () callback will be called for each playback, and onAnimationEnd () will not be called until the playback is over. If you do not set the playback times, you will not enter the onAnimationRepeat () callback.

MView2.addAnimatorListener (new Animator.AnimatorListener () {@ Override public void onAnimationStart (Animator animator) {Log.e (TAG, "- > onAnimationStart ());} @ Override public void onAnimationEnd (Animator animator) {Log.e (TAG,"-> onAnimationEnd () ");} @ Override public void onAnimationCancel (Animator animator) {Log.e (TAG,"-> onAnimationCancel () ") @ Override public void onAnimationRepeat (Animator animator) {Log.e (TAG, "- > onAnimationRepeat ()");}})

5. Pause & continue & cancel

The side dish plays the animation through playAnimation (), and Lottie also provides methods for pauseAnimation () to pause the animation, resumeAnimation () to continue playing after pause, and cancelAnimation () to cancel the animation.

When playAnimation () is called, the animation will be played from the start position, while resumeAnimation () will play from the stop position of pausing or canceling the animation; both pauseAnimation () and cancelAnimation () will stop the animation, but after cancelAnimation () stops, the animation Drawable will be emptied by lottieDrawable.cancelAnimation (), and the callback will be made in onAnimationCancel () listening.

@ Overridepublic void onClick (View view) {switch (view.getId ()) {case R.id.main_btn1: mView2.playAnimation (); break; case R.id.main_btn2: mView2.pauseAnimation (); break; case R.id.main_btn3: mView2.resumeAnimation (); break Case R.id.main_btn4: mView2.cancelAnimation (); break;}}

Small expansion

1. Hardware accelerator

When using Lottie, it is recommended to turn on the hardware accelerator to reduce the frame rate of animation and avoid stutter.

Android:hardwareAccelerated= "true" 2. Json file parsing

Before, I thought that the json file of Lottie is a magical and complicated heavenly book. Today, it briefly introduces the corresponding relations of its attributes.

The overall structure consists of the following parts: v is the corresponding bodymovin animation version; fr is the frame rate; ip / op corresponds to the start / end keyframes; w / h is the width and height of the animation; assets is the resource information, including Drawable, etc.; layers is the layer information

At this point, I believe you have a deeper understanding of "using Android Lottie to realize the Mid-Autumn Moon Moon Animation Special effects Code sharing". You might as well do it in practice. Here is the website, more related content can enter the relevant channels to inquire, follow us, continue to learn!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.