Jetpack Compose animation 性能问题

Question

我是 Jetpack Compose 的新手，我正在尝试在点击菜单按钮时使用 animation 旋转主屏幕。 3-5次都很好用，突然就卡顿了，不知道为什么？ 这是一个错误，还是我做错了什么？

var isOpen by remember { mutableStateOf(false) }
val transition = updateTransition(targetState = isOpen, "Menu")

val rotation by transition.animateFloat(
    transitionSpec = { spring(0.4f, Spring.StiffnessLow) },
    label = "MenuRotation",
    targetValueByState = { if (it) -30f else 0f }
)

val scale by transition.animateFloat(
    label = "MenuScale",
    targetValueByState = { if (it) 0.9f else 1f }
)

val translateX by transition.animateFloat(
    transitionSpec = { tween(400) },
    label = "MenuTranslation",
    targetValueByState = { if (it) 536f else 0f }
)

Box(
    modifier = Modifier
        .fillMaxSize()
        .graphicsLayer {
            cameraDistance = density * 10f
            rotationY = rotation
            scaleX = scale
            translationX = translateX
        }
) {
    HomeScreen()
}

Box {
   DefaultButton(
        onClick = { isOpen = ! isOpen },
        modifier = Modifier
            .padding(16.dp)
            .padding(top = 32.dp)
            .shadow(blur = 8.dp, radius = 16.dp)
            .size(32.dp, 32.dp),
        shape = Shapes.large,
    ) {
        Icon(
            imageVector = if (isOpen) Icons.Filled.Close else Icons.Filled.Menu,
            contentDescription = "Menu",
            tint = Color.Black,
        )
    }
}

更新#1

我在 logcat 中找到了这个

跳过 52 帧。 应用程序可能在其主线程上做了太多工作； Davey, duration=1067ms, Flags=0, FrameTimelineVsyncId=2511155, IntendedVsync=4294436921331, Vsync=4294870254647, InputEventId=0, HandleInputStart=4294871069349, AnimationStart=4294871070287, PerformTraversalsStart=4294871939089, DrawStart=4294872039558, FrameDeadline=4294486921330, FrameInterval=4294870971954, FrameStartTime=41666666, SyncQueued=4294872645860, SyncStart=4295312217578, IssueDrawCommandsStart=4295312304089, SwapBuffers=4295937520703, FrameCompleted=4295944298047, DequeueBufferDuration=5729, QueueBufferDuration=166719, GpuCompleted=4295944298047, SwapBuffersCompleted=4295937862943, DisplayPresentTime=4237530536663, CommandSubmissionCompleted=4295937520703,

更新 #2

当我注释掉所有文本组件时，animation 可以完美运行，反之亦然。 那么文本组件有什么问题呢？

Answer 1

请检查 HomeScreen composable，component recomposition counts。

怀疑HomeScreen重组次数太多。

您可以将@Composable HomeScreen替换为@Composeable Image验证。