public interface LayoutModifier

Known direct subclasses
LayoutModifier.Companion

The companion object LayoutModifier is the empty, default, or starter LayoutModifier that contains no elements.

LayoutModifier.Element

A single element contained within a LayoutModifier chain.


An ordered, immutable collection of modifier elements that decorate or add behavior to ProtoLayout layout elements. For example, backgrounds, padding and click actions. When a single modifier is applied multiple times, the last one wins.

import androidx.wear.protolayout.material3.button
import androidx.wear.protolayout.material3.icon
import androidx.wear.protolayout.material3.iconEdgeButton
import androidx.wear.protolayout.material3.materialScope
import androidx.wear.protolayout.material3.text
import androidx.wear.protolayout.modifiers.LayoutModifier
import androidx.wear.protolayout.modifiers.clickable
import androidx.wear.protolayout.modifiers.contentDescription

materialScope(context, deviceConfiguration) {
        iconEdgeButton(
            onClick = clickable,
            modifier = LayoutModifier.contentDescription("Description of a button")
        ) {
            icon(protoLayoutResourceId = "id")
        }
    }

Summary

Nested types

public static class LayoutModifier.Companion implements LayoutModifier

The companion object LayoutModifier is the empty, default, or starter LayoutModifier that contains no elements.

public interface LayoutModifier.Element extends LayoutModifier

A single element contained within a LayoutModifier chain.

Public methods

abstract @NonNull R
<R extends Object> foldIn(
    @NonNull R initial,
    @NonNull Function2<@NonNull R, @NonNull LayoutModifier.Element, @NonNull R> operation
)

Accumulates a value starting with initial and applying operation to the current value and each element from outside in.

default @NonNull LayoutModifier

Concatenates this modifier with another.

Extension functions

default final @NonNull LayoutModifier
BackgroundKt.background(
    @NonNull LayoutModifier receiver,
    @NonNull LayoutColor color,
    ModifiersBuilders.Corner corner
)

Sets the background color and clipping.

default final @NonNull LayoutModifier

Sets the background color to color.

default final @NonNull LayoutModifier

Clips the element to a rounded rectangle with corners specified in corner.

default final @NonNull LayoutModifier
BackgroundKt.clip(
    @NonNull LayoutModifier receiver,
    @Dimension(unit = 0) float cornerRadius
)

Clips the element to a rounded rectangle with four corners with cornerRadius radius.

default final @NonNull LayoutModifier
@RequiresSchemaVersion(major = 1, minor = 400)
BackgroundKt.clip(
    @NonNull LayoutModifier receiver,
    @Dimension(unit = 0) float x,
    @Dimension(unit = 0) float y
)

Clips the element to a rounded shape with x as the radius on the horizontal axis and y as the radius on the vertical axis for the four corners.

default final @NonNull LayoutModifier
@RequiresSchemaVersion(major = 1, minor = 400)
BackgroundKt.clipBottomLeft(
    @NonNull LayoutModifier receiver,
    @Dimension(unit = 0) float x,
    @Dimension(unit = 0) float y
)

Clips the bottom left corner of the element with x as the radius on the horizontal axis and y as the radius on the vertical axis.

default final @NonNull LayoutModifier
@RequiresSchemaVersion(major = 1, minor = 400)
BackgroundKt.clipBottomRight(
    @NonNull LayoutModifier receiver,
    @Dimension(unit = 0) float x,
    @Dimension(unit = 0) float y
)

Clips the bottom right corner of the element with x as the radius on the horizontal axis and y as the radius on the vertical axis.

default final @NonNull LayoutModifier
@RequiresSchemaVersion(major = 1, minor = 400)
BackgroundKt.clipTopLeft(
    @NonNull LayoutModifier receiver,
    @Dimension(unit = 0) float x,
    @Dimension(unit = 0) float y
)

Clips the top left corner of the element with x as the radius on the horizontal axis and y as the radius on the vertical axis.

default final @NonNull LayoutModifier
@RequiresSchemaVersion(major = 1, minor = 400)
BackgroundKt.clipTopRight(
    @NonNull LayoutModifier receiver,
    @Dimension(unit = 0) float x,
    @Dimension(unit = 0) float y
)

Clips the top right corner of the element with x as the radius on the horizontal axis and y as the radius on the vertical axis.

default final @NonNull LayoutModifier

Adds the clickable property of the modified element.

default final @NonNull LayoutModifier
ClickableKt.clickable(
    @NonNull LayoutModifier receiver,
    @NonNull ActionBuilders.Action action,
    String id
)

Adds the clickable property of the modified element.

default final @NonNull LayoutModifier
@RequiresSchemaVersion(major = 1, minor = 300)
ClickableKt.minimumTouchTargetSize(
    @NonNull LayoutModifier receiver,
    @Dimension(unit = 0) float minWidth,
    @Dimension(unit = 0) float minHeight
)

Sets the minimum width and height of the clickable area.

default final @NonNull ModifiersBuilders.Modifiers

Creates a ModifiersBuilders.Modifiers from a LayoutModifier.

default final @NonNull LayoutModifier
PaddingKt.padding(
    @NonNull LayoutModifier receiver,
    @Dimension(unit = 0) float all
)

Applies all dp of additional space along each edge of the content, left, top, right and bottom.

default final @NonNull LayoutModifier

Applies additional space along each edge of the content.

default final @NonNull LayoutModifier
PaddingKt.padding(
    @NonNull LayoutModifier receiver,
    @Dimension(unit = 0) float horizontal,
    @Dimension(unit = 0) float vertical
)

Applies horizontal dp of additional space along the left and right edges of the content and vertical dp of additional space along the top and bottom edges of the content.

default final @NonNull LayoutModifier
PaddingKt.padding(
    @NonNull LayoutModifier receiver,
    @Dimension(unit = 0) float start,
    @Dimension(unit = 0) float top,
    @Dimension(unit = 0) float end,
    @Dimension(unit = 0) float bottom,
    boolean rtlAware
)

Applies additional space along each edge of the content in DP: start, top, end and bottom

default final @NonNull LayoutModifier
SemanticsKt.contentDescription(
    @NonNull LayoutModifier receiver,
    @NonNull String staticValue,
    @RequiresSchemaVersion(major = 1, minor = 200) DynamicBuilders.DynamicString dynamicValue
)

Adds content description to be read by Talkback.

default final @NonNull LayoutModifier
SemanticsKt.semanticsRole(
    @NonNull LayoutModifier receiver,
    int semanticsRole
)

Adds the semantic role of user interface element.

Public methods

foldIn

Added in 1.3.0-alpha06
abstract @NonNull R <R extends Object> foldIn(
    @NonNull R initial,
    @NonNull Function2<@NonNull R, @NonNull LayoutModifier.Element, @NonNull R> operation
)

Accumulates a value starting with initial and applying operation to the current value and each element from outside in.

Elements wrap one another in a chain from left to right; an Element that appears to the left of another in a + expression or in operation's parameter order affects all of the elements that appear after it. foldIn may be used to accumulate a value starting from the parent or head of the modifier chain to the final wrapped child.

then

Added in 1.3.0-alpha06
default @NonNull LayoutModifier then(@NonNull LayoutModifier other)

Concatenates this modifier with another.

Returns a LayoutModifier representing this modifier followed by other in sequence.

Extension functions

BackgroundKt.background

default final @NonNull LayoutModifier BackgroundKt.background(
    @NonNull LayoutModifier receiver,
    @NonNull LayoutColor color,
    ModifiersBuilders.Corner corner
)

Sets the background color and clipping.

Parameters
@NonNull LayoutColor color

for the background

ModifiersBuilders.Corner corner

to use for clipping the background

BackgroundKt.backgroundColor

default final @NonNull LayoutModifier BackgroundKt.backgroundColor(
    @NonNull LayoutModifier receiver,
    @NonNull LayoutColor color
)

Sets the background color to color.

default final @NonNull LayoutModifier BackgroundKt.clip(
    @NonNull LayoutModifier receiver,
    @NonNull ModifiersBuilders.Corner corner
)

Clips the element to a rounded rectangle with corners specified in corner.

default final @NonNull LayoutModifier BackgroundKt.clip(
    @NonNull LayoutModifier receiver,
    @Dimension(unit = 0) float cornerRadius
)

Clips the element to a rounded rectangle with four corners with cornerRadius radius.

@RequiresSchemaVersion(major = 1, minor = 400)
default final @NonNull LayoutModifier BackgroundKt.clip(
    @NonNull LayoutModifier receiver,
    @Dimension(unit = 0) float x,
    @Dimension(unit = 0) float y
)

Clips the element to a rounded shape with x as the radius on the horizontal axis and y as the radius on the vertical axis for the four corners.

BackgroundKt.clipBottomLeft

@RequiresSchemaVersion(major = 1, minor = 400)
default final @NonNull LayoutModifier BackgroundKt.clipBottomLeft(
    @NonNull LayoutModifier receiver,
    @Dimension(unit = 0) float x,
    @Dimension(unit = 0) float y
)

Clips the bottom left corner of the element with x as the radius on the horizontal axis and y as the radius on the vertical axis.

BackgroundKt.clipBottomRight

@RequiresSchemaVersion(major = 1, minor = 400)
default final @NonNull LayoutModifier BackgroundKt.clipBottomRight(
    @NonNull LayoutModifier receiver,
    @Dimension(unit = 0) float x,
    @Dimension(unit = 0) float y
)

Clips the bottom right corner of the element with x as the radius on the horizontal axis and y as the radius on the vertical axis.

BackgroundKt.clipTopLeft

@RequiresSchemaVersion(major = 1, minor = 400)
default final @NonNull LayoutModifier BackgroundKt.clipTopLeft(
    @NonNull LayoutModifier receiver,
    @Dimension(unit = 0) float x,
    @Dimension(unit = 0) float y
)

Clips the top left corner of the element with x as the radius on the horizontal axis and y as the radius on the vertical axis.

BackgroundKt.clipTopRight

@RequiresSchemaVersion(major = 1, minor = 400)
default final @NonNull LayoutModifier BackgroundKt.clipTopRight(
    @NonNull LayoutModifier receiver,
    @Dimension(unit = 0) float x,
    @Dimension(unit = 0) float y
)

Clips the top right corner of the element with x as the radius on the horizontal axis and y as the radius on the vertical axis.

ClickableKt.clickable

default final @NonNull LayoutModifier ClickableKt.clickable(
    @NonNull LayoutModifier receiver,
    @NonNull ModifiersBuilders.Clickable clickable
)

Adds the clickable property of the modified element. It allows the modified element to have actions associated with it, which will be executed when the element is tapped.

ClickableKt.clickable

default final @NonNull LayoutModifier ClickableKt.clickable(
    @NonNull LayoutModifier receiver,
    @NonNull ActionBuilders.Action action,
    String id
)

Adds the clickable property of the modified element. It allows the modified element to have actions associated with it, which will be executed when the element is tapped.

Parameters
@NonNull ActionBuilders.Action action

is triggered whenever the element is tapped. By default adds an empty LoadAction.

String id

is the associated identifier for this clickable. This will be passed to the action handler.

ClickableKt.minimumTouchTargetSize

@RequiresSchemaVersion(major = 1, minor = 300)
default final @NonNull LayoutModifier ClickableKt.minimumTouchTargetSize(
    @NonNull LayoutModifier receiver,
    @Dimension(unit = 0) float minWidth,
    @Dimension(unit = 0) float minHeight
)

Sets the minimum width and height of the clickable area. The default value is 48dp, following the Material design accessibility guideline. Note that this value does not affect the layout, so the minimum clickable width/height is not guaranteed unless there is enough space around the element within its parent bounds.

default final @NonNull LayoutModifier PaddingKt.padding(
    @NonNull LayoutModifier receiver,
    @Dimension(unit = 0) float all
)

Applies all dp of additional space along each edge of the content, left, top, right and bottom.

default final @NonNull LayoutModifier PaddingKt.padding(
    @NonNull LayoutModifier receiver,
    @NonNull ModifiersBuilders.Padding padding
)

Applies additional space along each edge of the content.

default final @NonNull LayoutModifier PaddingKt.padding(
    @NonNull LayoutModifier receiver,
    @Dimension(unit = 0) float horizontal,
    @Dimension(unit = 0) float vertical
)

Applies horizontal dp of additional space along the left and right edges of the content and vertical dp of additional space along the top and bottom edges of the content.

default final @NonNull LayoutModifier PaddingKt.padding(
    @NonNull LayoutModifier receiver,
    @Dimension(unit = 0) float start,
    @Dimension(unit = 0) float top,
    @Dimension(unit = 0) float end,
    @Dimension(unit = 0) float bottom,
    boolean rtlAware
)

Applies additional space along each edge of the content in DP: start, top, end and bottom

Parameters
@Dimension(unit = 0) float start

The padding on the start of the content, depending on the layout direction, in DP and the value of rtlAware.

@Dimension(unit = 0) float top

The padding at the top, in DP.

@Dimension(unit = 0) float end

The padding on the end of the content, depending on the layout direction, in DP and the value of rtlAware.

@Dimension(unit = 0) float bottom

The padding at the bottom, in DP.

boolean rtlAware

specifies whether the start/end padding is aware of RTL support. If true, the values for start/end will follow the layout direction (i.e. start will refer to the right hand side of the container if the device is using an RTL locale). If false, start/end will always map to left/right, accordingly.

SemanticsKt.contentDescription

default final @NonNull LayoutModifier SemanticsKt.contentDescription(
    @NonNull LayoutModifier receiver,
    @NonNull String staticValue,
    @RequiresSchemaVersion(major = 1, minor = 200) DynamicBuilders.DynamicString dynamicValue
)

Adds content description to be read by Talkback.

Parameters
@NonNull String staticValue

The static content description. This value will be used if dynamicValue is null, or if can't be resolved.

@RequiresSchemaVersion(major = 1, minor = 200) DynamicBuilders.DynamicString dynamicValue

The dynamic content description. This is useful when content of the element itself is dynamic.

SemanticsKt.semanticsRole

default final @NonNull LayoutModifier SemanticsKt.semanticsRole(
    @NonNull LayoutModifier receiver,
    int semanticsRole
)

Adds the semantic role of user interface element. Accessibility services might use this to describe the element or do customizations.