---
title: "composed"
description: "Declare a just-in-time composition of a [Modifier] that will be composed for each element it
modifies. [composed] may be used to implement **stateful modifiers** that have instance-specific
state for each modified element, allowing the same [Modifier] instance to be safely reused for
multiple elements while maintaining element-specific state.
If [inspectorInfo] is specified this modifier will be visible to tools during development.
Specify the name and arguments of the original modifier.
[materialize] must be called to create instance-specific modifiers if you are directly applying a
[Modifier] to an element tree node."
type: "modifier"
---
Compose Modifier
Common
```kotlin
fun Modifier.composed(
inspectorInfo: InspectorInfo.() -> Unit = NoInspectorInfo,
factory: @Composable Modifier.() -> Modifier,
): Modifier
```
Declare a just-in-time composition of a `Modifier` that will be composed for each element it
modifies. `composed` may be used to implement **stateful modifiers** that have instance-specific
state for each modified element, allowing the same `Modifier` instance to be safely reused for
multiple elements while maintaining element-specific state.
If `inspectorInfo` is specified this modifier will be visible to tools during development.
Specify the name and arguments of the original modifier.
`materialize` must be called to create instance-specific modifiers if you are directly applying a
`Modifier` to an element tree node.
Common
```kotlin
fun Modifier.composed(
fullyQualifiedName: String,
key1: Any?,
inspectorInfo: InspectorInfo.() -> Unit = NoInspectorInfo,
factory: @Composable Modifier.() -> Modifier,
): Modifier
```
Declare a just-in-time composition of a `Modifier` that will be composed for each element it
modifies. `composed` may be used to implement **stateful modifiers** that have instance-specific
state for each modified element, allowing the same `Modifier` instance to be safely reused for
multiple elements while maintaining element-specific state.
When keys are provided, `composed` produces a `Modifier` that will compare `equals` to another
modifier constructed with the same keys in order to take advantage of caching and skipping
optimizations. `fullyQualifiedName` should be the fully-qualified `import` name for your modifier
factory function, e.g. `com.example.myapp.ui.fancyPadding`.
If `inspectorInfo` is specified this modifier will be visible to tools during development.
Specify the name and arguments of the original modifier.
`materialize` must be called to create instance-specific modifiers if you are directly applying a
`Modifier` to an element tree node.
Common
```kotlin
fun Modifier.composed(
fullyQualifiedName: String,
key1: Any?,
key2: Any?,
inspectorInfo: InspectorInfo.() -> Unit = NoInspectorInfo,
factory: @Composable Modifier.() -> Modifier,
): Modifier
```
Declare a just-in-time composition of a `Modifier` that will be composed for each element it
modifies. `composed` may be used to implement **stateful modifiers** that have instance-specific
state for each modified element, allowing the same `Modifier` instance to be safely reused for
multiple elements while maintaining element-specific state.
When keys are provided, `composed` produces a `Modifier` that will compare `equals` to another
modifier constructed with the same keys in order to take advantage of caching and skipping
optimizations. `fullyQualifiedName` should be the fully-qualified `import` name for your modifier
factory function, e.g. `com.example.myapp.ui.fancyPadding`.
If `inspectorInfo` is specified this modifier will be visible to tools during development.
Specify the name and arguments of the original modifier.
`materialize` must be called to create instance-specific modifiers if you are directly applying a
`Modifier` to an element tree node.
Common
```kotlin
fun Modifier.composed(
fullyQualifiedName: String,
key1: Any?,
key2: Any?,
key3: Any?,
inspectorInfo: InspectorInfo.() -> Unit = NoInspectorInfo,
factory: @Composable Modifier.() -> Modifier,
): Modifier
```
Declare a just-in-time composition of a `Modifier` that will be composed for each element it
modifies. `composed` may be used to implement **stateful modifiers** that have instance-specific
state for each modified element, allowing the same `Modifier` instance to be safely reused for
multiple elements while maintaining element-specific state.
When keys are provided, `composed` produces a `Modifier` that will compare `equals` to another
modifier constructed with the same keys in order to take advantage of caching and skipping
optimizations. `fullyQualifiedName` should be the fully-qualified `import` name for your modifier
factory function, e.g. `com.example.myapp.ui.fancyPadding`.
If `inspectorInfo` is specified this modifier will be visible to tools during development.
Specify the name and arguments of the original modifier.
`materialize` must be called to create instance-specific modifiers if you are directly applying a
`Modifier` to an element tree node.
Common
```kotlin
fun Modifier.composed(
fullyQualifiedName: String,
vararg keys: Any?,
inspectorInfo: InspectorInfo.() -> Unit = NoInspectorInfo,
factory: @Composable Modifier.() -> Modifier,
): Modifier
```
Declare a just-in-time composition of a `Modifier` that will be composed for each element it
modifies. `composed` may be used to implement **stateful modifiers** that have instance-specific
state for each modified element, allowing the same `Modifier` instance to be safely reused for
multiple elements while maintaining element-specific state.
When keys are provided, `composed` produces a `Modifier` that will compare `equals` to another
modifier constructed with the same keys in order to take advantage of caching and skipping
optimizations. `fullyQualifiedName` should be the fully-qualified `import` name for your modifier
factory function, e.g. `com.example.myapp.ui.fancyPadding`.
If `inspectorInfo` is specified this modifier will be visible to tools during development.
Specify the name and arguments of the original modifier.
`materialize` must be called to create instance-specific modifiers if you are directly applying a
`Modifier` to an element tree node.
## Code Examples
### InspectorInfoInComposedModifierSample
```kotlin
@Suppress("UnnecessaryComposedModifier")
@Composable
fun InspectorInfoInComposedModifierSample() {
// let's create your own custom stateful modifier
fun Modifier.myColorModifier(color: Color) =
composed(
// pass inspector information for debug
inspectorInfo =
debugInspectorInfo {
// name should match the name of the modifier
name = "myColorModifier"
// specify a single argument as the value when the argument name is irrelevant
value = color
},
// pass your modifier implementation that resolved per modified element
factory = {
// add your modifier implementation here
Modifier
},
)
}
```
### InspectorInfoInComposedModifierWithArgumentsSample
```kotlin
@Suppress("UnnecessaryComposedModifier")
@Composable
fun InspectorInfoInComposedModifierWithArgumentsSample() {
// let's create your own custom stateful modifier with multiple arguments
fun Modifier.myModifier(width: Dp, height: Dp, color: Color) =
composed(
// pass inspector information for debug
inspectorInfo =
debugInspectorInfo {
// name should match the name of the modifier
name = "myModifier"
// add name and value of each argument
properties["width"] = width
properties["height"] = height
properties["color"] = color
},
// pass your modifier implementation that resolved per modified element
factory = {
// add your modifier implementation here
Modifier
},
)
}
```