Animation APIs in Compose seem very complicated. I literally don't understand any of what the inline docs say!

Have you looked at any of the samples?

That’s also an area that has evolved rapidly over the last few releases, so you might find some older documentation or samples floating around.

For example, what is AnimationSpec? Maybe, it is not that hard, but I am sure it is not similar much to view animation APIs we were used to.

I don't think you should expect every single API in Compose to directly map to the older Android APIs

Yeah, plus a lot of the animation APIs heavily rely on

State

s and snapshot changes, which is a very Compose-y concept

It looks complicated because you are required to learn composite functions and their life cycle. Yes, you should forget everything you've learned so far about UI and learn from scratch. This is the way!

@Thiago This is the way!

Compose animations are indeed very different than the existing View-based animations, because we wanted to provide animation APIs that work nicely in the new declarative UI. It was a deliberate decision to not constrain ourselves to the View-based animations, and instead embrace the declarative paradigm. Fun fact: about two years ago, we gathered up a number of developers and presented the two options as we started working on compose animation: 1) Retro-fit View-based animations in compose, or 2) A clean slate for compose animation. Spoiler alert: 2) got the vast majority votes. 🙂 Given that compose animation system is tightly integrated in Compose, it helps to understand how Compose works as a whole first (e.g. state management, composable lifecycle, etc) as others have mentioned. If you would like to then learn about the different building blocks of the animation system and how to navigate the animation APIs, I have good news for you - we have some tutorials coming very soon! 😉

That's amazing @Doris Liu thank you. I love animations 😍

I have to say: "we need urgent a compose animation tutorial" but is not required for now because still in development. A basic sample is that it's hard find a good and simple way to animate from 0f to 1f and reverse it. The available versions are deprecated (

animate

,

animatedFloat

) or

animteFloatAsState

have sample with param based only. A sample in the docs seems not working on

alpha12

is animateFloatAsState . I'm changing visible value and the red box still visible. Also the animation is been fired when I toggle the value only.

@Thiago Yes,

animateFloatAsState

is a state-based animation, which reacts the

targetValue

change to fire the animation. The sample seems to have the

alpha

modifier and

background

reversed, which needs to be fixed. Please feel free to file a bug when things don't work as expected. Sounds like the API for your use case of 0f->1f->0f could be either

Animatable

or

rememberInfiniteTransition

depending on what other controls of the animation you might need. 🙂