New Compose Multiplatform components arrived on Composables UICheck it out →

Modifier in Compose Foundation

background

Common

Draws [shape] with a solid [color] behind the content.

Last updated:

Installation

dependencies {
   implementation("androidx.compose.foundation:foundation:1.7.0-beta04")
}

Overloads

@Stable
fun Modifier.background(
    color: Color,
    shape: Shape = RectangleShape
)

Parameters

namedescription
colorcolor to paint background with
shapedesired shape of the background
@Stable
fun Modifier.background(
    brush: Brush,
    shape: Shape = RectangleShape,
    @FloatRange(from = 0.0, to = 1.0)
    alpha: Float = 1.0f
)

Parameters

namedescription
brushbrush to paint background with
shapedesired shape of the background
alphaOpacity to be applied to the [brush], with 0 being completely transparent and 1 being completely opaque. The value must be between 0 and 1.

Code Examples

DrawBackgroundColor

@Sampled
@Composable
fun DrawBackgroundColor() {
    Text(
        "Text with background",
        Modifier.background(color = Color.Magenta).padding(10.dp)
    )
}

DrawBackgroundShapedBrush

@Sampled
@Composable
fun DrawBackgroundShapedBrush() {
    val gradientBrush = Brush.horizontalGradient(
        colors = listOf(Color.Red, Color.Blue, Color.Green),
        startX = 0.0f,
        endX = 500.0f
    )
    Text(
        "Text with gradient back",
        Modifier.background(brush = gradientBrush, shape = CutCornerShape(8.dp))
            .padding(10.dp)
    )
}