Compose Component

OutlinedCompactChip

A compact Outlined Wear Material Chip that offers two slots and a specific layout for an icon and label.

OutlinedCompactChipWithIconAndLabel

@Sampled
@Composable
fun OutlinedCompactChipWithIconAndLabel() {
    OutlinedCompactChip(
        onClick = { /* Do something */ },
        enabled = true,
        // CompactChip label should be no more than 1 line of text
        label = { Text("Single line label", maxLines = 1, overflow = TextOverflow.Ellipsis) },
        icon = {
            Icon(
                painter = painterResource(id = R.drawable.ic_airplanemode_active_24px),
                contentDescription = "airplane",
                modifier = Modifier.size(ChipDefaults.SmallIconSize),
            )
        },
    )
}
Jetpack Compose beyond MaterialFree components, screens and templates for apps that don’t look like Google’s. Copy them into your app, or let your coding agent add them.Browse for free

Content updated: