Card

Card

A surface-based container that groups related content and actions.


Installation

./gradlew lumo --add Card

Usage

Basic Card

Card(
    modifier = Modifier
        .fillMaxWidth()
        .padding(16.dp)
) {
    Text(
        text = "Basic Card",
        modifier = Modifier.padding(16.dp)
    )
}

Interactive Card

OutlinedCard(
    onClick = { /* Handle click */ },
    colors = CardDefaults.cardColors(
        containerColor = AppTheme.colors.surface,
        contentColor = AppTheme.colors.onSurface
    ),
    elevation = CardDefaults.cardElevation(
        defaultElevation = 2.dp,
        pressedElevation = 4.dp
    )
) {
    Column(modifier = Modifier.padding(16.dp)) {
        Text("Interactive Card")
        Text("Click me!")
    }
}

API Documentation

Card Types

ComponentDescription
CardBasic card with optional onClick
ElevatedCardCard with default elevation
OutlinedCardCard with border and no default elevation

Parameters

ParameterTypeDescription
modifierModifierModifier for the card
onClick() -> UnitOptional click handler for interactive cards
enabledBooleanWhether the card is interactive when clicked
shapeShapeShape of the card
colorsCardColorsColors for the card container and content
elevationCardElevationElevation values for different states
borderBorderStroke?Optional border for the card
interactionSourceMutableInteractionSourceSource of interactions for the card
content@Composable ColumnScope.() -> UnitContent to display inside the card