我希望实现一个改变比例值的动画来提醒用户可以点击某个小部件。以前我可以用
Valueanimator
:
ValueAnimator.ofFloat(0.8f,0.5f,0.8f,1.2f,0.6f,0.8f) //animateFloatAsState only support to define target value,init value
在jetpack compose中,我不得不想出这个实现
val animate = remember { Animatable(0.8f) }
val playCheckItemAnimation = {
scope.launch {
animate.stop()
for (i in 0..2) {
animate.animateTo(0.8f)
animate.animateTo(0.5f)
animate.animateTo(0.8f)
animate.animateTo(1.2f)
animate.animateTo(0.6f)
animate.animateTo(0.8f)
}
}
}
如果我需要像
ValueAnimator.ofFloat(0.8f,0.5f,0.8f,1.2f,0.6f,0.8f)
那样设置一组浮动,似乎没有方便的方法。
有没有简单的方法可以做到这一点?
您可以使用
rememberInfiniteTransition
。在文档中查看有关动画的更多信息
val infiniteTransition = rememberInfiniteTransition()
val value by infiniteTransition.animateFloat(
initialValue = 0.5f,
targetValue = 0.8f,
animationSpec = infiniteRepeatable(
animation = tween(durationMillis = AnimationConstants.DefaultDurationMillis),
repeatMode = RepeatMode.Reverse
)
)
Box(
Modifier
.padding(10.dp)
.size(100.dp)
.alpha(value)
.background(Color.Red)
)
这个 API 不存在,但你可以自己构建一个相对简单的:
suspend fun <T, D : AnimationVector> Animatable<T, D>.animateTo(
vararg value: T,
) {
value.forEach {
this.animateTo(
targetValue = it,
animationSpec = animationSpec
)
}
}
用法
val scope = rememberCoroutineScope()
val animate = remember { Animatable(0.8f) }
val playCheckItemAnimation = {
scope.launch {
animate.stop()
repeat(2) {
animate.animateTo(0.8f, 0.5f, 0.8f, 1.2f, 0.6f, 0.8f)
}
}
}
您也可以轻松地向
animateTo
添加额外的参数,例如 animationSpec
等。