Getting Started

Prerequisites

Before integrating the dotLottie Android Library into your project, ensure you have the following prerequisites met: Android Studio installed on your machine. An Android project targeting API level 24 or higher.

Setting Up Your Project

To use the dotLottie Android Library, you need to add it as a dependency in your project. Follow these steps to set it up:

Step 1: Configure Gradle

Open your project’s settings.gradle.kts file and ensure that the mavenCentral() repository is included in the repositories block. If it’s not present, add it as shown below:

settings.gradle.kts
pluginManagement {
repositories {
// Other repositories
mavenCentral()
maven {
url = uri("https://jitpack.io")
}
}
}
dependencyResolutionManagement {
repositories {
// Other repositories
mavenCentral()
maven {
url = uri("https://jitpack.io")
}
}
}

Step 2: Add the Dependency

Next, add the dotLottie Android Library dependency to your app module’s build.gradle.kts file.

build.gradle.kts
dependencies {
implementation("com.github.LottieFiles:dotlottie-android:0.4.1")
}

You can find the latest version of the library on the GitHub releases page or on JitPack Repository.

Step 3: Sync Your Project

After adding the dependency, click on the Sync Now prompt that appears in the top right corner of the Android Studio editor. This will download the library and integrate it into your project.

Using dotLottie in Your Application

Using XML

First, put your animation in the assets folder in your Android project and add DotLottieAnimation in your XML file:

<com.lottiefiles.dotlottie.core.widget.DotLottieAnimation
android:id="@+id/lottie_view"
android:layout_width="200dp"
app:speed="3"
app:src="swinging.json"
android:layout_height="200dp" />

Using Kotlin Code

val dotLottieAnimationView = findViewById<DotLottieAnimation>(R.id.lottie_view)

Set up the initial animation configuration

val config = DotLottieConfig.Builder()
.autoplay(true)
.speed(1f)
.loop(true)
.source(DotLottieSource.Url("https://lottiefiles-mobile-templates.s3.amazonaws.com/ar-stickers/swag_sticker_piggy.lottie")) // URL of .json or .lottie
//.source(DotLottieSource.Asset("file.json")) // Asset from the asset folder .json or .lottie
.useInterpolation(true)
.playMode(Mode.FORWARD)
.build()
dotLottieAnimationView.load(config)

Using Jetpack Compose

DotLottieAnimation(
source = DotLottieSource.Url("https://lottiefiles-mobile-templates.s3.amazonaws.com/ar-stickers/swag_sticker_piggy.lottie"), // URL of .json or .lottie
// source = DotLottieSource.Asset("file.json"),
autoplay = true,
loop = true,
speed = 3f,
useFrameInterpolation = false,
playMode = Mode.FORWARD,
modifier = Modifier.background(Color.LightGray)
)

Next Steps

Now that you have the dotLottie Android Library integrated into your project, you can start loading and displaying Lottie animations in your app. For more detailed examples and usage instructions, refer to the Basic Usage section and explore the API documentation for advanced features and customization options.