Skip to content

2.0.0-beta01

Pre-release
Pre-release
Compare
Choose a tag to compare
@alexzhirkevich alexzhirkevich released this 29 Jun 15:31
· 104 commits to standalone-main since this release

Compottie 2.0 - brand new standalone multiplatform renderer, images, fonts, dotLottie (zip), URL loading, dynamic properties and more

New rendering engine

Compottie is no longer a simple wrapper over the platform renderers but standalone rendering engine.
It implies seamless integration with compose environment, consistent animation behaviour across platforms, consistent list of supported animation features and many new features that weren't possible before.

Note

The new renderer is implemented from scratch and therefore may have bugs.
Please report if you find any, preferably with a reproducible animation.

Images and Fonts

Compottie now supports embedded base64 images as well as images from any kind of resources on all platforms.
Embedded images work by default, you don't have to do anything. Other images as well as fonts can be provided using the new interfaces called LottieAssetsManager and LottieFontManager. New compottie module compottie-resources provides managers implementation backed by official compose resources.

dotLottie

Compottie now has a new module - compottie-dot. It brings the new type of composition spec - LottieCompositionSpec.DotLottie.

dotLottie is an open-source file format that aggregates one or more Lottie files and their associated resources into a single file. They are ZIP archives compressed with the Deflate compression method and carry the file extension of ".lottie".

dotLottie animations are up to 10x smaller in size and can have auto-linked bundled assets (as well as external assets).

You can also use DotLottie composition spec even without making a .lottie file just by ZIPping your animation with assets using deflate algorithm. The only limitation - animation can't be named as "manifest.json" and should contain exactly one .json file.

URL loading

Another new Compottie module compottie-network brings one more type of composition spec - LottieCompositionSpec.Url and NetworkAssetsManager. It provides configurable Ktor remote animation loading as well as local file system cache

Dynamic properties

You can now dynamically configure various animation properties at runtime. For example, you can change animation color when your app theme changes, or adjust position/scale of any layer in responce for a click.

Migration from 1.x

There shouldn't be serious breaking changes, but some of the APIs were deprecated in favour of new more flexible and convenient features. All deprecated declarations will be removed in v2.0 RC. All migrations can be performed with IDEA auto-replace feature.

  1. LottieAnimation composable was deprecated. The preferred way of rendering animations is now Lottie Painter that can be created using rememberLottiePainter. Lottie painter is also available in Compottie 1.x .

Before:

LottieAnimation(
    composition = ...
)

Now:

Image(
   painter = rememberLottiePainter(
    composition = ...
   ),
   contentDescription = "My awesome lottie animation'
)

It provides better semantics and allows you to draw lottie animations inside the Canvas, Modifier.drawBehind or in any other place that provides a DrawScope.

  1. LottieCompositionSpec.JsonString is no longer a class, but companion object function. It returns interface so if you were using the class jsonString property, you are no longer able to.

  2. rememberLottieComposition is now have an overload with suspend lambda composition loader. It will also automatically remember your spec instance to avoid recreations. Old declaration was deprecated. With the new override you can load animation from resources much easier:

Before:

var string by remember {
    mutableStateOf<String?>(null)
}

LaunchedEffect(Unit) {
    string = Res.readBytes("files/anim.json").decodeToString()
}

val composition = if (string != null) {
    rememberLottieComposition(CompositionSpec.JsonString(string!!)).value
} else null

Now:

val composition by rememberLottieComposition {
    // this is suspend IO context
    LottieCompositionSpec.JsonString(
        Res.readBytes("files/anim.json").decodeToString()
    )
}