The second Android 11 Developer Preview is now available, test it out and share your feedback.

LayoutGravity

object LayoutGravity
kotlin.Any
   ↳ androidx.ui.layout.LayoutGravity

Provides scope-dependent alignment options for children layouts where the alignment is handled by the parent layout rather than the child itself. Different layout models allow different LayoutGravity options. For example, Row provides Top and Bottom, while Column provides Start and End. Unlike LayoutAlign, layout children with LayoutGravity are aligned only after the size of the parent is known, therefore not affecting the size of the parent in order to achieve their own alignment.

Example usage:

import androidx.ui.foundation.Box
import androidx.ui.layout.LayoutSize
import androidx.ui.layout.Row

Row(LayoutHeight.Fill) {
    // The child with no gravity modifier is positioned by default so that its top edge is
    // aligned to the top of the vertical axis.
    Box(LayoutSize(80.dp, 40.dp), backgroundColor = Color.Magenta)
    // Gravity.Top, the child will be positioned so that its top edge is aligned to the top
    // of the vertical axis.
    Box(LayoutSize(80.dp, 40.dp) + LayoutGravity.Top, backgroundColor = Color.Red)
    // Gravity.Center, the child will be positioned so that its center is in the middle of
    // the vertical axis.
    Box(LayoutSize(80.dp, 40.dp) + LayoutGravity.Center, backgroundColor = Color.Yellow)
    // Gravity.Bottom, the child will be positioned so that its bottom edge is aligned to the
    // bottom of the vertical axis.
    Box(LayoutSize(80.dp, 40.dp) + LayoutGravity.Bottom, backgroundColor = Color.Green)
}
import androidx.ui.foundation.Box
import androidx.ui.layout.Column
import androidx.ui.layout.LayoutSize

Column(LayoutWidth.Fill) {
    // The child with no gravity modifier is positioned by default so that its start edge
    // aligned with the start edge of the horizontal axis.
    Box(LayoutSize(80.dp, 40.dp), backgroundColor = Color.Magenta)
    // Gravity.Start, the child will be positioned so that its start edge is aligned with
    // the start edge of the horizontal axis.
    Box(LayoutSize(80.dp, 40.dp) + LayoutGravity.Start, backgroundColor = Color.Red)
    // Gravity.Center, the child will be positioned so that its center is in the middle of
    // the horizontal axis.
    Box(LayoutSize(80.dp, 40.dp) + LayoutGravity.Center, backgroundColor = Color.Yellow)
    // Gravity.End, the child will be positioned so that its end edge aligned to the end of
    // the horizontal axis.
    Box(LayoutSize(80.dp, 40.dp) + LayoutGravity.End, backgroundColor = Color.Green)
}

Summary

Extension properties

From androidx.ui.layout.RowScope
ParentDataModifier

A layout modifier within a Row that positions target component vertically such that its bottom edge is aligned to the bottom edge of the Row.

ParentDataModifier

A layout modifier within a Row that positions target component vertically such that its center is in the middle of the Row.

ParentDataModifier

A layout modifier within a Row that positions its target component vertically such that its top edge is aligned to the top edge of the Row.

From androidx.ui.layout.StackScope
ParentDataModifier

A layout modifier that defines that child should be positioned bottom-center inside the Stack.

ParentDataModifier

A layout modifier that defines that child should be positioned bottom-end inside the Stack.

ParentDataModifier

A layout modifier that defines that child should be positioned bottom-start inside the Stack.

ParentDataModifier

A layout modifier that defines that child should be positioned in the center of the Stack.

ParentDataModifier

A layout modifier that defines that child should be positioned center-end inside the Stack.

ParentDataModifier

A layout modifier that defines that child should be positioned center-start inside the Stack.

ParentDataModifier

A layout modifier within a Stack that makes the target component to occupy the whole space occupied by the Stack.

ParentDataModifier

A layout modifier that defines that child should be positioned top-center inside the Stack.

ParentDataModifier

A layout modifier that defines that child should be positioned top-end inside the Stack.

ParentDataModifier

A layout modifier that defines that child should be positioned top-start inside the Stack.

From androidx.ui.layout.ColumnScope
ParentDataModifier

A layout modifier within a Column that positions its target component horizontally such that its center is in the middle of the Column.

ParentDataModifier

A layout modifier within a Column that positions its target component horizontally such that its end edge is aligned to the end edge of the Column.

ParentDataModifier

A layout modifier within a Column that positions its target component horizontally such that its start edge is aligned to the start edge of the Column.