Hello everyone, I work on Compose Animation. I would love to collect feature requests from you guys on layout animation in compose. 😀 The more specific the better! If you have run into the cases where layout changes happen so fast and instantaneously that you wish it would slow down and get smoothed over, this would be a perfect opportunity to bring it up! 😉

In my opinion the DSL for defining the Prop keys is not so clean:

val colorKey = ColorPropKey()
val widthKey = DpPropKey()
val heightKey = DpPropKey()

val definition = transitionDefinition {
    state(State.First) {
        this[colorKey] = Color.Red
        this[widthKey] = 200.dp
        this[heightKey] = 400.dp
    }
    state(State.Second) {
        this[colorKey] = Color.Green
        this[widthKey] = 300.dp
        this[heightKey] = 300.dp
    }
}

maybe it would be possible using delegates to get a DSL like this:

val colorKey by ColorPropKey()
val widthKey by DpPropKey()
val heightKey by DpPropKey()

val definition = transitionDefinition {
    state(State.First) {
        colorKey = Color.Red
        widthKey = 200.dp
        heightKey = 400.dp
    }
    state(State.Second) {
        colorKey = Color.Green
        widthKey = 300.dp
        heightKey = 300.dp
    }
}

the keys would need to be

var

Thanks for the feedback @Timo Drick. We have in fact experimented with having `PropKey`s as extension properties on TransitionState, and came to the exact syntax as you posted above. The challenge is that we can't use these properties to define animations in transition as we would here:

transition (State.First to State.Second) {
colorKey using tween(..)
}