android - 在撰写中重复翻译动画

Question

我想实现一个翻译动画，它将连续运行，直到服务器的某些值停止它。这是我需要实现的图像：

你可以在上面看到一条白色的垂直线，这是一张图片。我需要不断地从头到尾翻译它[不是来回]

这个布局有一个Box灰色的，里面有一个LinearProgressIndicator. 所以这个进度可以是 50%、80% 等。而且这个图像只能动画直到进度条。

请参阅下面的代码：

 Box(modifier = Modifier
           .fillMaxWidth()
            .height(50.dp)
            .constrainAs(main_progress_bar) {
                top.linkTo(parent.top, 16.dp)
                start.linkTo(parent.start, 16.dp)
                end.linkTo(parent.end, 16.dp)
                width = Dimension.fillToConstraints
            }
            .background(getAppColors().gray, RoundedCornerShape(10.dp))
        ) {

                val offsetAnimation: Dp by animateDpAsState(
                100.dp,
                infiniteRepeatable(
                    animation = tween(
                        800,
                        easing = LinearEasing,
                        delayMillis = 1_500,
                    ),
                    repeatMode = RepeatMode.Restart,
                )
          
                LinearProgressIndicator(

                modifier = Modifier
                    .fillMaxWidth((viewModel.mainPercentage / 100))
                    .height(50.dp)
                    .clip(
                        RoundedCornerShape(
                            topStart = 10.dp,
                            topEnd = 0.dp,
                            bottomStart = 10.dp,
                            bottomEnd = 0.dp
                        )
                    ),
                backgroundColor = getAppColors().gray,
                color = getAppColors().greenColor,
                progress = 1f,
            )


            Image(
                painter = rememberDrawablePainter(
                    ContextCompat.getDrawable(
                        context,
                        R.drawable.ic_animation_icon
                    )
                ),
                contentDescription = "image",
                modifier = Modifier
                    .absoluteOffset(x = offsetAnimation)
            )

          }

此代码无法按预期工作。我尝试了其他一些答案，但我无法完全满足我的需要。试过这个很有帮助，但我如何在这里获得动画结束回调，以便我可以重新启动它，或者如何从 viewModel 本身控制动画？这是我面临的主要问题。

Answer 1

基于官方示例的解决方案：

val infiniteTransition = rememberInfiniteTransition()
val offsetAnimation by infiniteTransition.animateValue(
    initialValue = 0.Dp,
    targetValue = 100.Dp,
    typeConverter = Dp.VectorConverter,
    animationSpec = infiniteRepeatable(
        animation = tween(800, easing = LinearEasing, delayMillis = 1_500),
        repeatMode = RepeatMode.Restart
    )
)

我不确定如果 targetValue 发生变化它将如何工作..