如何制作图像交换的动画

Question

我想要为Icons.Default.Check和 之间的变化设置动画Icons.Default.Close，就像淡出一个淡出另一个淡入一样。

我已经研究过了，animation*AsState但似乎没有一种内置的方法可以开箱即用，而且我在 Jetpack Compose 方面没有足够的经验来找出制作这样的自定义动画的正确方法。

if(isChecked){
    Icon(imageVector = Icons.Default.Check, contentDescription = "", tint = Color.Black)
}else{
    Icon(imageVector = Icons.Default.Close, contentDescription = "", tint = Color.Gray)
}

Answer 1

您可以按照动画文档Crossfade中所示的方式使用。

Crossfade(targetState = isChecked) { isChecked ->
    // note that it's required to use the value passed by Crossfade
    // instead of your state value
    if (isChecked) {
        Icon(imageVector = Icons.Default.Check, contentDescription = "", tint = Color.Black)
    } else {
        Icon(imageVector = Icons.Default.Close, contentDescription = "", tint = Color.Gray)
    }
}