Start native apps faster with the Composables CLI ->
Composable Function

Orbiter

A composable that creates an orbiter along the top or bottom edges of a view.

OrbiterBottomBarSample

@Sampled
@Composable
@SubspaceComposable
public fun OrbiterBottomBarSample() {
    SpatialPanel(SubspaceModifier.width(400.dp).height(300.dp)) {
        // Place a horizontal bar orbiter at the bottom-center edge of the panel.
        Orbiter(
            alignment =
                OrbiterAlignment.BottomCenter(
                    offset = DpVolumeOffset(0.dp, (-20).dp, OrbiterDefaults.Elevation),
                    edgeOffsetType = OrbiterEdgeOffsetType.OuterEdge,
                )
        ) {
            Box(
                modifier = Modifier.size(200.dp, 64.dp).background(Color.DarkGray),
                contentAlignment = Alignment.Center,
            ) {
                Text("Bottom Bar", color = Color.White, fontSize = 18.sp)
            }
        }
    }
}

OrbiterSideRailSample

@Sampled
@Composable
@SubspaceComposable
public fun OrbiterSideRailSample() {
    SpatialPanel(SubspaceModifier.width(400.dp).height(300.dp)) {
        // Place a vertical rail orbiter at the end-center (usually right) edge of the panel.
        Orbiter(
            alignment =
                OrbiterAlignment.CenterEnd(
                    offset = DpVolumeOffset(24.dp, 0.dp, OrbiterDefaults.Elevation),
                    edgeOffsetType = OrbiterEdgeOffsetType.OuterEdge,
                )
        ) {
            Box(
                modifier = Modifier.size(64.dp, 200.dp).background(Color.DarkGray),
                contentAlignment = Alignment.Center,
            ) {
                Text("Rail", color = Color.White, fontSize = 18.sp)
            }
        }
    }
}