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

Question

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

我想画一个立方体并旋转它。除了这个
之外，我可以找到任何示例或教程。

但这对我来说太难了。

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.您现在可以在 UI 中使用 RotatingCube 可组合项：

@Composable
fun MyScreen() {
    RotatingCube()
}