Is Jetpack Compose Crossfade just a subset functionality of AnimateContent?

Viewed 405

From https://developer.android.com/jetpack/compose/animation, I learned about AnimatedContent which I can do a simple crossfade as below

fun MyFunction() {
    Column {
        var currentPage by remember { mutableStateOf("0") }
        AnimatedContent(targetState = currentPage,
            transitionSpec = {
                fadeIn(animationSpec = tween(150)) with
                        fadeOut(animationSpec = tween(150))
            }) { screen -> Text("Page $screen") }
        Button(onClick = {
            currentPage = (0..10).random().toString()
        }) {
            Text("Click Me")
        }
    }
}

However, later, I found there's a Crossfade function as well, and I can just use it.

fun MyFunction() {
    Column {
        var currentPage by remember { mutableStateOf("0") }
        Crossfade(targetState = currentPage) { screen ->
            Text("Page $screen")
        }
        Button(onClick = {
            currentPage = (0..10).random().toString()
        }) {
            Text("Click Me")
        }
    }
}

It looks like Crossfade is just probably a subset of what AnimateContent can do. Is that correct? If not, what Crossfade can do, that is not covered by AnimateContent?

1 Answers

Yes, Crossfade does a subset of what AnimatedContent does.

Crossfade is a single-purpose, therefore easy-to-use animation API. We expect it to be a low friction entry point for most people to start with. Once you are familiar with the mental model of Crossfade , it is relatively straightforward to carry that over in AnimatedContent . Meanwhile, AnimatedContent also brings in the enter/exit transition vocabulary from AnimatedVisibility , we intended it to be a natural progression going from AnimatedVisibility to AnimatedContent as well.

The intention for this design is to offer easy-to-learn animation primitives that serve not only as the starting point for anyone new to Compose, but also as building blocks for the more powerful APIs that one can at some point progress into. :)

Related