Function

movable

When the movable modifier is present and enabled, draggable UI controls will be shown that allow the user to move the element in 3D space.

BasicMovableSample

/** A sample demonstrating a simple movable component. */
@SubspaceComposable
@Composable
public fun BasicMovableSample() {
    SpatialPanel(modifier = SubspaceModifier.movable()) { Text("The user can move me around!") }
}

CustomMovableSample

/** A sample demonstrating a custom movable component. */
@SubspaceComposable
@Composable
public fun CustomMovableSample() {
    var offsetX by remember { mutableStateOf(0.dp) }
    var offsetY by remember { mutableStateOf(0.dp) }
    var offsetZ by remember { mutableStateOf(0.dp) }
    var rotation by remember { mutableStateOf(Quaternion.Identity) }
    SpatialPanel(
        modifier =
            SubspaceModifier.movable {
                    offsetX = it.pose.translation.x.meters.toDp()
                    offsetY = it.pose.translation.y.meters.toDp()
                    offsetZ = it.pose.translation.z.meters.toDp()
                    rotation = it.pose.rotation
                    true // return true to prevent default behavior
                }
                .offset(x = offsetX, y = offsetY, z = offsetZ)
                .rotate(rotation)
    ) {
        Text("The user can move me around!")
    }
}

Last updated: