Badge
Badge is a non-interactable component for informational purposes.
One component, various use cases. The Badge component cover a wide range of use cases, ranging from a non-interactable text label badge to a badge with numerical values or an icon applied.
In combination with other components, such as Avatar for example, it can be used as a notification or status badge.
Parameters
variant
Text, Icon and Text+Icon variants. BadgeVariant.Text is the only one supporting BadgeSize.Small hence the param is not added to the other variant.
color
Colors of choice for the component background.
modifier
Modifier to be applied to the layout of the component.
See also
Samples
SkapaTheme2(isSystemInDarkTheme()) {
Column {
// Example of the Bade variants
Badge(variant = BadgeVariant.Text(label = "Text"), color = BadgeColor.Gray)
Badge(
variant = BadgeVariant.Icon(iconResource = R.drawable.ic_avatar_person, contentDescription = "contentDescription"),
color = BadgeColor.Black
)
Badge(variant = BadgeVariant.TextIcon(label = "Text", R.drawable.ic_avatar_person), color = BadgeColor.White)
}
}Content copied to clipboard