TextOverlayCard
The Text Overlay Card is a component that displays simple content and serves as an entry point to other pages containing more detailed information.
Parameters
Typically a short title or headline for the card.
The modifier to be applied to the card.
An optional label that can be displayed above the title.
Additional content to be displayed on the card, such as a badge or commercial message.
The media container that holds the image content for the card.
The size of the title text, which can be either Large, Medium, or Small.
A boolean indicating whether to show an arrow icon on the card, typically used to indicate that the card is clickable or leads to more content.
The interaction source that will be used to handle interactions with the card, such as focus and hover states.
A lambda function that will be called when the card is clicked. This is where you can define the action to take when the card is interacted with.
See also
Samples
val context = LocalContext.current
val title = "Classic pieces with a modern twist but with sixty characters"
Column(modifier = Modifier.fillMaxWidth(), horizontalAlignment = Alignment.CenterHorizontally) {
TextOverlayCard(
title = title,
modifier = Modifier.fillMaxWidth(),
addon = TextOverlayAddon.Badge(variant = BadgeVariant.Text(label = "New card", size = BadgeSize.Small), color = BadgeColor.Green),
mediaContainer = TextOverlayMediaContainer.Image(painter = painterResource(R.drawable.ic_avatar_person), contentDescription = ""),
titleSize = TextOverlayTitleSize.Medium,
showArrow = true,
onClick = {
Toast.makeText(context, "TextOverlayCard clicked", Toast.LENGTH_SHORT).show()
}
)
}