Known direct subclasses

Transitionary modifier. Do not use. This will be removed before the Styles API is stable.

Style represents an opaque type which encodes a description of how to style a node in compose. It is implemented semantically like a lambda which is executed on a StyleScope.

These Style objects allow for styles to be defined similarly to a chain of Modifiers, however these Styles are applied by passing them into a styleable Modifier, or by passing them into an appropriately defined Style parameter of a Composable function.

The primary benefits of Style objects are:

  1. They define their own observation scope, meaning you can read State objects inside of them without risking recomposition. Properties that are changed as a result of the State changing will cause only the minimal invalidation possible (ie, changing background will only cause a redraw)

  2. CompositionLocals can be read inside of them. This allows for many theme-based values to be used in their definition without adding to the capture scope of the lambda.

  3. The StyleScope interface allows for state-based styling to be defined such as "pressed" states or "hover" states or "focus" states.

  4. Transition-based animations of style properties can be done automatically without defining any animated values by leveraging the animate API.

This type will be removed before style becomes stable. It is not yet deprecated to facilitate removing code that was written using the experimental 1.11 version of this API.

import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.style.Style
import androidx.compose.foundation.style.size
import androidx.compose.foundation.style.styleable
import androidx.compose.runtime.Composable
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.unit.dp

// Create a styleable box
@Composable
fun StyleableBox(modifier: Modifier = Modifier, style: Style = Style) {
    Box(modifier = modifier.styleable(null, style))
}

// Style the styleable box to be a 150x150 green box
StyleableBox(
    style = {
        background(Color.Green)
        size(150.dp)
    }
)
import androidx.compose.foundation.clickable
import androidx.compose.foundation.interaction.MutableInteractionSource
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.style.Style
import androidx.compose.foundation.style.animate
import androidx.compose.foundation.style.disabled
import androidx.compose.foundation.style.hovered
import androidx.compose.foundation.style.pressed
import androidx.compose.foundation.style.rememberUpdatedStyleState
import androidx.compose.foundation.style.size
import androidx.compose.foundation.style.styleable
import androidx.compose.runtime.Composable
import androidx.compose.runtime.remember
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.unit.dp

// Create a styleable clickable box
@Composable
fun ClickableStyleableBox(
    onClick: () -> Unit,
    modifier: Modifier = Modifier,
    style: Style = Style,
    enabled: Boolean = true,
) {
    val interactionSource = remember { MutableInteractionSource() }
    val styleState = rememberUpdatedStyleState(interactionSource) { it.isEnabled = enabled }
    Box(
        modifier =
            modifier
                .clickable(interactionSource = interactionSource, onClick = onClick)
                .styleable(styleState, style)
    )
}

ClickableStyleableBox(
    onClick = {},
    style = {
        background(Color.Blue)
        size(150.dp)
        hovered { animate { background(Color.Yellow) } }
        pressed { animate { background(Color.Red) } }
        disabled { animate { background(Color.Gray) } }
    },
)

Summary

Nested types

Public companion functions

open Unit

The single abstract method used to invoke the lambda.

Cmn

Extension functions

infix Style

Transitionary modifier.

Cmn
CommonStyle

Transitionary modifier.

Cmn

Inherited functions

From androidx.compose.foundation.style.CustomStyle
Unit

The single abstract method used to invoke the lambda.

Cmn

Public companion functions

StyleScope.applyStyle

open fun StyleScope.applyStyle(): Unit

The single abstract method used to invoke the lambda. The lambda has ScopeT as its receiver (i.e.this) type.

Extension functions

@ExperimentalFoundationStyleApi
infix fun Style.then(other: Style): Style

Transitionary modifier. Do not use. This will be removed before the Styles API is stable.

Merges this styles with another. The style to the right on the then will overwrite the properties set by the style to the left.

Parameters
other: Style

the style to merge into the receiver.

Style.toCommonStyle

@ExperimentalFoundationStyleApi
fun Style.toCommonStyle(): CommonStyle

Transitionary modifier. Do not use. This will be removed before the Styles API is stable.

Convert a Style into a CommonStyle for use by the StyleResolver.

This function will be removed before style becomes stable. It is not yet deprecated to facilitate removing code that was written using the experimental 1.11 version of this API.