androidx.compose.foundation.style

Interfaces

AlphaScope

An interface that introduces the alpha property to a Style receiver scope.

Cmn
AnimateStyleScope

An interface that introduces animate functions to a Style receiver scope.

Cmn
BackgroundScope

An interface that introduces the background property to a Style receiver scope.

Cmn
BaselineShiftScope

An interface that introduces the baselineShift property to a Style receiver scope.

Cmn
BorderScope

An interface that introduces border properties to a Style receiver scope interface.

Cmn
ClipScope

An interface that introduces the clip property to a Style receiver scope.

Cmn
ColorFilterScope

An interface the introduces the colorFilter property to a Style receiver scope.

Cmn
CommonStyle

The CommonStyle is the style all style types must be converted to be resolved by the StyleResolver.

Cmn
CommonStyleScope

A CommonStyleScope is the scope used by a CommonStyle.

Cmn
ContentColorScope

An interface that introduces the contentColor property to a Style receiver scope.

Cmn
ContentPaddingScope

An interface that introduces the contentPadding property to a Style receiver scope interface.

Cmn
CustomStyle

A base type for custom styles including CommonStyle.

Cmn
CustomStyleScope

An interface that is the base interface for all styles scopes.

Cmn
DrawStyleScope

An interface that introduces the drawing property to a Style receiver scope.

Cmn
ExternalPaddingScope

An interface that introduces the externalPadding properties to a Style receiver scope interface.

Cmn
FontFamilyScope

An interface that introduces the fontFamily property to a Style receiver scope.

Cmn
FontSizeScope

An interface that introduces the fontSize property to a Style receiver scope.

Cmn
FontStyleScope

An interface that introduces the fontStyle property to a Style receiver scope.

Cmn
FontSynthesisScope

An interface that introduces the fontSynthesis property to a Style receiver scope.

Cmn
FontWeightScope

An interface that introduces the fontWeight property to a Style receiver scope.

Cmn
ForegroundScope

An interface that introduces the foreground property to a Style receiver scope.

Cmn
HyphensScope

An interface that introduces the hyphens property to a Style receiver scope.

Cmn
LayerStyleScope

An interface that introduces the graphics layer property to a Style receiver scope.

Cmn
LayoutStyleScope

An interface that introduces the layout properties to a Style receiver scope.

Cmn
LetterSpacingScope

An interface that introduces the letterSpacing property to a Style receiver scope.

Cmn
LineBreakScope

An interface that introduces the lineBreak property to a Style receiver scope.

Cmn
LineHeightScope

An interface that introduces the lineHeight property to a Style receiver scope.

Cmn
MaxSizeScope

An interface that introduces maxWidth and maxHeight properties to a Style receiver scope.

Cmn
MinSizeScope

An interface that introduces min size properties to a Style receiver scope interface.

Cmn
NestedStyleConsumerStyleScope

A scope that allows applying a style defined in a parent style.

Cmn
NestedStyleProviderStyleScope

A scope that allows providing a nested style that will be read and used by a nested styleable composable function.

Cmn
PositionScope

An interface that introduces position properties to a Style receiver scope interface.

Cmn
RotationScope

An interface that introduces the rotation properties to a Style receiver scope.

Cmn
ScaleScope

An interface that introduces the scaleX and scaleY properties to a Style receiver scope.

Cmn
ShadowScope

An interface that introduces the shadow properties to a Style receiver scope.

Cmn
ShapeScope

An interface that introduces the shape property to a Style receiver scope.

Cmn
SizeScope

An interface that introduces size properties to a Style receiver scope interface.

Cmn
Style

Transitionary modifier.

Cmn
StylePropertyAccessorScope

Provides access to resolved style property values.

Cmn
StylePropertyProviderScope

Provides scope for declaring or overriding style property values.

Cmn
StyleResolverScope

The type of the scope of StyleResolver.resolve that allows the block to read the fully resolved values from a style.

Cmn
StyleScope

A StyleScope is the receiver scope of a Style lambda.

Cmn
StyleStateScope

An interface that introduces the state property to a Style receiver scope.

Cmn
TextAlignScope

An interface that introduces the textAlign property to a Style receiver scope.

Cmn
TextDecorationScope

An interface that introduces the textDecoration property to a Style receiver scope.

Cmn
TextDirectionScope

An interface that introduces the textDirection property to a Style receiver scope.

Cmn
TextIndentScope

An interface that introduces the textIndent property to a Style receiver scope.

Cmn
TextMotionScope

An interface that introduces the textMotion property to a Style receiver scope.

Cmn
TextStyleScope

An interface that introduces the textStyle property to a Style receiver scope.

Cmn
TextStyleStyleScope

An interface that introduces the text property to a Style receiver scope.

Cmn
TransformOriginScope

An interface that introduces the transform origin properties to a Style receiver scope.

Cmn
TranslationScope

An interface that introduces the translation properties to a Style receiver scope.

Cmn
ZIndexScope

An interface that introduces the zIndex property to a Style receiver scope.

Cmn

Classes

AppearanceScope

The scope of the block in the appearance modifier.

Cmn
Breadth

Specifies dimension breadths for styling.

Cmn
Breadth.Distance

Specifies absolute breadth in Dp.

Cmn
Breadth.Fraction

Specifies relative breadth as a fraction of available space.

Cmn
Breadth.None

Represents an empty or unspecified breadth.

Cmn
Fill

Specifies visual fill for styling.

Cmn
Fill.Brush

Fills with a GraphicsBrush.

Cmn
Fill.Color

Fills with a solid GraphicsColor.

Cmn
Fill.None

Represents an empty fill with no visual representation.

Cmn
MutableStyleState

The state a style that can be updated to reflect the current state of a component.

Cmn
NestedStyleKey

A key used to identify a style that is being defined by a parent style or applied by a nested styleable composable.

Cmn
PlacementModifierScope

The scope to the block callback in of the placement modifier.

Cmn
ProvidableStyleProperty

Defines a style property whose value can be provided within a style scope.

Cmn
Shadows

Specifies shadow configurations for styling.

Cmn
Shadows.Compound

Configures multiple stacked Shadows.

Cmn
Shadows.Simple

Configures a single Shadow.

Cmn
StyleProperty

Identifies a style property used in style definitions.

Cmn
StyleResolver

A resolver that will resolve the properties of a given style lambda.

Cmn
StyleState

The state a style can use to select property values depending on the state of the component is a style for.

Cmn
StyleStateKey

The key to a StyleState value.

Cmn

Objects

Annotations

ExperimentalFoundationStyleApi
Cmn
StyleScopeMarker

A DslMarker used to ensure that properties excluded by a CustomStyleScope do not resolve to the outer scope.

Cmn

Composables

rememberUpdatedStyleState

Create, remember and update a StyleState for use as a parameter of a androidx.compose.ui.Modifier.styleable modifier.

Cmn

Modifiers

appearance

A modifier that allows drawing a background, border, foreground, and shadows with a single modifier.

Cmn
graphicsLayer

A Modifier.Node that makes content draw into a draw layer.

Cmn
placement

Declares a callback, block, that allows controlling size and placement.The incoming measurement Constraints may override values provided by block, forcing the content to be either smaller or larger.

Cmn
styleAppearance

Transitionary modifier.

Cmn
styleBorderPadding

Transitionary modifier.

Cmn
styleContentPadding

Transitionary modifier.

Cmn
styleExternalPadding

Transitionary modifier.

Cmn
styleGraphicsLayer

Transitionary modifier.

Cmn
stylePlacement

Maps properties set in a style and resolved by styleResolver to values passed to the Modifier.placement modifier.

Cmn
styleResolver

A modifier that binds a StyleResolver to the location in the composition it should resolve properties.

Cmn
styleable

Transitionary modifier.

Cmn

Top-level functions summary

Breadth

Create a Breadth with a distance value of value.

Cmn
Breadth

Create a Breadth with a fraction value of value.

Cmn
CommonStyle

Produce a CommonStyle by merging style1 and style2 where style1 will apply before style2.

Cmn
CommonStyle
@ExperimentalFoundationStyleApi
CommonStyle(
    style1: CommonStyle,
    style2: CommonStyle,
    vararg styles: CommonStyle
)

Produce a CommonStyle that merges all the style parameters together in the order they are provided.

Cmn
Fill

Creates a brush Fill.

Cmn
Fill

Creates a solid color Fill.

Cmn
Fill?

Converts value to a Fill if it is a supported fill type.

Cmn
Shadows

Creates a single Shadows configuration.

Cmn
Shadows

Creates a compound Shadows configuration from multiple shadows.

Cmn
Shadows?

Converts value to Shadows if it is a valid shadow representation.

Cmn
Style

Transitionary modifier.

Cmn
Style

Transitionary modifier.

Cmn
Style
@ExperimentalFoundationStyleApi
Style(style1: Style, style2: Style, style3: Style)

Transitionary modifier.

Cmn
Dp
lerp(a: Dp, b: Dp, t: Float)

A lerp function that allows animating a Dp type.

Cmn
TextUnit
lerp(a: TextUnit, b: TextUnit, t: Float)

A lerp function that allows animating a TextUnit type.

Cmn
ProvidableStyleProperty<T>
@ExperimentalFoundationStyleApi
<T : Any?> styleLocalOf(
    name: String,
    interpolate: (a, b, t: Float) -> T,
    defaultValue: () -> T
)

Creates a new local style property.

Cmn
ProvidableStyleProperty<T>
@ExperimentalFoundationStyleApi
<T : Any?> stylePropertyOf(
    name: String,
    interpolate: (a, b, t: Float) -> T,
    defaultValue: () -> T
)

Creates a new style property.

Cmn

Extension functions summary

Unit

Specifies a Style whose properties will be animated to when they change.

Cmn
Unit

Specifies a Style whose properties will be animated to when they change, using the provided AnimationSpec.

Cmn
inline Unit
@ExperimentalFoundationStyleApi
<ScopeT : CustomStyleScope, StyleT : CustomStyle<ScopeT>> ScopeT.apply(
    style: StyleT
)

Apply style to the current StyleScope.

Cmn
Unit

Sets a border for the component with the specified width and brush.

Cmn
Unit

Sets a solid border for the component with the specified width and color.

Cmn
Unit

Defines a Style to be applied when the component is StyleState.isChecked is true.

Cmn
Unit

Sets the padding for the component's content.

Cmn
Unit

Sets the padding for all four edges (top, end, bottom, start) edges of the component's content.

Cmn
Unit

Sets the padding for the vertical (top and bottom) and horizontal (start and end) edges of the component's content.

Cmn
Unit

Sets the padding for all four edges (top, end, bottom, start) edges of the component's content.

Cmn
Unit

Sets the padding for the horizontal (start and end) edges of the component's content.

Cmn
Unit

Sets the padding for the vertical (start and end) edges of the component's content.

Cmn
Unit

Defines a Style to be applied when the component is disabled.

Cmn
Unit

Sets the external padding for the component.

Cmn
Unit

Sets the external padding for all four edges (top, end, bottom, start) of the component.

Cmn
Unit

Sets the external padding for the vertical (top and bottom) and horizontal (start and end) edges of the component.

Cmn
Unit
@ExperimentalFoundationStyleApi
ExternalPaddingScope.externalPadding(
    start: Dp,
    top: Dp,
    end: Dp,
    bottom: Dp
)

Sets the external padding for all four edges (top, end, bottom, start) of the component.

Cmn
Unit

Sets the external padding for the horizontal (start and end) edges of the component.

Cmn
Unit

Sets the external padding for the vertical (start and end) edges of the component.

Cmn
Unit

Sets the height of the component to fill the parent's available height (equivalent to height(1.0f)).

Cmn
Unit

Sets the width and height of the component to fill the parent's available space (equivalent to width(1.0f) and height(1.0f)).

Cmn
Unit

Sets the width of the component to fill the parent's available width (equivalent to width(1.0f)).

Cmn
Unit

Defines a Style to be applied when the component is focused.

Cmn
inline T
@ExperimentalFoundationStyleApi
<T : Any?> StylePropertyAccessorScope.getOrElse(
    property: StyleProperty<T>,
    crossinline defaultValue: () -> T
)

Returns the resolved value of property if set, or the result of defaultValue.

Cmn
Unit

Defines a Style to be applied when the component is hovered.

Cmn
inline Unit
@ExperimentalFoundationStyleApi
<T : Any?> StylePropertyAccessorScope.ifSet(
    property: StyleProperty<T>,
    crossinline block: (T) -> Unit
)

Call block when property has been provided.

Cmn
inline Unit
@ExperimentalFoundationStyleApi
<R : T, T : Any?> StylePropertyAccessorScope.ifSetAs(
    property: StyleProperty<T>,
    crossinline block: (R) -> Unit
)

Call block when property has been provided and the value is of type R.

Cmn
Unit

Constrains the maximum size (width and height) of the component.

Cmn
Unit

Constrains the maximum width and height of the component.

Cmn
Unit

Constrains the minimum size (width and height) of the component.

Cmn
Unit

Constrains the minimum width and height of the component.

Cmn
Unit

Defines a Style to be applied when the component is pressed.

Cmn
Unit

Rotates the component around the X-axis, Y-axis and Z-axis (perpendicular to the screen) through its center.

Cmn
Unit

Scales the component uniformly (both horizontally and vertically) around its center pivot point.

Cmn
Unit
@ExperimentalFoundationStyleApi
ScaleScope.scale(
    x: @FloatRange(from = 0.0) Float,
    y: @FloatRange(from = 0.0) Float
)

Scales the component uniformly (both horizontally and vertically) around its center pivot point.

Cmn
Unit

Defines a Style to be applied when the component is StyleState.isSelected is true.

Cmn
Unit

Sets the preferred width and height of the component to the same value.

Cmn
Unit

Sets the preferred width and height of the component using a DpSize object.

Cmn
Unit

Sets the preferred width and height of the component.

Cmn
Unit

A helper function to implement state reading extension functions such as StyleScope.pressed for use with Boolean states.

Cmn
infix CommonStyle

Merge this style with another style where this style will be applied before the other style.

Cmn
infix Style

Transitionary modifier.

Cmn
CommonStyle

Transitionary modifier.

Cmn
Unit

Offset percentage along the x and y-axis for which contents are rotated and scaled.

Cmn
Unit

Translates (moves) the component by the given Offset.

Cmn
Unit
@ExperimentalFoundationStyleApi
TranslationScope.translation(
    x: @FloatRange(from = 0.0) Float,
    y: @FloatRange(from = 0.0) Float
)

Translates (moves) the component horizontally and vertically.

Cmn
Unit

Defines a Style to be applied when the component is StyleState.triStateToggle is ToggleableState.Indeterminate.

Cmn
Unit

Defines a Style to be applied when the component is StyleState.triStateToggle is ToggleableState.Off.

Cmn
Unit

Defines a Style to be applied when the component is StyleState.triStateToggle is ToggleableState.On.

Cmn

Extension properties summary

Top-level functions

@ExperimentalFoundationStyleApi
fun Breadth(value: Dp): Breadth

Create a Breadth with a distance value of value.

@ExperimentalFoundationStyleApi
fun Breadth(value: Float): Breadth

Create a Breadth with a fraction value of value.

@ExperimentalFoundationStyleApi
fun CommonStyle(style1: CommonStyle, style2: CommonStyle): CommonStyle

Produce a CommonStyle by merging style1 and style2 where style1 will apply before style2.

Parameters
style1: CommonStyle

the first style to merge that will be applied first.

style2: CommonStyle

the second style that will be applied second.

Returns
CommonStyle

a merged style of style1 and style2

@ExperimentalFoundationStyleApi
fun CommonStyle(
    style1: CommonStyle,
    style2: CommonStyle,
    vararg styles: CommonStyle
): CommonStyle

Produce a CommonStyle that merges all the style parameters together in the order they are provided. Merging removes instances of the default empty CommonStyle as well as flattening the merged styles. For example Common(CommonStyle, CommonStyle, someStyle)`` will return someStyle` as the first two parameters are empty.

Parameters
style1: CommonStyle

the first style to merge that will be applied first.

style2: CommonStyle

the second style that will be applied second.

vararg styles: CommonStyle

the rest of the parameter list that will be applied, in order, after style2

Returns
CommonStyle

a merged style of all the parameters in parameter order.

@ExperimentalFoundationStyleApi
fun Fill(brush: Brush): Fill

Creates a brush Fill.

Parameters
brush: Brush

gradient or shader brush to fill with

@ExperimentalFoundationStyleApi
fun Fill(color: Color): Fill

Creates a solid color Fill.

Parameters
color: Color

color to fill with

@ExperimentalFoundationStyleApi
fun Fill(value: Any?): Fill?

Converts value to a Fill if it is a supported fill type. Returns null otherwise.

Parameters
value: Any?

object to convert to a Fill

@ExperimentalFoundationStyleApi
fun Shadows(shadow: Shadow): Shadows

Creates a single Shadows configuration.

Parameters
shadow: Shadow

shadow details

@ExperimentalFoundationStyleApi
fun Shadows(vararg shadows: Shadow): Shadows

Creates a compound Shadows configuration from multiple shadows.

Parameters
vararg shadows: Shadow

list of shadow details

@ExperimentalFoundationStyleApi
fun Shadows(value: Any?): Shadows?

Converts value to Shadows if it is a valid shadow representation.

Parameters
value: Any?

object to convert to Shadows

@ExperimentalFoundationStyleApi
fun Style(vararg styles: Style): Style

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

Combine multiple Style objects together. Styles whose argument positions are further "to the right" will override styles to the left of them, on a per-property basis.

@ExperimentalFoundationStyleApi
fun Style(style1: Style, style2: Style): Style

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

Combine multiple Style objects together. Styles whose argument positions are further "to the right" will override styles to the left of them, on a per-property basis.

@ExperimentalFoundationStyleApi
fun Style(style1: Style, style2: Style, style3: Style): Style

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

Combine multiple Style objects together. Styles whose argument positions are further "to the right" will override styles to the left of them, on a per-property basis.

fun lerp(a: Dp, b: Dp, t: Float): Dp

A lerp function that allows animating a Dp type.

fun lerp(a: TextUnit, b: TextUnit, t: Float): TextUnit

A lerp function that allows animating a TextUnit type.

@ExperimentalFoundationStyleApi
fun <T : Any?> styleLocalOf(
    name: String,
    interpolate: (a, b, t: Float) -> T = ::defaultInterpolate,
    defaultValue: () -> T
): ProvidableStyleProperty<T>

Creates a new local style property.

Local style properties inherit their values down the layout tree hierarchy.

Defining a local style property using styleLocalOf produces a style property that will use a jump-cut halfway through the animation (except if the type implements Interpolatable as described below). Use the interpolate instead in order to specify the interpolation function to use for an animatable property.

If the type supports Interpolatable, such as Brush, styleLocalOf will use the Interpolatable implementation instead of a jump-cut.

Parameters
name: String

debug/tooling name for the property

interpolate: (a, b, t: Float) -> T = ::defaultInterpolate

interpolate the values a and b on t which is a fraction between 0f and 1f

defaultValue: () -> T

fallback value provider when the property is not provided

stylePropertyOf

@ExperimentalFoundationStyleApi
fun <T : Any?> stylePropertyOf(
    name: String,
    interpolate: (a, b, t: Float) -> T = ::defaultInterpolate,
    defaultValue: () -> T
): ProvidableStyleProperty<T>

Creates a new style property.

Defining a style property using stylePropertyOf produces a style property that will use a jump-cut halfway through the animation (except if the type implements Interpolatable as described below, and a select number of well-known types such as Dp, Float, Int, Long, Color and TextUnit). For types that do not support Interpolatable, it is recommended that a type specific interpolate lambda be supplied, even for types like Dp that are handled by default, to specify how to interpolate the values of T during animation.

If the type supports Interpolatable, such as Brush, stylePropertyOf will use the Interpolatable implementation instead of a jump-cut.

Parameters
name: String

debug/tooling name for the property

interpolate: (a, b, t: Float) -> T = ::defaultInterpolate

interpolate the values a and b on t which is a fraction between 0f and 1f

defaultValue: () -> T

fallback value provider when the property is not provided

Extension functions

AnimateStyleScope.animate

@ExperimentalFoundationStyleApi
fun AnimateStyleScope.animate(block: () -> Unit): Unit

Specifies a Style whose properties will be animated to when they change. This uses a default animation specification. This allows for smooth transitions between style states without manual animation setup. A androidx.compose.animation.core.spring will be used for the animation for both animating to and from the style.

Parameters
block: () -> Unit

The target Style whose properties should be animated.

See also
Style

AnimateStyleScope.animate

@ExperimentalFoundationStyleApi
fun AnimateStyleScope.animate(spec: AnimationSpec<Float>, block: () -> Unit): Unit

Specifies a Style whose properties will be animated to when they change, using the provided AnimationSpec. This allows for smooth transitions between style states with custom animation curves. The same animation spec will be used for animating both to and from the style.

Parameters
spec: AnimationSpec<Float>

The AnimationSpec to use for the animation.

block: () -> Unit

The target Style whose properties should be animated.

See also
Style
AnimationSpec

ScopeT.apply

@ExperimentalFoundationStyleApi
inline fun <ScopeT : CustomStyleScope, StyleT : CustomStyle<ScopeT>> ScopeT.apply(
    style: StyleT
): Unit

Apply style to the current StyleScope. Applying the scope calls the scope applies any properties set in the scope directly.

Parameters
style: StyleT

the style to apply.

BorderScope.border

@ExperimentalFoundationStyleApi
fun BorderScope.border(width: Dp, brush: Brush): Unit

Sets a border for the component with the specified width and brush. The border is drawn on top of the background and the padded content. The border itself does not contribute to the component's layout size (width/height).

Specifying a Dp.Unspecified width will remove the border.

Specifying a Dp.Hairline or 0.dp width will create 1 pixel border regardless of density.

This property is not inherited

Parameters
width: Dp

The width of the border.

brush: Brush

The brush to paint the border (e.g., for gradients).

BorderScope.border

@ExperimentalFoundationStyleApi
fun BorderScope.border(width: Dp, color: Color): Unit

Sets a solid border for the component with the specified width and color. The border is drawn on top of the background and the padded content. The border itself does not contribute to the component's layout size (width/height).

Specifying a Dp.Unspecified width will remove the border.

Specifying a Dp.Hairline or 0.dp width will create 1 pixel border regardless of density.

This property is not inherited

Parameters
width: Dp

The width of the border.

color: Color

The color of the border.

StyleStateScope.checked

@ExperimentalFoundationStyleApi
fun StyleStateScope.checked(block: () -> Unit): Unit

Defines a Style to be applied when the component is StyleState.isChecked is true. The properties within the provided block will override or merge with the base style of the component when a toggle interaction is detected.

T.contentPadding

@ExperimentalFoundationStyleApi
fun <T : ContentPaddingScope & CompositionLocalAccessorScope> T.contentPadding(
    paddingValues: PaddingValues
): Unit

Sets the padding for the component's content. Content padding is the space between the component's border (if any) and its content. The width/height of the component includes content padding.

This property is not inherited

Parameters
paddingValues: PaddingValues

The PaddingValues to apply to the content.

ContentPaddingScope.contentPadding

@ExperimentalFoundationStyleApi
fun ContentPaddingScope.contentPadding(value: Dp): Unit

Sets the padding for all four edges (top, end, bottom, start) edges of the component's content. Content padding is the space between the component's border (if any) and its content. The width/height of the component includes content padding.

This property is not inherited

Parameters
value: Dp

The amount of padding to apply to all four edges.

ContentPaddingScope.contentPadding

@ExperimentalFoundationStyleApi
fun ContentPaddingScope.contentPadding(horizontal: Dp, vertical: Dp): Unit

Sets the padding for the vertical (top and bottom) and horizontal (start and end) edges of the component's content. Content padding is the space between the component's border (if any) and its content. The width/height of the component includes content padding.

This property is not inherited

Parameters
horizontal: Dp

The padding for the start and end edges.

vertical: Dp

The padding for the top and bottom edges.

ContentPaddingScope.contentPadding

@ExperimentalFoundationStyleApi
fun ContentPaddingScope.contentPadding(start: Dp, top: Dp, end: Dp, bottom: Dp): Unit

Sets the padding for all four edges (top, end, bottom, start) edges of the component's content. Content padding is the space between the component's border (if any) and its content. The width/height of the component includes content padding.

This property is not inherited

Parameters
start: Dp

The padding for the start edge.

top: Dp

The padding for the top edge.

end: Dp

The padding for the end edge.

bottom: Dp

The padding for the bottom edge.

ContentPaddingScope.contentPaddingHorizontal

@ExperimentalFoundationStyleApi
fun ContentPaddingScope.contentPaddingHorizontal(value: Dp): Unit

Sets the padding for the horizontal (start and end) edges of the component's content. Content padding is the space between the component's border (if any) and its content. The width/height of the component includes content padding.

This property is not inherited

Parameters
value: Dp

The amount of padding to apply to both start and end edges.

ContentPaddingScope.contentPaddingVertical

@ExperimentalFoundationStyleApi
fun ContentPaddingScope.contentPaddingVertical(value: Dp): Unit

Sets the padding for the vertical (start and end) edges of the component's content. Content padding is the space between the component's border (if any) and its content. The width/height of the component includes content padding.

This property is not inherited

Parameters
value: Dp

The amount of padding to apply to both top and bottom edges.

StyleStateScope.disabled

@ExperimentalFoundationStyleApi
fun StyleStateScope.disabled(block: () -> Unit): Unit

Defines a Style to be applied when the component is disabled. The properties within the provided value Style will override or merge with the base style of the component when the style state for the component is disabled.

Parameters
block: () -> Unit

The Style to apply on hover.

See also
isEnabled

T.externalPadding

@ExperimentalFoundationStyleApi
fun <T : ExternalPaddingScope & CompositionLocalAccessorScope> T.externalPadding(
    paddingValues: PaddingValues
): Unit

Sets the external padding for the component. The external padding is the space between the edge of the component and its border (if any). The width/height of the component includes external padding.

This property is not inherited

Parameters
paddingValues: PaddingValues

The PaddingValues to apply to the external padding.

ExternalPaddingScope.externalPadding

@ExperimentalFoundationStyleApi
fun ExternalPaddingScope.externalPadding(value: Dp): Unit

Sets the external padding for all four edges (top, end, bottom, start) of the component. The external padding is the space between the edge of the component and its border (if any). The width/height of the component includes external padding.

This property is not inherited

Parameters
value: Dp

The amount of padding to apply to all four edges.

ExternalPaddingScope.externalPadding

@ExperimentalFoundationStyleApi
fun ExternalPaddingScope.externalPadding(horizontal: Dp, vertical: Dp): Unit

Sets the external padding for the vertical (top and bottom) and horizontal (start and end) edges of the component. The external padding is the space between the edge of the component and its border (if any). The width/height of the component includes external padding.

This property is not inherited

Parameters
horizontal: Dp

The padding for the start and end edges.

vertical: Dp

The padding for the top and bottom edges.

ExternalPaddingScope.externalPadding

@ExperimentalFoundationStyleApi
fun ExternalPaddingScope.externalPadding(
    start: Dp,
    top: Dp,
    end: Dp,
    bottom: Dp
): Unit

Sets the external padding for all four edges (top, end, bottom, start) of the component. The external padding is the space between the edge of the component and its border (if any). The width/height of the component includes external padding.

This property is not inherited

Parameters
start: Dp

The padding for the start edge.

top: Dp

The padding for the top edge.

end: Dp

The padding for the end edge.

bottom: Dp

The padding for the bottom edge.

ExternalPaddingScope.externalPaddingHorizontal

@ExperimentalFoundationStyleApi
fun ExternalPaddingScope.externalPaddingHorizontal(value: Dp): Unit

Sets the external padding for the horizontal (start and end) edges of the component. The external padding is the space between the edge of the component and its border (if any). The width/height of the component includes external padding.

This property is not inherited

Parameters
value: Dp

The amount of padding to apply to both start and end edges.

ExternalPaddingScope.externalPaddingVertical

@ExperimentalFoundationStyleApi
fun ExternalPaddingScope.externalPaddingVertical(value: Dp): Unit

Sets the external padding for the vertical (start and end) edges of the component. The external padding is the space between the edge of the component and its border (if any). The width/height of the component includes external padding.

This property is not inherited

Parameters
value: Dp

The amount of padding to apply to both top and bottom edges.

SizeScope.fillHeight

@ExperimentalFoundationStyleApi
fun SizeScope.fillHeight(): Unit

Sets the height of the component to fill the parent's available height (equivalent to height(1.0f)). The specified height includes any padding.

This property is not inherited

SizeScope.fillSize

@ExperimentalFoundationStyleApi
fun SizeScope.fillSize(): Unit

Sets the width and height of the component to fill the parent's available space (equivalent to width(1.0f) and height(1.0f)). The specified size includes any padding.

This property is not inherited

SizeScope.fillWidth

@ExperimentalFoundationStyleApi
fun SizeScope.fillWidth(): Unit

Sets the width of the component to fill the parent's available width (equivalent to width(1.0f)). The specified width includes any padding.

This property is not inherited

StyleStateScope.focused

@ExperimentalFoundationStyleApi
fun StyleStateScope.focused(block: () -> Unit): Unit

Defines a Style to be applied when the component is focused. The properties within the provided value Style will override or merge with the base style of the component when a focus interaction is detected.

Parameters
block: () -> Unit

The Style to apply on focus.

StylePropertyAccessorScope.getOrElse

@ExperimentalFoundationStyleApi
inline fun <T : Any?> StylePropertyAccessorScope.getOrElse(
    property: StyleProperty<T>,
    crossinline defaultValue: () -> T
): T

Returns the resolved value of property if set, or the result of defaultValue.

Parameters
property: StyleProperty<T>

property to retrieve

crossinline defaultValue: () -> T

fallback calculation when property is not set

StyleStateScope.hovered

@ExperimentalFoundationStyleApi
fun StyleStateScope.hovered(block: () -> Unit): Unit

Defines a Style to be applied when the component is hovered. The properties within the provided value Style will override or merge with the base style of the component when a hover interaction is detected.

Parameters
block: () -> Unit

The Style to apply on hover.

StylePropertyAccessorScope.ifSet

@ExperimentalFoundationStyleApi
inline fun <T : Any?> StylePropertyAccessorScope.ifSet(
    property: StyleProperty<T>,
    crossinline block: (T) -> Unit
): Unit

Call block when property has been provided.

Parameters
property: StyleProperty<T>

the property to check.

crossinline block: (T) -> Unit

called when property has been provided and is called with the resolved value of property as a parameter.

StylePropertyAccessorScope.ifSetAs

@ExperimentalFoundationStyleApi
inline fun <R : T, T : Any?> StylePropertyAccessorScope.ifSetAs(
    property: StyleProperty<T>,
    crossinline block: (R) -> Unit
): Unit

Call block when property has been provided and the value is of type R.

Parameters
<R : T>

the value of R is required to be.

<T : Any?>

the type of the property inferred from property

property: StyleProperty<T>

the property to check.

crossinline block: (R) -> Unit

called when property has been provided and is called with the resolved value of property as a parameter.

MaxSizeScope.maxSize

@ExperimentalFoundationStyleApi
fun MaxSizeScope.maxSize(size: DpSize): Unit

Constrains the maximum size (width and height) of the component. The component's dimensions, including padding, will be at most these values.

This property is not inherited

Parameters
size: DpSize

The maximum size (DpSize).

MaxSizeScope.maxSize

@ExperimentalFoundationStyleApi
fun MaxSizeScope.maxSize(width: Dp, height: Dp): Unit

Constrains the maximum width and height of the component. The component's dimensions, including padding, will be at most these values.

This property is not inherited

Parameters
width: Dp

The maximum width.

height: Dp

The maximum height.

MinSizeScope.minSize

@ExperimentalFoundationStyleApi
fun MinSizeScope.minSize(size: DpSize): Unit

Constrains the minimum size (width and height) of the component. The component's dimensions, including padding, will be at least these values.

This property is not inherited

Parameters
size: DpSize

The minimum size (DpSize).

MinSizeScope.minSize

@ExperimentalFoundationStyleApi
fun MinSizeScope.minSize(width: Dp, height: Dp): Unit

Constrains the minimum width and height of the component. The component's dimensions, including padding, will be at least these values.

This property is not inherited

Parameters
width: Dp

The minimum width.

height: Dp

The minimum height.

StyleStateScope.pressed

@ExperimentalFoundationStyleApi
fun StyleStateScope.pressed(block: () -> Unit): Unit

Defines a Style to be applied when the component is pressed. The properties within the provided value Style will override or merge with the base style of the component when a press interaction is detected.

Parameters
block: () -> Unit

The Style to apply on press.

RotationScope.rotation

@ExperimentalFoundationStyleApi
fun RotationScope.rotation(x: Float, y: Float, z: Float): Unit

Rotates the component around the X-axis, Y-axis and Z-axis (perpendicular to the screen) through its center.

This property is not inherited

Parameters
x: Float

The x-axis rotation angle in degrees.

y: Float

The x-axis rotation angle in degrees.

z: Float

The x-axis rotation angle in degrees.

ScaleScope.scale

@ExperimentalFoundationStyleApi
fun ScaleScope.scale(value: @FloatRange(from = 0.0) Float): Unit

Scales the component uniformly (both horizontally and vertically) around its center pivot point.

Setting scale will override the horizontal scaling set by a previous call to ScaleScope.scaleX and the previous vertical scaling set by calling ScaleScope.scaleY.

This property is not inherited

Parameters
value: @FloatRange(from = 0.0) Float

The scaling factor for both X and Y axes. 1.0f is no scale.

ScaleScope.scale

@ExperimentalFoundationStyleApi
fun ScaleScope.scale(
    x: @FloatRange(from = 0.0) Float,
    y: @FloatRange(from = 0.0) Float
): Unit

Scales the component uniformly (both horizontally and vertically) around its center pivot point.

Setting scale will override the horizontal scaling set by a previous call to ScaleScope.scaleX and the previous vertical scaling set by calling ScaleScope.scaleY.

This property is not inherited

Parameters
x: @FloatRange(from = 0.0) Float

The scaling factor for X axes. 1.0f is no scale.

y: @FloatRange(from = 0.0) Float

The scaling factor for Y axes. 1.0f is no scale.

StyleStateScope.selected

@ExperimentalFoundationStyleApi
fun StyleStateScope.selected(block: () -> Unit): Unit

Defines a Style to be applied when the component is StyleState.isSelected is true. The properties within the provided block Style will override or merge with the base style of the component when a toggle interaction is detected.

Parameters
block: () -> Unit

The Style to apply on press.

See also
isSelected

SizeScope.size

@ExperimentalFoundationStyleApi
fun SizeScope.size(value: Dp): Unit

Sets the preferred width and height of the component to the same value. The actual size will also depend on the parent's constraints and other modifiers. The specified size includes any padding.

This property is not inherited

Parameters
value: Dp

The preferred width and height in Dp.

See also
size

SizeScope.size

@ExperimentalFoundationStyleApi
fun SizeScope.size(value: DpSize): Unit

Sets the preferred width and height of the component using a DpSize object. The actual size will also depend on the parent's constraints and other modifiers. The specified size includes any padding.

This property is not inherited

Parameters
value: DpSize

The preferred size.

See also
size

SizeScope.size

@ExperimentalFoundationStyleApi
fun SizeScope.size(width: Dp, height: Dp): Unit

Sets the preferred width and height of the component. The actual size will also depend on the parent's constraints and other modifiers. The specified dimensions includes both contentPadding and externalPadding.

This property is not inherited

Parameters
width: Dp

The preferred width in Dp.

height: Dp

The preferred height in Dp.

See also
size

StyleStateScope.state

@ExperimentalFoundationStyleApi
fun StyleStateScope.state(key: StyleStateKey<Boolean>, block: () -> Unit): Unit

A helper function to implement state reading extension functions such as StyleScope.pressed for use with Boolean states.

Custom style states can use this function to implement start reading functions to be consistent with the predefined state reading functions.

import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.style.CustomStyle
import androidx.compose.foundation.style.Style
import androidx.compose.foundation.style.StyleScope
import androidx.compose.foundation.style.StyleStateKey
import androidx.compose.foundation.style.rememberUpdatedStyleState
import androidx.compose.foundation.style.state
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

// Create a new StyleStateKey
val playingStateKey = StyleStateKey(false)

// In the module scope are the following declarations:
//
//    // A custom style scope which has all the properties of StyleScope
//    interface MediaPlayerStyleScope : StyleScope
//
//    // A custom style type
//    fun interface MediaPlayerStyle : CustomStyle<MediaPlayerStyleScope> {
//        companion object : MediaPlayerStyle {
//            override fun MediaPlayerStyleScope.applyStyle() { }
//        }
//    }

// Introduce a function to convert the custom style to a Style
fun MediaPlayerStyle.toStyle(): Style = Style {
    val scope = object : StyleScope by this, MediaPlayerStyleScope {}
    with(scope) { applyStyle() }
}

// Introduce an extension function to read the style state. This will only be
// available in a MediaPlayerStyle.
fun MediaPlayerStyleScope.playerPlaying(block: () -> Unit) {
    state(playingStateKey, block)
}

// The MediaPlayer composable
@Suppress("UNUSED_PARAMETER")
@Composable
fun MediaPlayer(
    url: String,
    modifier: Modifier = Modifier,
    style: MediaPlayerStyle = MediaPlayerStyle,
    playing: Boolean = true,
) {
    val styleState =
        rememberUpdatedStyleState(null) { state -> state[playingStateKey] = playing }
    Box(modifier = modifier.styleable(styleState, style.toStyle())) {
        // Implementation of the media player
    }
}

// Using the style in a composable that sets the state.
MediaPlayer(
    url = "https://example.com/media/video",
    style = {
        borderColor(Color.Gray)

        // This only sets the border color to green when the media player is playing
        playerPlaying { borderColor(Color.Green) }
    },
)
Parameters
key: StyleStateKey<Boolean>

the StyleStateKey for the custom state.

block: () -> Unit

the block to execute when the style state is true.

CommonStyle.then

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

Merge this style with another style where this style will be applied before the other style.

Parameters
other: CommonStyle

the right side of the` operator which will merge after this.

Style.then

@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.

TransformOriginScope.transformOrigin

@ExperimentalFoundationStyleApi
fun TransformOriginScope.transformOrigin(value: TransformOrigin): Unit

Offset percentage along the x and y-axis for which contents are rotated and scaled. The default value of 0.5f, 0.5f indicates the pivot point will be at the midpoint of the left and right as well as the top and bottom bounds of the layer. Default value is TransformOrigin.Center.

Parameters
value: TransformOrigin

The origin of the transform

TranslationScope.translation

@ExperimentalFoundationStyleApi
fun TranslationScope.translation(offset: Offset): Unit

Translates (moves) the component by the given Offset.

This property is not inherited

Parameters
offset: Offset

The translation offset in pixels.

TranslationScope.translation

@ExperimentalFoundationStyleApi
fun TranslationScope.translation(
    x: @FloatRange(from = 0.0) Float,
    y: @FloatRange(from = 0.0) Float
): Unit

Translates (moves) the component horizontally and vertically.

This property is not inherited

Parameters
x: @FloatRange(from = 0.0) Float

The translation amount on the X-axis in pixels.

y: @FloatRange(from = 0.0) Float

The translation amount on the Y-axis in pixels.

StyleStateScope.triStateToggleIndeterminate

@ExperimentalFoundationStyleApi
fun StyleStateScope.triStateToggleIndeterminate(block: () -> Unit): Unit

Defines a Style to be applied when the component is StyleState.triStateToggle is ToggleableState.Indeterminate. The properties within the provided block Style will override or merge with the base style of the component when a toggle interaction is detected.

Parameters
block: () -> Unit

The Style to apply on press.

StyleStateScope.triStateToggleOff

@ExperimentalFoundationStyleApi
fun StyleStateScope.triStateToggleOff(block: () -> Unit): Unit

Defines a Style to be applied when the component is StyleState.triStateToggle is ToggleableState.Off. The properties within the provided block Style will override or merge with the base style of the component when a toggle interaction is detected.

Parameters
block: () -> Unit

The Style to apply on press.

StyleStateScope.triStateToggleOn

@ExperimentalFoundationStyleApi
fun StyleStateScope.triStateToggleOn(block: () -> Unit): Unit

Defines a Style to be applied when the component is StyleState.triStateToggle is ToggleableState.On. The properties within the provided block Style will override or merge with the base style of the component when a toggle interaction is detected.

Parameters
block: () -> Unit

The Style to apply on press.

Extension properties

StylePropertyAccessorScope.contentBrush

@ExperimentalFoundationStyleApi
val StylePropertyAccessorScope.contentBrushBrush?

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

This gives access to the fill value set by ContentColorScope.

StylePropertyAccessorScope.contentColor

@ExperimentalFoundationStyleApi
val StylePropertyAccessorScope.contentColorColor

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

This gives access to the fill value set by ContentColorScope.

StylePropertyAccessorScope.contentFill

@ExperimentalFoundationStyleApi
val StylePropertyAccessorScope.contentFillFill

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

This gives access to the fill value set by ContentColorScope.