如何在 Jetpack Compose 中绘制3D对象？

Question

如何在Jetpack Compose中绘制3D对象？

我想要画一个立方体并旋转它。
除了这个，我找不到其他任何示例或教程。

但对我来说，这太难了。

- Nurseyit Tursunkulov

---

你找到的例子似乎侧重于这个人决定处理的任务的数学实现。然而，如果你仔细观察，你会注意到他完成这个任务的"方式"。通过Canvas组件进行搜索，它提供了你绘制立方体所需的API。此外，要绘制一个立方体，你应该稍微了解线性代数和其他一些图形数学概念。 - undefined

Answer 1

要绘制一个立方体并模拟其旋转，您可以按照以下步骤进行操作：

1. 创建一个用于立方体的可组合对象：

@Composable
fun Cube() {
    // Draw the front face of the cube
    Box(
        modifier = Modifier
            .fillMaxSize()
            .background(Color.Blue)
    )

    // Draw the right face of the cube
    Box(
        modifier = Modifier
            .fillMaxSize()
            .background(Color.Green)
            .graphicsLayer(rotationZ = 90f)
    )

    // Draw the top face of the cube
    Box(
        modifier = Modifier
            .fillMaxSize()
            .background(Color.Red)
            .graphicsLayer(rotationX = 90f)
    )
}

2. 旋转立方体：

@Composable
fun RotatingCube() {
    val rotationState = rememberInfiniteTransition()
    val angle by rotationState.animateFloat(
        initialValue = 0f,
        targetValue = 360f,
        animationSpec = infiniteRepeatable(
            animation = tween(durationMillis = 2000, easing = LinearEasing)
        )
    )

    Box(
        modifier = Modifier
            .fillMaxSize()
            .graphicsLayer(
                rotationX = angle,
                rotationY = angle
            )
    ) {
        Cube()
    }
}

3. 现在你可以在你的用户界面中使用RotatingCube组合函数了：

@Composable
fun MyScreen() {
    RotatingCube()
}

- Raana Yavari