Hey Nick! I loved your post, it helped me a lot to understand Paths and Canvas (which I'm mapping to Compose's analogous). But I'd like to say that the link to the Romain Guy's article is broke. :( Could you update it? Thanks in advance.

Jetpack Compose has been promoted from alpha to beta some time ago, which means the API’s last breaking changes are up. One of the greatest changes we can find is in its animations interface, which, in general, makes animations easier to understand, to read, and to build.

In this article, I will make a general overview of this animation API, making a special emphasis on Transitions object, which will help us create beautiful declarative animations in any composable we write by having a good control on what’s being displayed.

State-Driven Animations

If you’ve been into Jetpack Compose for a while, you’ll know…

With implicit animations, we are creating code in a declarative manner. We tell them how to look like (instead of how to do it) by just writing the values we want them to take. Just as simple as that!

But what if we wanted, for example, a repeating animation? We’d need to write a lot of boilerplate involving the setState function to get what we want in our Flutter app.

In this article I’ll introduce the evil twin of implicit animations: explicit animations!

IMPORTANT: all the code present in this article is compatible with Flutter 2!

Explicit Animations are just…

The Beginning

I started with Android Development almost two years ago. I remember that a beloved friend of mine took me to a pulqueria (some sort of bar very common in Mexico) and told me that he could be my mentor in this long and challenging journey (I’d like to mention that I was in the last semester of the college and, as some of you may have experienced by yourself, I didn’t know what I wanted to do with my life). When I was at home, I created my first Hello, world!Android app and I never expected that this world could…

In the previous chapter, we learned how to use Flutter’s implicit animations, which, in a few words, manage all the animation stuff for us: we have nothing to worry about but the values we are going to apply to our widget.

We used some of the most common widgets, such as AnimatedOpacity or, more heavily, AnimatedContainer.

But then, after using them, we may be wondering: what if there is no implicit animations that can fit my requirements? I think any programmer may think this about the built-in features of any technology.

That is why Flutter surprises us with other way…

It is well known that Flutter offers a very simple way for building beautiful cross-platform applications (Android, iOS, Desktop and Web). From the perspective of an Android Developer (like me), this can be true at many levels, since you can create your UI with declarative and functional code, using easy concepts such as Column or Row, instead of diving into XML files (which are not code), or even storyboards (if you come from iOS).

If you’ve worked with Android animation APIs, you’ll know that they are a headache at many levels: a complex interface, a lot of APIs (some of…

Gonzalo Campos

Mobile developer, musician, gamer. ;)

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store