# SpatialArrangement

Artifact: [androidx.xr.compose:compose](https://developer.android.com/jetpack/androidx/releases/xr-compose) [View Source](https://cs.android.com/search?q=file:androidx/xr/compose/subspace/layout/SpatialArrangement.kt+class:androidx.xr.compose.subspace.layout.SpatialArrangement) Added in [1.0.0-beta02](https://developer.android.com/jetpack/androidx/releases/xr-compose#1.0.0-beta02)


```
object SpatialArrangement
```

<br />

*** ** * ** ***

Used to specify the arrangement of the layout's children in layouts like `https://developer.android.com/reference/kotlin/androidx/xr/compose/subspace/SpatialRow.composable#SpatialRow(androidx.xr.compose.subspace.layout.SubspaceModifier,androidx.xr.compose.subspace.layout.SpatialAlignment.Vertical,androidx.xr.compose.subspace.layout.SpatialAlignment.Depth,androidx.xr.compose.subspace.layout.SpatialArrangement.Horizontal,kotlin.Function1)` or `https://developer.android.com/reference/kotlin/androidx/xr/compose/subspace/SpatialColumn.composable#SpatialColumn(androidx.xr.compose.subspace.layout.SubspaceModifier,androidx.xr.compose.subspace.layout.SpatialAlignment.Horizontal,androidx.xr.compose.subspace.layout.SpatialAlignment.Depth,androidx.xr.compose.subspace.layout.SpatialArrangement.Vertical,kotlin.Function1)` in the main axis direction (horizontal and vertical, respectively).

`https://developer.android.com/reference/kotlin/androidx/xr/compose/subspace/SpatialRow.composable#SpatialRow(androidx.xr.compose.subspace.layout.SubspaceModifier,androidx.xr.compose.subspace.layout.SpatialAlignment.Vertical,androidx.xr.compose.subspace.layout.SpatialAlignment.Depth,androidx.xr.compose.subspace.layout.SpatialArrangement.Horizontal,kotlin.Function1)` supports horizontal arrangements similar to `https://developer.android.com/reference/kotlin/androidx/compose/foundation/layout/Row.composable#Row(androidx.compose.ui.Modifier,androidx.compose.foundation.layout.Arrangement.Horizontal,androidx.compose.ui.Alignment.Vertical,kotlin.Function1)`: ![Row
arrangements](https://developer.android.com/images/reference/androidx/compose/foundation/layout/row_arrangement_visualization.gif)

`https://developer.android.com/reference/kotlin/androidx/xr/compose/subspace/SpatialColumn.composable#SpatialColumn(androidx.xr.compose.subspace.layout.SubspaceModifier,androidx.xr.compose.subspace.layout.SpatialAlignment.Horizontal,androidx.xr.compose.subspace.layout.SpatialAlignment.Depth,androidx.xr.compose.subspace.layout.SpatialArrangement.Vertical,kotlin.Function1)` supports horizontal arrangements similar to `https://developer.android.com/reference/kotlin/androidx/compose/foundation/layout/Column.composable#Column(androidx.compose.ui.Modifier,androidx.compose.foundation.layout.Arrangement.Vertical,androidx.compose.ui.Alignment.Horizontal,kotlin.Function1)`: ![Column
arrangements](https://developer.android.com/images/reference/androidx/compose/foundation/layout/column_arrangement_visualization.gif)

## Summary

| ### Nested types |
|---|
| `object https://developer.android.com/reference/kotlin/androidx/xr/compose/subspace/layout/SpatialArrangement.Absolute` Used to specify arrangement which doesn't change with layout direction. |
| `interface https://developer.android.com/reference/kotlin/androidx/xr/compose/subspace/layout/SpatialArrangement.AxisIndependent : https://developer.android.com/reference/kotlin/androidx/xr/compose/subspace/layout/SpatialArrangement.Horizontal, https://developer.android.com/reference/kotlin/androidx/xr/compose/subspace/layout/SpatialArrangement.Vertical` Used to specify the horizontal arrangement of the layout's children in horizontal layouts like `https://developer.android.com/reference/kotlin/androidx/xr/compose/subspace/SpatialRow.composable#SpatialRow(androidx.xr.compose.subspace.layout.SubspaceModifier,androidx.xr.compose.subspace.layout.SpatialAlignment.Vertical,androidx.xr.compose.subspace.layout.SpatialAlignment.Depth,androidx.xr.compose.subspace.layout.SpatialArrangement.Horizontal,kotlin.Function1)`, or the vertical arrangement of the layout's children in vertical layouts like `https://developer.android.com/reference/kotlin/androidx/xr/compose/subspace/SpatialColumn.composable#SpatialColumn(androidx.xr.compose.subspace.layout.SubspaceModifier,androidx.xr.compose.subspace.layout.SpatialAlignment.Horizontal,androidx.xr.compose.subspace.layout.SpatialAlignment.Depth,androidx.xr.compose.subspace.layout.SpatialArrangement.Vertical,kotlin.Function1)`. |
| `interface https://developer.android.com/reference/kotlin/androidx/xr/compose/subspace/layout/SpatialArrangement.Horizontal` Used to specify the horizontal arrangement of the layout's children in layouts like `https://developer.android.com/reference/kotlin/androidx/xr/compose/subspace/SpatialRow.composable#SpatialRow(androidx.xr.compose.subspace.layout.SubspaceModifier,androidx.xr.compose.subspace.layout.SpatialAlignment.Vertical,androidx.xr.compose.subspace.layout.SpatialAlignment.Depth,androidx.xr.compose.subspace.layout.SpatialArrangement.Horizontal,kotlin.Function1)`. |
| `interface https://developer.android.com/reference/kotlin/androidx/xr/compose/subspace/layout/SpatialArrangement.Vertical` Used to specify the vertical arrangement of the layout's children in layouts like `https://developer.android.com/reference/kotlin/androidx/xr/compose/subspace/SpatialColumn.composable#SpatialColumn(androidx.xr.compose.subspace.layout.SubspaceModifier,androidx.xr.compose.subspace.layout.SpatialAlignment.Horizontal,androidx.xr.compose.subspace.layout.SpatialAlignment.Depth,androidx.xr.compose.subspace.layout.SpatialArrangement.Vertical,kotlin.Function1)`. |

| ### Public functions |
|---|---|
| `https://developer.android.com/reference/kotlin/androidx/xr/compose/subspace/layout/SpatialArrangement.Horizontal` | `https://developer.android.com/reference/kotlin/androidx/xr/compose/subspace/layout/SpatialArrangement#aligned(androidx.xr.compose.subspace.layout.SpatialAlignment.Horizontal)(spatialAlignment: https://developer.android.com/reference/kotlin/androidx/xr/compose/subspace/layout/SpatialAlignment.Horizontal)` Children placed next to each other horizontally and align them according to the `https://developer.android.com/reference/kotlin/androidx/xr/compose/subspace/layout/SpatialArrangement#aligned(androidx.xr.compose.subspace.layout.SpatialAlignment.Horizontal)` given. |
| `https://developer.android.com/reference/kotlin/androidx/xr/compose/subspace/layout/SpatialArrangement.Vertical` | `https://developer.android.com/reference/kotlin/androidx/xr/compose/subspace/layout/SpatialArrangement#aligned(androidx.xr.compose.subspace.layout.SpatialAlignment.Vertical)(spatialAlignment: https://developer.android.com/reference/kotlin/androidx/xr/compose/subspace/layout/SpatialAlignment.Vertical)` Children placed next to each other vertically and align them according to the `https://developer.android.com/reference/kotlin/androidx/xr/compose/subspace/layout/SpatialArrangement#aligned(androidx.xr.compose.subspace.layout.SpatialAlignment.Vertical)`. |
| `https://developer.android.com/reference/kotlin/androidx/xr/compose/subspace/layout/SpatialArrangement.AxisIndependent` | `https://developer.android.com/reference/kotlin/androidx/xr/compose/subspace/layout/SpatialArrangement#spacedBy(androidx.compose.ui.unit.Dp)(space: https://developer.android.com/reference/kotlin/androidx/compose/ui/unit/Dp)` Children are placed next to each other with fixed `https://developer.android.com/reference/kotlin/androidx/xr/compose/subspace/layout/SpatialArrangement#spacedBy(androidx.compose.ui.unit.Dp)` between them along the main axis. |
| `https://developer.android.com/reference/kotlin/androidx/xr/compose/subspace/layout/SpatialArrangement.Horizontal` | `https://developer.android.com/reference/kotlin/androidx/xr/compose/subspace/layout/SpatialArrangement#spacedBy(androidx.compose.ui.unit.Dp,androidx.xr.compose.subspace.layout.SpatialAlignment.Horizontal)(space: https://developer.android.com/reference/kotlin/androidx/compose/ui/unit/Dp, spatialAlignment: https://developer.android.com/reference/kotlin/androidx/xr/compose/subspace/layout/SpatialAlignment.Horizontal)` Children are placed next to each other with fixed `https://developer.android.com/reference/kotlin/androidx/xr/compose/subspace/layout/SpatialArrangement#spacedBy(androidx.compose.ui.unit.Dp,androidx.xr.compose.subspace.layout.SpatialAlignment.Horizontal)` between them horizontally and aligned them according to the `https://developer.android.com/reference/kotlin/androidx/xr/compose/subspace/layout/SpatialArrangement#spacedBy(androidx.compose.ui.unit.Dp,androidx.xr.compose.subspace.layout.SpatialAlignment.Horizontal)` given. |
| `https://developer.android.com/reference/kotlin/androidx/xr/compose/subspace/layout/SpatialArrangement.Vertical` | `https://developer.android.com/reference/kotlin/androidx/xr/compose/subspace/layout/SpatialArrangement#spacedBy(androidx.compose.ui.unit.Dp,androidx.xr.compose.subspace.layout.SpatialAlignment.Vertical)(space: https://developer.android.com/reference/kotlin/androidx/compose/ui/unit/Dp, spatialAlignment: https://developer.android.com/reference/kotlin/androidx/xr/compose/subspace/layout/SpatialAlignment.Vertical)` Children are placed next to each other with fixed `https://developer.android.com/reference/kotlin/androidx/xr/compose/subspace/layout/SpatialArrangement#spacedBy(androidx.compose.ui.unit.Dp,androidx.xr.compose.subspace.layout.SpatialAlignment.Vertical)` between them vertically and align them according to the `https://developer.android.com/reference/kotlin/androidx/xr/compose/subspace/layout/SpatialArrangement#spacedBy(androidx.compose.ui.unit.Dp,androidx.xr.compose.subspace.layout.SpatialAlignment.Vertical)` given. |

| ### Public properties |
|---|---|
| `https://developer.android.com/reference/kotlin/androidx/xr/compose/subspace/layout/SpatialArrangement.Vertical` | `https://developer.android.com/reference/kotlin/androidx/xr/compose/subspace/layout/SpatialArrangement#Bottom()` All children should be arranged at the bottom of the column. |
| `https://developer.android.com/reference/kotlin/androidx/xr/compose/subspace/layout/SpatialArrangement.AxisIndependent` | `https://developer.android.com/reference/kotlin/androidx/xr/compose/subspace/layout/SpatialArrangement#Center()` All children should be arranged at the center of the row or column. |
| `https://developer.android.com/reference/kotlin/androidx/xr/compose/subspace/layout/SpatialArrangement.Horizontal` | `https://developer.android.com/reference/kotlin/androidx/xr/compose/subspace/layout/SpatialArrangement#End()` All children should be arranged at the end of the row (right if the layout direction is LTR, right otherwise). |
| `https://developer.android.com/reference/kotlin/androidx/xr/compose/subspace/layout/SpatialArrangement.AxisIndependent` | `https://developer.android.com/reference/kotlin/androidx/xr/compose/subspace/layout/SpatialArrangement#SpaceAround()` There should be equal space around each child. |
| `https://developer.android.com/reference/kotlin/androidx/xr/compose/subspace/layout/SpatialArrangement.AxisIndependent` | `https://developer.android.com/reference/kotlin/androidx/xr/compose/subspace/layout/SpatialArrangement#SpaceBetween()` There should be equal space between the children and no space before the first child or after the last child. |
| `https://developer.android.com/reference/kotlin/androidx/xr/compose/subspace/layout/SpatialArrangement.AxisIndependent` | `https://developer.android.com/reference/kotlin/androidx/xr/compose/subspace/layout/SpatialArrangement#SpaceEvenly()` There should be equal space between the children and before the first child and after the last child. |
| `https://developer.android.com/reference/kotlin/androidx/xr/compose/subspace/layout/SpatialArrangement.Horizontal` | `https://developer.android.com/reference/kotlin/androidx/xr/compose/subspace/layout/SpatialArrangement#Start()` All children should be arranged at the start of the row (left if the layout direction is LTR, right otherwise). |
| `https://developer.android.com/reference/kotlin/androidx/xr/compose/subspace/layout/SpatialArrangement.Vertical` | `https://developer.android.com/reference/kotlin/androidx/xr/compose/subspace/layout/SpatialArrangement#Top()` All children should be arranged at the top of the column. |

## Public functions

### aligned

Added in [1.0.0-beta02](https://developer.android.com/jetpack/androidx/releases/xr-compose#1.0.0-beta02)

```
fun aligned(spatialAlignment: SpatialAlignment.Horizontal): SpatialArrangement.Horizontal
```

Children placed next to each other horizontally and align them according to the `https://developer.android.com/reference/kotlin/androidx/xr/compose/subspace/layout/SpatialArrangement#aligned(androidx.xr.compose.subspace.layout.SpatialAlignment.Horizontal)` given.

| Parameters |
|---|---|
| `spatialAlignment: https://developer.android.com/reference/kotlin/androidx/xr/compose/subspace/layout/SpatialAlignment.Horizontal` | `https://developer.android.com/reference/kotlin/androidx/xr/compose/subspace/layout/SpatialAlignment.Horizontal` to align the children with. |

### aligned

Added in [1.0.0-beta02](https://developer.android.com/jetpack/androidx/releases/xr-compose#1.0.0-beta02)

```
fun aligned(spatialAlignment: SpatialAlignment.Vertical): SpatialArrangement.Vertical
```

Children placed next to each other vertically and align them according to the `https://developer.android.com/reference/kotlin/androidx/xr/compose/subspace/layout/SpatialArrangement#aligned(androidx.xr.compose.subspace.layout.SpatialAlignment.Vertical)`.

| Parameters |
|---|---|
| `spatialAlignment: https://developer.android.com/reference/kotlin/androidx/xr/compose/subspace/layout/SpatialAlignment.Vertical` | `https://developer.android.com/reference/kotlin/androidx/xr/compose/subspace/layout/SpatialAlignment.Vertical` to align the children with. |

### spacedBy

Added in [1.0.0-beta02](https://developer.android.com/jetpack/androidx/releases/xr-compose#1.0.0-beta02)

```
fun spacedBy(space: Dp): SpatialArrangement.AxisIndependent
```

Children are placed next to each other with fixed `https://developer.android.com/reference/kotlin/androidx/xr/compose/subspace/layout/SpatialArrangement#spacedBy(androidx.compose.ui.unit.Dp)` between them along the main axis.

| Parameters |
|---|---|
| `space: https://developer.android.com/reference/kotlin/androidx/compose/ui/unit/Dp` | fixed space `https://developer.android.com/reference/kotlin/androidx/compose/ui/unit/Dp` to place between adjacent children. |

### spacedBy

Added in [1.0.0-beta02](https://developer.android.com/jetpack/androidx/releases/xr-compose#1.0.0-beta02)

```
fun spacedBy(space: Dp, spatialAlignment: SpatialAlignment.Horizontal): SpatialArrangement.Horizontal
```

Children are placed next to each other with fixed `https://developer.android.com/reference/kotlin/androidx/xr/compose/subspace/layout/SpatialArrangement#spacedBy(androidx.compose.ui.unit.Dp,androidx.xr.compose.subspace.layout.SpatialAlignment.Horizontal)` between them horizontally and aligned them according to the `https://developer.android.com/reference/kotlin/androidx/xr/compose/subspace/layout/SpatialArrangement#spacedBy(androidx.compose.ui.unit.Dp,androidx.xr.compose.subspace.layout.SpatialAlignment.Horizontal)` given.

| Parameters |
|---|---|
| `space: https://developer.android.com/reference/kotlin/androidx/compose/ui/unit/Dp` | fixed space `https://developer.android.com/reference/kotlin/androidx/compose/ui/unit/Dp` to place between adjacent children. |
| `spatialAlignment: https://developer.android.com/reference/kotlin/androidx/xr/compose/subspace/layout/SpatialAlignment.Horizontal` | `https://developer.android.com/reference/kotlin/androidx/xr/compose/subspace/layout/SpatialAlignment.Horizontal` to align the children with. |

### spacedBy

Added in [1.0.0-beta02](https://developer.android.com/jetpack/androidx/releases/xr-compose#1.0.0-beta02)

```
fun spacedBy(space: Dp, spatialAlignment: SpatialAlignment.Vertical): SpatialArrangement.Vertical
```

Children are placed next to each other with fixed `https://developer.android.com/reference/kotlin/androidx/xr/compose/subspace/layout/SpatialArrangement#spacedBy(androidx.compose.ui.unit.Dp,androidx.xr.compose.subspace.layout.SpatialAlignment.Vertical)` between them vertically and align them according to the `https://developer.android.com/reference/kotlin/androidx/xr/compose/subspace/layout/SpatialArrangement#spacedBy(androidx.compose.ui.unit.Dp,androidx.xr.compose.subspace.layout.SpatialAlignment.Vertical)` given.

| Parameters |
|---|---|
| `space: https://developer.android.com/reference/kotlin/androidx/compose/ui/unit/Dp` | fixed space `https://developer.android.com/reference/kotlin/androidx/compose/ui/unit/Dp` to place between adjacent children. |
| `spatialAlignment: https://developer.android.com/reference/kotlin/androidx/xr/compose/subspace/layout/SpatialAlignment.Vertical` | `https://developer.android.com/reference/kotlin/androidx/xr/compose/subspace/layout/SpatialAlignment.Vertical` to align the children with. |

## Public properties

### Bottom

Added in [1.0.0-beta02](https://developer.android.com/jetpack/androidx/releases/xr-compose#1.0.0-beta02)

```
val Bottom: SpatialArrangement.Vertical
```

All children should be arranged at the bottom of the column. Visually: (top) ####123 (bottom)

### Center

Added in [1.0.0-beta02](https://developer.android.com/jetpack/androidx/releases/xr-compose#1.0.0-beta02)

```
val Center: SpatialArrangement.AxisIndependent
```

All children should be arranged at the center of the row or column. Visually: ##123## for LTR and ##321## for RTL

### End

Added in [1.0.0-beta02](https://developer.android.com/jetpack/androidx/releases/xr-compose#1.0.0-beta02)

```
val End: SpatialArrangement.Horizontal
```

All children should be arranged at the end of the row (right if the layout direction is LTR, right otherwise). Visually: ####123 for LTR and 321#### for RTL

### SpaceAround

Added in [1.0.0-beta02](https://developer.android.com/jetpack/androidx/releases/xr-compose#1.0.0-beta02)

```
val SpaceAround: SpatialArrangement.AxisIndependent
```

There should be equal space around each child. Visually: #1##2##3# for LTR and #3##2##1# for RTL

### SpaceBetween

Added in [1.0.0-beta02](https://developer.android.com/jetpack/androidx/releases/xr-compose#1.0.0-beta02)

```
val SpaceBetween: SpatialArrangement.AxisIndependent
```

There should be equal space between the children and no space before the first child or after the last child. Visually: 1##2##3 for LTR or 3##2##1 for RTL

### SpaceEvenly

Added in [1.0.0-beta02](https://developer.android.com/jetpack/androidx/releases/xr-compose#1.0.0-beta02)

```
val SpaceEvenly: SpatialArrangement.AxisIndependent
```

There should be equal space between the children and before the first child and after the last child. Visually: #1#2#3# for LTR and #3#2#1# for RTL

### Start

Added in [1.0.0-beta02](https://developer.android.com/jetpack/androidx/releases/xr-compose#1.0.0-beta02)

```
val Start: SpatialArrangement.Horizontal
```

All children should be arranged at the start of the row (left if the layout direction is LTR, right otherwise). Visually: 123#### for LTR and ####321 for RTL

### Top

Added in [1.0.0-beta02](https://developer.android.com/jetpack/androidx/releases/xr-compose#1.0.0-beta02)

```
val Top: SpatialArrangement.Vertical
```

All children should be arranged at the top of the column. Visually: (top) 123#### (bottom)