is there a way to animate/create transition for

Composable

s getting "disposed". When changing state in compose it is usually done this way:

Surface(color = selectorExpandedColor, elevation = 3.dp) {
        when (currentSelector) {
            InputSelector.EMOJI -> EmojiSelector(onTextAdded, focusRequester)
            <http://InputSelector.DM|InputSelector.DM> -> NotAvailablePopup(onCloseRequested)
            InputSelector.PICTURE -> FunctionalityNotAvailablePanel()
            InputSelector.MAP -> FunctionalityNotAvailablePanel()
            InputSelector.PHONE -> FunctionalityNotAvailablePanel()
            else -> { throw NotImplementedError() }
        }
    }

(Note: Code above is taken from

JetChat

) But doing so, creates a jarring experience where contents just pops-out and pops-in in an instant. Is it possible to trigger/create transition or animation when changing states (animate composable out and then animate composable coming in)? Is there any guide for this out there?

you could wrap it inside an animation

you might find https://developer.android.com/reference/kotlin/androidx/compose/animation/package-summary#AnimatedVisibility(kotlin.Boolean,%20androidx.compose.ui.Modifier,%20androidx.compose.animation.EnterTransition,%20androidx.compose.animation.ExitTransition,%20kotlin.Boolean,%20kotlin.Function0) helpful

Wow Im really missing out on these documentations! Thank you very much!

The docs are very much WIP 🙂 If you can tell us what you searched for or how you tried to find this sort of thing that didn't lead to what you were looking for, we can give that info to the docs team for any later design work on the site

https://kotlinlang.slack.com/archives/CJLTWPH7S/p1599259370042000 @Adam Powell Hi. Recently I was searching how to animate translations of views in Compose. I wanted to animate view translation by

x-axis

in range from

X

to

X1

. In general, I achieved the desired result but I think the implementation was far from ideal. I wanted to see more examples of animation API usage. I am having difficulty with understanding the analogy of

View.animate().translateX(...)

in Compose. Also, I was wondering how to use the

AnimatedFloat

or

transitionDefinition

with dynamic values for states, etc. Thanks.

the strange impedance mismatches you're running into are why I would like to make two specific API changes to some of the things you're using: 1.

animate

should return a

State<T>

- that's what it's using internally anyway and you shouldn't need to bounce it into another

MutableState<T>

via composition. 2.

Modifier.offset

should accept a lambda block that returns the offset when needed, so you can freely use

State<T>

in expressions and have the observation pushed to layout-positioning time rather than moving back into composition, or forcing the value into an additional

State<T>

holder.

>

animate

 should return a 

State<T>

:thinking_face: