background

Modifier in Compose Foundation

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

Last updated: 2024-10-14 12:17

Installation

dependencies {
   implementation("androidx.compose.foundation:foundation:1.8.0-alpha03")
}

Overloads

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

Parameters

name	description
color	color to paint background with
shape	desired 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

name	description
brush	brush to paint background with
shape	desired shape of the background
alpha	Opacity 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

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

DrawBackgroundShapedBrush

@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)
    )
}