如何在Compose中使用可绘制的动画矢量

import androidx.compose.animation.core.*
import androidx.compose.foundation.Canvas
import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.runtime.*
import androidx.compose.ui.Modifier
import androidx.compose.ui.geometry.Offset
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.graphics.drawscope.Stroke
import androidx.compose.ui.graphics.vector.Path
import androidx.compose.ui.graphics.vector.PathBuilder
import androidx.compose.ui.graphics.vector.rememberVectorPainter

@Composable
fun AnimatedVectorExample() {
    var progress by remember { mutableStateOf(0f) }
    val duration = 2000
    val infiniteTransition = rememberInfiniteTransition()
    val animatedProgress by infiniteTransition.animateFloat(
        initialValue = 0f,
        targetValue = 1f,
        animationSpec = infiniteRepeatable(
            animation = tween(durationMillis = duration, easing = LinearEasing),
            repeatMode = RepeatMode.Restart
        )
    )
    progress = animatedProgress
}

@Composable
fun AnimatedVectorDrawable() {
    val pathData = "M100,100 L200,200 L300,100 L400,200"
    val path = remember {
        PathBuilder(Path.FillType.NonZero).apply {
            addPathData(pathData)
        }.build()
    }
    val vectorPainter = rememberVectorPainter(
        defaultWidth = 500.dp,
        defaultHeight = 500.dp,
        viewportWidth = 500f,
        viewportHeight = 500f
    ) { canvas, _ ->
        canvas.drawPath(
            path = path,
            color = Color.Blue,
            style = Stroke(width = 5f)
        )
    }
    Canvas(
        modifier = Modifier.fillMaxSize(),
        onDraw = { canvas ->
            vectorPainter.paint(canvas, size)
        }
    )
}

@Composable
fun ComposeAnimationExample() {
    Box(modifier = Modifier.fillMaxSize()) {
        AnimatedVectorExample()
        AnimatedVectorDrawable()
    }
}