Skip to main content

Documentation Index

Fetch the complete documentation index at: https://mintlify.com/tutosrive/lottie-kt-test/llms.txt

Use this file to discover all available pages before exploring further.

LottieAnimationView is the primary UI widget provided by the Lottie library. It extends ImageView, so it slots naturally into any layout. In this demo the view is declared in XML with autoplay and loop attributes so it begins playing immediately once the activity is created, then fine-tuned in Kotlin to load a specific animation file and run it at double speed.

​
XML Layout Declaration

The view is defined inside activity_main.xml within a vertical LinearLayout:
app/src/main/res/layout/activity_main.xml
<com.airbnb.lottie.LottieAnimationView
    android:id="@+id/lottieView"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    app:lottie_autoPlay="true"
    app:lottie_loop="true"
    app:lottie_repeatMode="restart" />
Key XML attributes:
AttributeValueEffect
lottie_autoPlaytrueStarts the animation as soon as the view is attached to the window, without needing an explicit playAnimation() call from XML alone
lottie_looptrueRepeats the animation indefinitely after it finishes
lottie_repeatModerestartAfter each loop the animation jumps back to frame 0 and plays forward again (as opposed to reverse, which would ping-pong)
android:layout_width="match_parent" and android:layout_height="match_parent" let the animation fill the remaining screen space below the Change button, which is declared just above it in the same LinearLayout.

​
Kotlin Initialization

In onCreate, MainActivity.kt locates the view with findViewById, loads the animation file, sets playback speed, and starts playback:
MainActivity.kt
btnChange = findViewById<Button>(R.id.btnChange)
lottieView = findViewById<LottieAnimationView>(R.id.lottieView)
var anim = "wh.json"
lottieView.setAnimation(anim)
lottieView.playAnimation()
lottieView.speed = 2.0f
setAnimation("wh.json") resolves the filename against the assets/ directory at runtime. No path prefix is needed — the string is the exact filename as it appears inside app/src/main/assets/.
Setting lottieView.speed = 2.0f doubles the playback rate: an animation that would ordinarily take 3 seconds to complete will finish in 1.5 seconds. Values below 1.0f slow the animation down; negative values play it in reverse. The call to lottieView.playAnimation() is technically redundant here because lottie_autoPlay="true" is set in XML, but it is included explicitly to make the intent clear and to ensure playback starts reliably regardless of any XML attribute parsing timing.
Now that the animation is running, learn how to swap between multiple JSON files at runtime: Switching Animations

Build docs developers (and LLMs) love

Get started for freeTalk to us