{% setvar book_path %}/reference/androidx/_book.yaml{% endsetvar %} {% include "_shared/_reference-head-tags.html" %}

RowKt

public final class RowKt


Summary

Public methods

static final void
@Composable
Row(
    @NonNull Modifier modifier,
    @NonNull Arrangement.Horizontal horizontalArrangement,
    @NonNull Alignment.Vertical verticalAlignment,
    @Composable @ExtensionFunctionType @NonNull Function1<@NonNull RowScopeUnit> content
)

A layout composable that places its children in a horizontal sequence.

Public methods

Row

@Composable
public static final void Row(
    @NonNull Modifier modifier,
    @NonNull Arrangement.Horizontal horizontalArrangement,
    @NonNull Alignment.Vertical verticalAlignment,
    @Composable @ExtensionFunctionType @NonNull Function1<@NonNull RowScopeUnit> content
)

A layout composable that places its children in a horizontal sequence. For a layout composable that places its children in a vertical sequence, see Column. Note that by default items do not scroll; see Modifier.horizontalScroll to add this behavior. For a horizontally scrollable list that only composes and lays out the currently visible items see LazyRow.

The Row layout is able to assign children widths according to their weights provided using the RowScope.weight modifier. If a child is not provided a weight, it will be asked for its preferred width before the sizes of the children with weights are calculated proportionally to their weight based on the remaining available space. Note that if the Row is horizontally scrollable or part of a horizontally scrollable container, any provided weights will be disregarded as the remaining available space will be infinite.

When none of its children have weights, a Row will be as small as possible to fit its children one next to the other. In order to change the width of the Row, use the Modifier.width modifiers; e.g. to make it fill the available width Modifier.fillMaxWidth can be used. If at least one child of a Row has a weight, the Row will fill the available width, so there is no need for Modifier.fillMaxWidth. However, if Row's size should be limited, the Modifier.width or Modifier.size layout modifiers should be applied.

When the size of the Row is larger than the sum of its children sizes, a horizontalArrangement can be specified to define the positioning of the children inside the Row. See Arrangement for available positioning behaviors; a custom arrangement can also be defined using the constructor of Arrangement. Below is an illustration of different horizontal arrangements:

Row arrangements

Example usage:

import androidx.compose.foundation.background
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.height
import androidx.compose.foundation.layout.size
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.unit.dp
import androidx.compose.ui.unit.sp

Row {
    // The child with no weight will have the specified size.
    Box(Modifier.size(40.dp, 80.dp).background(Color.Magenta))
    // Has weight, the child will occupy half of the remaining width.
    Box(Modifier.height(40.dp).weight(1f).background(Color.Yellow))
    // Has weight and does not fill, the child will occupy at most half of the remaining width.
    // Therefore it will occupy 80.dp (its preferred width) if the assigned width is larger.
    Box(
        Modifier.size(80.dp, 40.dp)
            .weight(1f, fill = false)
            .background(Color.Green)
    )
}
Parameters
@NonNull Modifier modifier

The modifier to be applied to the Row.

@NonNull Arrangement.Horizontal horizontalArrangement

The horizontal arrangement of the layout's children.

@NonNull Alignment.Vertical verticalAlignment

The vertical alignment of the layout's children.

See also
Column
LazyRow