MutableTransitionState

import androidx.compose.animation.core.MutableTransitionState
import androidx.compose.animation.core.Spring
import androidx.compose.animation.core.Transition
import androidx.compose.animation.core.animateDp
import androidx.compose.animation.core.animateFloat
import androidx.compose.animation.core.rememberTransition
import androidx.compose.animation.core.spring
import androidx.compose.animation.core.tween
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.size
import androidx.compose.material.Card
import androidx.compose.runtime.Composable
import androidx.compose.runtime.remember
import androidx.compose.ui.Modifier
import androidx.compose.ui.draw.scale
import androidx.compose.ui.graphics.graphicsLayer
import androidx.compose.ui.unit.dp

// This composable enters the composition with a custom enter transition. This is achieved by
// defining a different initialState than the first target state using `MutableTransitionState`
@Composable
fun PoppingInCard() {
    // Creates a transition state with an initial state where visible = false
    val visibleState = remember { MutableTransitionState(false) }
    // Sets the target state of the transition state to true. As it's different than the initial
    // state, a transition from not visible to visible will be triggered.
    visibleState.targetState = true

    // Creates a transition with the transition state created above.
    val transition = rememberTransition(visibleState)
    // Adds a scale animation to the transition to scale the card up when transitioning in.
    val scale by
        transition.animateFloat(
            // Uses a custom spring for the transition.
            transitionSpec = { spring(dampingRatio = Spring.DampingRatioMediumBouncy) }
        ) { visible ->
            if (visible) 1f else 0.8f
        }
    // Adds an elevation animation that animates the dp value of the animation.
    val elevation by
        transition.animateDp(
            // Uses a tween animation
            transitionSpec = {
                // Uses different animations for when animating from visible to not visible, and
                // the other way around
                if (false isTransitioningTo true) {
                    tween(1000)
                } else {
                    spring()
                }
            }
        ) { visible ->
            if (visible) 10.dp else 0.dp
        }

    Card(
        Modifier.graphicsLayer(scaleX = scale, scaleY = scale)
            .size(200.dp, 100.dp)
            .fillMaxWidth(),
        elevation = elevation,
    ) {}
}