Render After Effects animations natively on Android and iOS, Web, and React Native
[Removed API] Removed the setScale(float) APIs from LottieAnimationView and LottieDrawable. The expected behavior was highly ambiguous when paired with other scale types and canvas transformations. For the vast majority of cases, ImageView.ScaleType should be sufficient. For remaining cases, you may apply transformations to Canvas and use LottieDrawable#draw directly.
Added support for the "Rounded Corners" effect on Shape and Rect layers (#1953)
Prior to 5.0, LottieAnimationView would always call setLayerType with either HARDWARE or SOFTWARE. In the hardware case, this would case Android to allocate a dedicated hardware buffer for the animation that had to be uploaded to the GPU separately. In the software case, LottieAnimationView would rely on View's internal drawing cache.
This has a few disadvantages:
Benefits as a result of this change:
Lottie can now render outside of its composition bounds. To allow this with views such as LottieAnimationView, set clipToCompositionBounds to false on LottieDrawable or LottieAnimationView and clipChildren to false on the parent view. For Compose, use the clipToCompositionBounds parameter.
Prior to 5.0, LottieAnimationView handled all animation controls when the view's visibility or attach state changed. This worked fine for consumers of LottieAnimationView. However, custom uses of LottieDrawable were prone to leaking infinite animators if they did not properly handle cancelling animations correctly. This opens up the possibility for unexpected behavior and increased battery drain. Lottie now behaves more like animated drawables in the platform and moves this logic into the Drawable via its setVisible API. This should lead to no explicit behavior changes if you are using LottieAnimationView. However, if you are using LottieDrawable directly and were explicitly pausing/cancelling animations on lifecycle changes, you may want to cross check your expected behavior with that of LottieDrawable after this update. This change also resolved a long standing bug when Lottie is used in RecyclerViews due to the complex way in which RecyclerView handles View lifecycles (#1495). #1981
Add an API setClipToCompositionBounds on LottieAnimationView, LottieDrawable, and the LottieAnimation composable to prevent Lottie from clipping animations to the composition bounds.
Add an API to always render dynamically set bitmaps at the original animation bounds. Previously, dynamically set bitmaps would be rendered at their own size anchored to the top left of the original bitmap. This meant that if you wanted to supply a lower resolution bitmap to save memory, it would render smaller. The default behavior remains the same but you can enable setMaintainOriginalImageBounds to be able to supply lower resolution bitmaps (#1706).
Add support for LottieProperty.TEXT to use dynamic properties for text. This enables dynamic text support for lottie-compose (#1995).
Add getters for Marker fields (#1998)
Add support for reversed polystar paths (#2003)
BREAKING CHANGES Before this release, drop shadows and blurs were completely ignored. They will now be rendered. In most cases, they will now be rendered correctly. However, you should read the implementation details here if they are not.
Support for lottie-compose 1.0.0-rc02-1
LottieAnimation now takes a progress float instead of driving the animation internally. The driving of animations has been split into a new LottieAnimatable class and animateLottieCompositionAsState function. These are analogous to Jetpack's Animatable and animate*AsState functions. Properties that pertain to the animation such as speed, repeat count, and the new clip spec are part of animateLottieComposition whereas properties that are related to rendering such as enabling merge paths and setting an image asset delegate are on the LottieAnimation composable.
lottieComposition has also been renamed rememberLottieComposition.
The docs have been update to reflect the new API and there are lots of examples here.
There are overloaded version of LottieAnimation that merge the properties for convenience. Please refer to the docs for LottieAnimation, LottieAnimatable, animateLottieCompositionAsState and rememberLottieComposition for more information.
composition.images["your_image_id"].bitmap = yourBitmap. This lets you control
exactly how and when the bitmaps get created and set. The previous implementation of calling a callback on every
frame encouraged the incorrect behavior of doing IO tasks during the animation hot path. Check out ImagesExamplesPage.kt
for usage.@Composable
private fun PlayOnce() {
val composition by rememberLottieComposition(LottieCompositionSpec.RawRes(R.raw.heart))
LottieAnimation(composition)
}
@Composable
private fun RepeatForever() {
val composition by rememberLottieComposition(LottieCompositionSpec.RawRes(R.raw.heart))
LottieAnimation(
composition,
iterations = LottieConstants.IterateForever,
)
}
@Composable
private fun RepeatForeverWithAnimateLottieCompositionAsState() {
val composition by rememberLottieComposition(LottieCompositionSpec.RawRes(R.raw.heart))
val progress by animateLottieCompositionAsState(
composition,
iterations = LottieConstants.IterateForever,
)
LottieAnimation(
composition,
progress,
)
}
@Composable
private fun RepeatForeverWithLottieAnimatable() {
val anim = rememberLottieAnimatable()
val composition by rememberLottieComposition(LottieCompositionSpec.RawRes(R.raw.heart))
LaunchedEffect(composition) {
anim.animate(
composition,
iterations = LottieConstants.IterateForever,
)
}
LottieAnimation(anim.composition, anim.progress)
}
Support for Jetpack Compose Beta 7